成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

原型與原型鏈

dayday_up / 2116人閱讀

摘要：原型屬性在函數(shù)被定義時創(chuàng)建，初始值是一個空對象沒有自身屬性的對象。為新建對象添加方法和屬性的方式利用原型構(gòu)造器中原型屬性幾個相關(guān)方法和屬性判斷一個屬性是自身屬性還是原型屬性。來自知乎的一張圖，很清晰面向?qū)ο缶幊讨改系脑玩湀D

sync github
原型屬性 prototype

在函數(shù)被定義時創(chuàng)建，初始值是一個"空"對象（沒有自身屬性的對象）。

為新建對象添加方法和屬性的方式

利用原型

// 1 構(gòu)造器中
function Gadget(name, color) {
    this.name = name;
}

// 2 原型屬性
Gadget.prototype.price = 66;
幾個相關(guān)方法和屬性

hasOwnProperty() 判斷一個屬性是自身屬性還是原型屬性。

通常，在for in 和 for of 中，需要使用 hasOwnProperty()~

propertyIsEnumerable() 該方法會對所有的非內(nèi)建對象屬性返回 true

const newtoy = new Gadget("webcam");

// 對于內(nèi)建屬性和方法來說，不可枚舉
newtoy.propertyIsEnumerable("constructor"); // false

// 任何來自原型鏈中的屬性都會返回false，包括那些在`for-in`循環(huán)中可枚舉的屬性
newtoy.propertyIsEnumerable("price");   // false

// notice
newtoy.constructor.prototype.propertyIsEnumerable("price"); // true

isPrototypeOf() 判斷當(dāng)前對象是否是另一個對象的原型

Object.getPrototypeOf() ES5適用。獲取對象的原型。效果同 特殊屬性 __proto__

__proto__

notice: 不要在實際的腳本中使用。另，__proto__與prototype的區(qū)別，__proto__實際上是某個實例對象的屬性，而prototype則屬于構(gòu)造器函數(shù)的屬性。
原型陷阱

當(dāng)我們對原型對象執(zhí)行完全替換時，可能會觸發(fā)原型鏈中某種異常

prototype.constructor屬性是不可靠的

體會下面的輸出內(nèi)容

function Dog() {
    this.tail = true;
}
var benji = new Dog();
var rusty = new Dog();

Dog.prototype.say = function() {
    return "Woof!";
};

benji.say();    // "Woof!"
rusty.say();    // "Woof!"
benji.constructor === Dog;  // true
rusty.constructor === Dog;  // true

// 用一個自定義的新對象完全覆蓋掉原有的原型對象
Dog.prototype = {
    paws: 4,
    hair: true,
};

// 發(fā)現(xiàn)通過構(gòu)造函數(shù)創(chuàng)建的對象 prototype 對象并沒有改變
typeof benji.paws;  // undefined
benji.say();    // Woof
typeof benji.__proto__.say; // function
typeof benji.__proto__.paws;    // undefined

// 通過構(gòu)造函數(shù)創(chuàng)建的對象使用新的 prototype 對象
var lucy = new Dog();
lucy.say(); // TypeError: lucy.say is not a function
lucy.paws;  // 4
typeof lucy.__proto__.say; // undefined
typeof lucy.__proto__.paws; // number

//但是！??！注意此時新對象的 constructor 屬性的指向
lucy.constructor;   // function Object(){[native code]}
benji.constructor;  // function Dog() {...}

// solve
Dog.prototype.constructor = Dog;
new Dog().constructor === Dog;  // true
lucy.constructor;   // function Dog() {...}
當(dāng)我們重寫某對象的 prototype 時， 需要重置相應(yīng)的 constructor 屬性。
Summary 
來自知乎的一張圖，很清晰
Reference

《JavaScript面向?qū)ο缶幊讨改稀?/p>

Javascript的原型鏈圖 - wang z

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/89670.html

