亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

細(xì)說 Javascript 對象篇（二） : 原型對象

lansheng228 / 1437人閱讀

摘要：并沒有類繼承模型，而是使用原型對象進(jìn)行原型式繼承。我們舉例說明原型鏈查找機(jī)制當(dāng)訪問一個(gè)對象的屬性時(shí)，會(huì)從對象本身開始往上遍歷整個(gè)原型鏈，直到找到對應(yīng)屬性為止。原始類型有以下五種型。此外，試圖查找一個(gè)不存在屬性時(shí)將會(huì)遍歷整個(gè)原型鏈。

Javascript 并沒有類繼承模型，而是使用原型對象 prototype 進(jìn)行原型式繼承。
盡管人們經(jīng)常將此看做是 Javascript 的一個(gè)缺點(diǎn)，然而事實(shí)上，原型式繼承比傳統(tǒng)的類繼承模型要更加強(qiáng)大。舉個(gè)例子，在原型式繼承頂端構(gòu)建一個(gè)類模型很簡單，然而反過來則是個(gè)困難得多的任務(wù)。
Javascript 是唯一一個(gè)被廣泛運(yùn)用的原型式繼承的語言，所以理解兩種繼承方式的差異是需要時(shí)間的。

第一個(gè)主要差異就是 Javascript 使用原型鏈來繼承：

function Foo() {
    this.value = 42;
}
Foo.prototype = {
    method: function() {}
};
function Bar() {}

設(shè)置 Bar 的 prototype 為 Foo 的對象實(shí)例：

Bar.prototype = new Foo();
Bar.prototype.foo = "Hello World";

確保 Bar 的構(gòu)造函數(shù)為本身，并新建一個(gè) Bar 對象實(shí)例：

Bar.prototype.constructor = Bar;
var test = new Bar();

下面我們來看下整個(gè)原型鏈的組成：

test [instance of Bar]
    Bar.prototype [instance of Foo]
        { foo: "Hello World" }
        Foo.prototype
            { method: ... }
            Object.prototype
                { toString: ... /* etc. */ }

在上面的例子中，對象 test 將會(huì)同時(shí)繼承 Bar.prototype 和 Foo.prototype。因此它可以訪問定義在 Foo 中的函數(shù) method。當(dāng)然，它也可以訪問屬性 value。需要提到的是，當(dāng) new Bar() 時(shí)并不會(huì)創(chuàng)建一個(gè)新的 Foo 實(shí)例，而是重用它原型對象自帶的 Foo 實(shí)例。同樣，所有的 Bar 實(shí)例都共享同一個(gè) value 屬性。我們舉例說明：

 test1 = new Bar();
 test2 = new Bar();
 Bar.prototype.value = 41;
 test1.value //41
 test2.value//41
原型鏈查找機(jī)制

當(dāng)訪問一個(gè)對象的屬性時(shí)，Javascript 會(huì)從對象本身開始往上遍歷整個(gè)原型鏈，直到找到對應(yīng)屬性為止。如果此時(shí)到達(dá)了原型鏈的頂部，也就是上例中的 Object.prototype，仍然未發(fā)現(xiàn)需要查找的屬性，那么 Javascript 就會(huì)返回 undefined 值。

原型對象的屬性

盡管原型對象的屬性被 Javascript 用來構(gòu)建原型鏈，我們?nèi)匀豢梢灾蒂x給它。但是原始值復(fù)制給 prototype 是無效的，如：

function Foo() {}
Foo.prototype = 1; // no effect

這里講個(gè)本篇的題外話，介紹下什么是原始值:
在 Javascript 中，變量可以存放兩種類型的值，分別是原始值和引用值。

  
1.原始值(primitive value):

  原始值是固定而簡單的值,是存放在棧 stack 中的簡單數(shù)據(jù)段，也就是說，它們的值直接存儲(chǔ)在變量訪問的位置。

  原始類型有以下五種型: Undefined, Null, Boolean, Number, String。


  
2.引用值(reference value):

  引用值則是比較大的對象，存放在堆 heap 中的對象，也就是說，存儲(chǔ)在變量處的值是一個(gè)指針  pointer，指向存儲(chǔ)對象的內(nèi)存處。所有引用類型都集成自 Object。
原型鏈性能問題

