免费看黄a级毛片,麻豆国产尤物av尤物在线观看

腳本之家服務(wù)器常用軟件

快捷導(dǎo)航

常用工具

PHP開(kāi)發(fā)工具 python Photoshop 必備軟件

通過(guò)手寫(xiě)instanceof理解原型鏈?zhǔn)纠斀?/h1>

更新時(shí)間：2023年05月05日 15:37:46 作者：一只小菜go

這篇文章主要為大家介紹了通過(guò)手寫(xiě)instanceof理解原型鏈?zhǔn)纠斀?，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪

Instanceof的作用

Instanceof是判斷一個(gè)實(shí)例是否是其父類或者祖先類型的實(shí)例的方法。原理就是Instanceof會(huì)接受兩個(gè)參數(shù)，在查找的過(guò)程中會(huì)先遍歷左邊變量的原型鏈，直到找到右邊變量的prototype；如果查找失敗，則會(huì)返回false。

手寫(xiě)Instanceof

let myInstanceof = (target, origin) => {
    while(target){
        if(target._proto_ = origin.prototype){
            return true
        }
        target = target._proto_
    }
    return false
}
let arr = [1, 2, 3];
console.log(myInstanceof(arr, Array)) //true;
console.log(myInstanceof(arr, Object)) //true;

什么是原型

除null以外的所有js對(duì)象在創(chuàng)建時(shí),都會(huì)關(guān)聯(lián)另一個(gè)對(duì)象，這個(gè)被關(guān)聯(lián)的對(duì)象就是我們常說(shuō)的原型，每一個(gè)對(duì)象都會(huì)從關(guān)聯(lián)的對(duì)象中繼承屬性，例如：

//構(gòu)造函數(shù)
function Person(age){
    this.age = age
}
Person.prototype.name = '張三'
var person = new Person()
console.log(person.name)//張三

當(dāng)通過(guò)構(gòu)造函數(shù)創(chuàng)建實(shí)例后，如果從實(shí)例上尋找某個(gè)屬性值，如果屬性值就存在于這個(gè)實(shí)例上，則會(huì)直接輸出，否則就會(huì)從他的原型對(duì)象中去找。

prototype: 每個(gè)構(gòu)造函數(shù)都有一個(gè)prototype屬性，這個(gè)屬性指向函數(shù)的原型對(duì)象。
__ proto__: 每個(gè)對(duì)象（除了null）都會(huì)有的屬性，這個(gè)屬性指向?qū)ο蟮脑汀?/li>
constructor: 每個(gè)原型都有一個(gè)constructor屬性，指向關(guān)聯(lián)的構(gòu)造函數(shù)。

下面我們用一組輸出來(lái)驗(yàn)證這些信息：

console.log(Person===Person.prototype.constructor) // true
console.log(person.__proto__ == Person.prototype) // true
console.log(person.__proto__.constructor == Person) // true
console.log(person.constructor == Person) // true

解釋一下為什么person.constructor == Person，前面我們說(shuō)過(guò)，實(shí)例上的屬性如果不存在，則會(huì)從他的原型對(duì)象上找。person.constructor == Person其實(shí)就相當(dāng)于person.__ proto__.constructor == Person。

原型的應(yīng)用場(chǎng)景

function Person(name, age) {
    this.name = name
    this.age = age
    this.sayHello = function () {
      console.log("hello，" + this.name);
  }
}

當(dāng)我們每次通過(guò)構(gòu)造函數(shù)創(chuàng)建實(shí)例時(shí)，都會(huì)創(chuàng)建新的新的sayHello方法，如果創(chuàng)建的實(shí)例過(guò)多，就會(huì)造成性能浪費(fèi)。此時(shí)如果將sayHello掛載到構(gòu)造函數(shù)的prototype上，此時(shí)新創(chuàng)建的實(shí)例都可以訪問(wèn)到這個(gè)方法了。

function Person(name, age) {
  this.name = name;
  this.age = age;
}
Person.prototype.sayHello = function () {
  console.log("hello，" + this.name);
};
const person = new Person();
person.name = "張三";
person.sayHello()//hello，張三;

什么是原型鏈

要解釋這個(gè)問(wèn)題，我們首先要理解好構(gòu)造函數(shù)，原型和實(shí)例之間的關(guān)系：每個(gè)構(gòu)造函數(shù)都有一個(gè)原型對(duì)象，原型對(duì)象都有一個(gè)指向其對(duì)應(yīng)的構(gòu)造函數(shù)的指針，而實(shí)例都包含一個(gè)指向原型對(duì)象的內(nèi)部指針。

接下來(lái)，如果我們讓原型對(duì)象同時(shí)等于一個(gè)其他的實(shí)例呢？

此時(shí)原型對(duì)象中包含一個(gè)指向其他原型的指針，另一個(gè)原型中也包含著一個(gè)指向另一個(gè)構(gòu)造函數(shù)的指針。假如另一個(gè)原型又是另一個(gè)類型的實(shí)例，那么上述關(guān)系依然成立。如此層層遞進(jìn)，就構(gòu)成了實(shí)例與原型的鏈條。就是我們常說(shuō)的原型鏈。

簡(jiǎn)單來(lái)說(shuō)，就是如果從實(shí)例上尋找某個(gè)屬性值，如果屬性值就存在于這個(gè)實(shí)例上，則會(huì)直接輸出，否則就會(huì)從他的原型對(duì)象中去找。而原型對(duì)象中也沒(méi)有的話，則會(huì)向原型對(duì)象的原型對(duì)象中去找。