對JS繼承的一點思考

wapeyang 發(fā)布于2019-08-19 17:14 / 1280人閱讀

摘要：舉個例子，現(xiàn)在有一個叫做的構(gòu)造函數(shù)，表示貓對象的原型。不受的影響但是通過上面的例子你會發(fā)現(xiàn)用構(gòu)造函數(shù)生成實例對象，它有一個缺點，那就是無法共享屬性和方法。

在Javascript語言中，new命令后面跟的不是類，而是構(gòu)造函數(shù)。

舉個例子，現(xiàn)在有一個叫做CAT的構(gòu)造函數(shù)，表示貓對象的原型。

function CAT(name){
    this.name = name;
    this.age = 3;
}

當(dāng)我們new這個構(gòu)造函數(shù)的時候，就會生成一個貓對象的實例。

var Tom = new CAT("Tom");
var Jack = new CAT("Jack");
Tom.age = 5;
alert(Tom.name+","+Tom.age);  //Tom,5
alert(Jack.name+","+Jack.age);  //Jack,3  不受Tom的影響

但是通過上面的例子你會發(fā)現(xiàn)：用構(gòu)造函數(shù)生成實例對象，它有一個缺點，那就是無法共享屬性和方法。

因為這兩個對象的age屬性是獨立的，修改其中一個，不會影響到另一個。

這樣做的壞處就是會造成資源浪費，那么我們要如何來解決這件事呢，那就需要prototype出場了。

這個屬性包含一個對象（以下簡稱"prototype對象"），所有實例對象需要共享的屬性和方法，都放在這個對象里面；那些不需要共享的屬性和方法，就放在構(gòu)造函數(shù)里面。

CAT的代碼利用prototype就可以改寫成這樣子了：
function CAT(name){
    this.name = name;
}
CAT.prototype.age = 3;
var Tom = new CAT("Tom");
var Jack = new CAT("Jack");
CAT.prototype.age = 5;
alert(Tom.name+","+Tom.age);   //Tom,5
alert(Jack.name+","+Jack.age);  //Jack,5

age屬性放在prototype對象里，是兩個實例對象共享的。只要修改了prototype對象，就會同時影響到兩個實例對象。

云服務(wù)器 GPU云服務(wù)器對人工智能的思考 js求和表的一列數(shù)據(jù) js 繼承 js繼承

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

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

相關(guān)文章

instanceof使用中可能漏掉的一點細節(jié)

摘要：代碼傳送門如上代碼示例，從其運行結(jié)果可知，是等于的原型的，是被對象后返回的函數(shù)，從驗證結(jié)果來看，函數(shù)經(jīng)過的一層包裝，依然不會影響其原型檢測的綁定。前言在面向?qū)ο笳Z言中，一般都有關(guān)鍵字 instanceof 來檢測對象類型，更準(zhǔn)確點來說是檢測對象是哪個類型的實例。那么在 JS 中這個關(guān)鍵字又有什么不同之處呢？此文僅是一篇對 ES 標(biāo)準(zhǔn)中 instanceof 關(guān)鍵字的解讀，并記錄了在此過程中...

lauren_liuling 2019-05-21 19:52 評論0 收藏0
對js原型的思考

摘要：原型鏈上有兩個關(guān)鍵詞和比較重要，是設(shè)置構(gòu)造函數(shù)的原型對象，是聲明原型的構(gòu)造函數(shù)，不管是對象還是函數(shù)，都有一個隱式屬性用來構(gòu)成一條完整原型鏈的指向。思考說到原型，不得不提到原型鏈,js中不管是對象還是方法（也是對象）都有個隱藏屬性_proto_，來表示原型鏈的下一個指向，一般對象是指向Object.prototype,方法是指向Function.prototype,構(gòu)造函數(shù)new出來...

Pocher 2019-08-22 15:59 評論0 收藏0
前端開發(fā)知識點整理

摘要：前言本文主要是有關(guān)前端方面知識按照目前的認知進行的收集歸類概括和整理，涵蓋前端理論與前端實踐兩方面。前言：本文主要是有關(guān)前端方面知識按照 XX 目前的認知進行的收集、歸類、概括和整理，涵蓋『前端理論』與『前端實踐』兩方面。本文會告訴你前端需要了解的知識大致有什么，看上去有很多，但具體你要學(xué)什么，還是要 follow your heart & follow your BOSS。初衷...

Blackjun 2019-08-20 17:14 評論0 收藏0
前端開發(fā)知識點整理

摘要：前言本文主要是有關(guān)前端方面知識按照目前的認知進行的收集歸類概括和整理，涵蓋前端理論與前端實踐兩方面。前言：本文主要是有關(guān)前端方面知識按照 XX 目前的認知進行的收集、歸類、概括和整理，涵蓋『前端理論』與『前端實踐』兩方面。本文會告訴你前端需要了解的知識大致有什么，看上去有很多，但具體你要學(xué)什么，還是要 follow your heart & follow your BOSS。初衷...

Sike 2019-08-29 12:44 評論0 收藏0
前端開發(fā)知識點整理

摘要：前言本文主要是有關(guān)前端方面知識按照目前的認知進行的收集歸類概括和整理，涵蓋前端理論與前端實踐兩方面。前言：本文主要是有關(guān)前端方面知識按照 XX 目前的認知進行的收集、歸類、概括和整理，涵蓋『前端理論』與『前端實踐』兩方面。本文會告訴你前端需要了解的知識大致有什么，看上去有很多，但具體你要學(xué)什么，還是要 follow your heart & follow your BOSS。初衷...

tracy 2019-08-01 16:59 評論0 收藏0