如果需要查找的屬性位于原型鏈的上端，那么查找過程對于性能而言無疑會(huì)帶來負(fù)面影響。當(dāng)在性能要求必要嚴(yán)格的場景中這將是需要重點(diǎn)考慮得因素。此外，試圖查找一個(gè)不存在屬性時(shí)將會(huì)遍歷整個(gè)原型鏈。
同樣，當(dāng)遍歷一個(gè)對象的屬性時(shí)，所有在原型鏈上的屬性都將被訪問。

總結(jié)

理解原型式繼承是寫較為復(fù)雜的 Javascript 代碼的前提，同時(shí)要注意代碼中原型鏈的高度。當(dāng)面臨性能瓶頸時(shí)要學(xué)會(huì)將原型鏈拆分開來。此外，要將原型對象 prototype 和原型 __proto__ 區(qū)分開來，這里主要討論原型對象 prototype 就不闡述關(guān)于原型 __proto__ 的問題了，如果有疑惑的話，可以閱讀 @nightire 凡哥的博文《理解 JavaScript（四）》。

參考

http://bonsaiden.github.io/JavaScript-Garden/#object.prototype

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

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/78054.html

相關(guān)文章

  • 細(xì)說 Javascript 函數(shù)篇（二） : this 的工作機(jī)制

    摘要：與其他編程語言相比，對的使用是一套完全不同的機(jī)制。在五種情況下的值是各有不同的。調(diào)用一個(gè)函數(shù)時(shí)在這里，同樣指向全局對象。此時(shí)在函數(shù)內(nèi)，指向新建的對象。盡管，晚綁定初看上去是個(gè)不好的決定，但實(shí)際上這是原型式繼承工作的基礎(chǔ)。 與其他編程語言相比，Javascript 對 this 的使用是一套完全不同的機(jī)制。this 在五種情況下的值是各有不同的。 全局作用域下 this; 當(dāng)在全...

    ZoomQuiet 評論0 收藏0

  • SegmentFault 技術(shù)周刊 Vol.32 - 七夕將至，你的“對象”還好嗎？

    摘要：很多情況下，通常一個(gè)人類，即創(chuàng)建了一個(gè)具體的對象。對象就是數(shù)據(jù)，對象本身不包含方法。類是相似對象的描述，稱為類的定義，是該類對象的藍(lán)圖或原型。在中，對象通過對類的實(shí)體化形成的對象。一類的對象抽取出來。注意中，對象一定是通過類的實(shí)例化來的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了，離年底老媽老爸...

    李昌杰 評論0 收藏0

  • SegmentFault 技術(shù)周刊 Vol.32 - 七夕將至，你的“對象”還好嗎？

    摘要：很多情況下，通常一個(gè)人類，即創(chuàng)建了一個(gè)具體的對象。對象就是數(shù)據(jù)，對象本身不包含方法。類是相似對象的描述，稱為類的定義，是該類對象的藍(lán)圖或原型。在中，對象通過對類的實(shí)體化形成的對象。一類的對象抽取出來。注意中，對象一定是通過類的實(shí)例化來的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了，離年底老媽老爸...

    Lyux 評論0 收藏0

  • SegmentFault 技術(shù)周刊 Vol.32 - 七夕將至，你的“對象”還好嗎？

    摘要：很多情況下，通常一個(gè)人類，即創(chuàng)建了一個(gè)具體的對象。對象就是數(shù)據(jù)，對象本身不包含方法。類是相似對象的描述，稱為類的定義，是該類對象的藍(lán)圖或原型。在中，對象通過對類的實(shí)體化形成的對象。一類的對象抽取出來。注意中，對象一定是通過類的實(shí)例化來的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了，離年底老媽老爸...

    AaronYuan 評論0 收藏0

  • 細(xì)說 Javascript 函數(shù)篇（五） : ?構(gòu)造函數(shù)

    Javascript 中的構(gòu)造函數(shù)與其他語言相比也是不同的。任何通過關(guān)鍵字 new 調(diào)用的函數(shù)都可以當(dāng)做構(gòu)造函數(shù)。 在構(gòu)造函數(shù)體內(nèi)，this 指向新創(chuàng)建的對象。如果構(gòu)造函數(shù)體內(nèi)沒有顯示的 return 表達(dá)式，那么我們就默認(rèn)返回 this，也就是新建的對象。 function Foo() { this.bla = 1; } Foo.prototype.test = function()...

    sPeng 評論0 收藏0

發(fā)表評論

0條評論

lansheng228

男|高級講師

TA的文章

閱讀更多
最新活動(dòng)
閱讀需要支付1元查看
<