相關(guān)文章

  • 《javascript高級程序設(shè)計》筆記：原型圖解

    摘要：不理解沒關(guān)系，下面會結(jié)合圖例分析上一篇高級程序設(shè)計筆記創(chuàng)建對象下一篇高級程序設(shè)計筆記繼承參考之原型鏈的解讀三張圖搞懂的原型對象與原型鏈繼承與原型鏈 文章直接從原型圖解開始的，如果對一些概念不太清除，可以結(jié)合后面幾節(jié)查看 1. 圖解原型鏈 1.1 鐵三角關(guān)系（重點） function Person() {}; var p = new Person(); showImg(https://s...

    vspiders 評論0 收藏0

  • 【5】JavaScript 函數(shù)高級——原型與原型鏈深入理解（圖解）

    摘要：探索是如何判斷的表達式如果函數(shù)的顯式原型對象在對象的隱式原型鏈上，返回，否則返回是通過自己產(chǎn)生的實例案例案例重要注意的顯示原型和隱式原型是一樣的。面試題測試題測試題報錯對照下圖理解 原型與原型鏈深入理解（圖解） 原型（prototype） 函數(shù)的 prototype 屬性（圖） 每個函數(shù)都有一個prototype屬性，它默認(rèn)指向一個Object空對象（即稱為：原型對象） 原型對象中有...

    馬龍駒 評論0 收藏0

  • JavaScript中的原型與原型鏈

    摘要：前言作為前端高頻面試題之一，相信很多小伙伴都有遇到過這個問題。 前言 作為前端高頻面試題之一，相信很多小伙伴都有遇到過這個問題。那么你是否清楚完整的了解它呢？ 國際慣例，讓我們先拋出問題： 什么是原型、原型鏈 它們有什么特點 它們能做什么 怎么確定它們的關(guān)系 或許你已經(jīng)有答案，或許你開始有點疑惑，無論是 get 新技能或是簡單的溫習(xí)一次，讓我們一起去探究一番吧 如果文章中有出現(xiàn)紕...

    laoLiueizo 評論0 收藏0

  • 進擊JavaScript之（四）原型與原型鏈

    摘要：每一個由構(gòu)造函數(shù)創(chuàng)建的對象都會默認(rèn)的連接到該神秘對象上。在構(gòu)造方法中也具有類似的功能，因此也稱其為類實例與對象實例一般是指某一個構(gòu)造函數(shù)創(chuàng)建出來的對象，我們稱為構(gòu)造函數(shù)的實例實例就是對象。表示該原型是與什么構(gòu)造函數(shù)聯(lián)系起來的。 本文您將看到以下內(nèi)容： 傳統(tǒng)構(gòu)造函數(shù)的問題 一些相關(guān)概念 認(rèn)識原型 構(gòu)造、原型、實例三角結(jié)構(gòu)圖 對象的原型鏈 函數(shù)的構(gòu)造函數(shù)Function 一句話說明什么...

    XBaron 評論0 收藏0

  • 原型鏈一：原型與原型鏈

    摘要：說白了，原型就是構(gòu)造函數(shù)用來構(gòu)造新實例的模板對象。什么是原型鏈先回答什么是原型。例如這個原型的原型就是這個構(gòu)造函數(shù)的，既這個原型對象。這些原型對象通過像鏈子一樣連起來，就叫做原型鏈。 原型鏈初步學(xué)習(xí) 這篇博客只是我初步理解原型鏈的一個個人學(xué)習(xí)筆記,寫的比較粗略,且有的地方可能理解錯誤. 更多更專業(yè)的關(guān)于原型鏈的解釋請看JavaScript深入之從原型到原型鏈和阮一峰的博客:Javas...

    MudOnTire 評論0 收藏0

  • JavaScript系列--淺析原型鏈與繼承

    摘要：綜上所述有原型鏈繼承，構(gòu)造函數(shù)繼承經(jīng)典繼承，組合繼承，寄生繼承，寄生組合繼承五種方法，寄生組合式繼承，集寄生式繼承和組合繼承的優(yōu)點于一身是實現(xiàn)基于類型繼承的最有效方法。 一、前言 繼承是面向?qū)ο螅∣OP）語言中的一個最為人津津樂道的概念。許多面對對象（OOP）語言都支持兩種繼承方式:：接口繼承 和 實現(xiàn)繼承 。 接口繼承只繼承方法簽名,而實現(xiàn)繼承則繼承實際的方法。由于js中方法沒有簽名...

    draveness 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<