[js高手之路]原型式繼承與寄生式繼承詳解
一、原型式繼承本質(zhì)其實就是個淺拷貝,以一個對象為模板復制出新的對象
function object( o ){ var G = function(){}; G.prototype = o; return new G(); } var obj = { name : 'ghostwu', age : 22, show : function(){ return this.name + ',' + this.age; } }; var obj2 = object( obj ); console.log( obj2.name, obj.age, obj.show() );
object函數(shù)中,以對象o為模板,在object函數(shù)體里面,定義一個構(gòu)造函數(shù),讓構(gòu)造函數(shù)的原型對象(prototype)指向o,
返回構(gòu)造函數(shù)的一個實例,這樣就可以訪問到對象o的所有屬性和方法.
二、因為原型式繼承是個淺拷貝,所以引用類型的數(shù)據(jù)共享在不同的實例之間
function object( o ){ var G = function(){}; G.prototype = o; return new G(); } var obj = { skills : [ 'php', 'javascript' ] }; var obj2 = object( obj ); obj2.skills.push( 'python' ); var obj3 = object( obj ); console.log( obj3.skills ); //php,javascript,python
obj2改變了skills數(shù)組,obj3的skills結(jié)果就是其他實例改變的結(jié)果
三、在es5中,新增了一個函數(shù)Object.create()實現(xiàn)了原型式繼承
var obj = { skills : [ 'php', 'javascript' ] }; var obj2 = Object.create( obj ); obj2.skills.push( 'python' ); var obj3 = Object.create( obj ); console.log( obj3.skills ); //php,javascript,python
四,寄生式繼承就是把原型式繼承再次封裝,然后在對象上擴展新的方法,再把新對象返回
function object( o ){ var G = function(){}; G.prototype = o; return new G(); } function CreateObj( srcObj ){ var dstObj = object( srcObj ); dstObj.sayName = function(){ return this.userName; } return dstObj; } var obj = { userName : 'ghostwu', }; var obj2 = CreateObj( obj ); console.log( obj2.sayName() ); //ghostwu
以上這篇[js高手之路]原型式繼承與寄生式繼承詳解就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關文章
JavaScript異步回調(diào)的Promise模式封裝實例
這篇文章主要介紹了JavaScript異步回調(diào)的Promise模式封裝實例,本文通過分析easyjs的源碼得出,實例均參考easyjs,需要的朋友可以參考下2014-06-06Bootbox將后臺JSON數(shù)據(jù)填充Form表單的實例代碼
通過控制器創(chuàng)建一個Index視圖,寫入下列HTML代碼,這里我創(chuàng)建了一個分部視圖,不創(chuàng)建直接寫在同一個頁面也是一樣的效果。這篇文章主要介紹了Bootbox將后臺JSON數(shù)據(jù)填充Form表單 ,需要的朋友可以參考下2018-09-09js實現(xiàn)hashtable的賦值、取值、遍歷操作實例詳解
這篇文章主要介紹了js實現(xiàn)hashtable的賦值、取值、遍歷操作,結(jié)合實例形式分析了哈希表的原理、哈希鍵值對操作相關技巧,需要的朋友可以參考下2016-12-12