填坑-十萬個爲何？（15）

簡介:不少概念不清或忘記，從新構建本身的知識體系。天天問本身1~多個問題。我是菜鳥 成爲大神之路!

1. new和instanceof的內部機制？

• 建立一個新對象，同時繼承對象類的原型，即Person.prototype；
• 執行對象類的構造函數，同時該實例的屬性和方法被this所引用，即this指向新構造的實例；
• 若是構造函數return了一個新的「對象」，那麼這個對象就會取代整個new出來的結果。若是構造函數沒有return對象，那麼就會返回步驟1所建立的對象，即隱式返回this。（通常狀況下構造函數不會返回任何值，不過在一些特殊狀況下，若是用戶想覆蓋這個值，能夠選擇返回一個普通的對象來覆蓋。）

用代碼來闡述

// let p = new Person()
let p = (function () {
    let obj = {};
    obj.__proto__ = Person.prototype;
    
    // 其餘賦值語句...
    
    return obj;
})();
複製代碼

下面經過代碼闡述instanceof的內部機制，假設如今有x instanceof y一條語句，則其內部實際作了以下判斷：

while(x.__proto__!==null) {
    if(x.__proto__===y.prototype) {
        return true;
    }
    x.__proto__ = x.__proto__.proto__;
}
if(x.__proto__==null) {return false;}
複製代碼

x會一直沿着隱式原型鏈__proto__向上查找直到x.__proto__.__proto__......===y.prototype爲止，若是找到則返回true，也就是x爲y的一個實例。不然返回false，x不是y的實例。 舉一反三

function F() {}
function O() {}

O.prototype = new F();
var obj = new O();

console.log(obj instanceof O); // true
console.log(obj instanceof F); // true
console.log(obj.__proto__ === O.prototype); // true
console.log(obj.__proto__.__proto__ === F.prototype); // true
複製代碼

複製代碼根據new的內部機制改寫上面代碼

function F() {}
function O() {}

var obj = (function () {
    var obj1 = {};
    obj1.__proto__ = F.prototype; // new F();
    O.prototype = obj1; // O.prototype = new F();
    obj.__proto__ = O.prototype; // new O();
    obj.__proto__ = obj1;
    return obj;
})();
複製代碼

複製代碼結合instanceof內部機制很容易得出正確答案。 若是稍微調整一下代碼順序，結果將迥然不一樣

function F() {}
function O() {}

var obj = new O();
O.prototype = new F();

console.log(obj instanceof O); // false
console.log(obj instanceof F); // false
console.log(obj.__proto__ === O.prototype); // false
console.log(obj.__proto__.__proto__ === F.prototype); // false
複製代碼

參考文章：
①騰訊前端面試篇（一）