new&instanceof原理解析及模擬實現

模擬實現new

需知足：

1. 綁定this
2. 新建一個對象
3. 將對象連接到原型
4. 返回新的對象

/**
    * 由於new是關鍵字，因此不能直接覆蓋。
    * 咱們這邊用create來模擬實現。
    */

    function create () {
    let obj = {}
    let Con = [].shift.call(arguments)
    // 連接原型，使得新建對象能夠訪問到構造函數原型上的屬性
    obj.__proto__ = Con.prototype
    // 綁定this
    Con.apply(obj, arguments)
    return obj
    }
複製代碼

構造函數返回值有以下三種狀況：

• 一、有 return ，返回一個對象，實例只能訪問返回對象中的實例
• 二、沒有 return ，即返回 undefined，實例只能訪問到構造函數中的屬性，和狀況1徹底相反。
• 三、返回 undefined 之外的基本類型，等於沒有返回，實例只能訪問到構造函數中的屬性，和狀況1徹底相反。

綜上，因此須要判斷下返回的值是否是一個對象，若是是對象則返回這個對象，否則返回新建立的 obj對象。

/**
    * 由於new是關鍵字，因此不能直接覆蓋。
    * 咱們這邊用create來模擬實現。
    */

    function create () {
    let obj = {}
    let Con = [].shift.call(arguments)
    // 連接原型，使得新建對象能夠訪問到構造函數原型上的屬性
    obj.__proto__ = Con.prototype
    // 綁定this
    let ret = Con.apply(obj, arguments)
    return ret instanceof Object ? ret : obj
    }
複製代碼

// 測試用例
    function Car(color) {
        this.color = color;
    }
    Car.prototype.start = function() {
        console.log(this.color + " car start");
    }

    var car = create(Car, "black");
    car.color;
    // black

    car.start();
    // black car start
複製代碼

模擬實現instanceof

instanceof 運算符用來檢測 constructor.prototype 是否存在於參數 object 的原型鏈上。

function instanceof1 (left, right) {
        // 獲取類型原型
        let prototype = right.prototype
        // 獲取對象原型
        left = left.__proto__
        // 判斷對象的類型是否等於類型的原型
        while (true) {
            if (left === null)
                return false
            if (left === prototype)
                return true
            left = left.__proto__
        }
    }
複製代碼

收工~