ECMAScript面向对象(三)——之继承
生活随笔
收集整理的這篇文章主要介紹了
ECMAScript面向对象(三)——之继承
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
1.原型鏈方式
主要利用原型對象,讓引用類型A的的prototype屬性指向另一個引用類型的實例,從而繼承另一個引用類型的屬性和方法。
問題
1.無法在創(chuàng)建子類的時候向父類的構(gòu)造函數(shù)傳遞參數(shù)
2.父類中有引用類型的屬性的話,只要子類實例中有操作,所有的都會受到影響
2.借用構(gòu)造函數(shù)
利用函數(shù)的父函數(shù)call方法實現(xiàn)繼承。
問題:1.子類可以繼承父類在構(gòu)造函數(shù)中定義的屬性和方法,但是方法無法復(fù)用 2.但是父類在原型中定義的屬性和方法對子類是不可見的 // 借用構(gòu)造函數(shù) function SuperType(){this.arr=[1,2,3]; }SuperType.prototype.show=function(){console.log(this.arr); }function SubType(){SuperType.call(this); }var sub1=new SubType();sub1.arr.pop();console.log(sub1.arr);//[1,2]var sub2=new SubType();sub2.arr.push(20);console.log(sub2.arr);//[1,2,3,20]// 子類可以繼承父類在構(gòu)造函數(shù)中定義的屬性和方法// 但是父類在原型中定義的屬性和方法對子類是不可見的sub1.show();//sub1.show is not a functionvar sup1=new SuperType();sup1.show();//[1,2,3]
3.組合繼承(原型鏈+構(gòu)造)
function SuperType(fname){this.fileName=fname;this.arr=[1,2,3]; }SuperType.prototype.show=function(){console.log(this.arr); }// 繼承 function SubType(fname,size){SuperType.call(this,fname);//構(gòu)造函數(shù)this.size=size; }// 原型繼承 SubType.prototype = new SuperType(); SubType.prototype.constructor=SubType; //添加新方法 SubType.prototype.showF=function(){console.log("name:"+this.fileName+"\r\n"+"size:"+this.size+"kb"); };var sub1=new SubType("todo.txt",512);sub1.show();sub1.showF();console.log(sub1 instanceof SubType);//trueconsole.log(sub1 instanceof SuperType);//trueconsole.log(sub1 instanceof Object);//true4.原型式繼承
使用一個已存在的實例對象作為,子類的原型對象。
// 原型式繼承 // 用于在一個已有的對象實例上拓展新的方法function object(o){function F(){}F.prototype=o;F.prototype.show=function(){for ( var agr in o){console.log(agr);}}return new F();}var p={arr:[1,2,3],name:"done"}var p1=object(p);p1.show();var p2=object(p);p2.arr.pop();console.log(p2.arr);console.log(p1.arr);5.寄生繼承
// 寄生式繼承function createAn(o){var onew = object(o);//沿用上面的原型式繼承的object函數(shù)onew.show1=function(){//添加自己的方法console.log("show1......");};return onew;}var a1=createAn(p);a1.show1();6.寄生組合繼承(寄生+構(gòu)造+原型鏈)
使用寄生式繼承來繼承超類的原型,然后將結(jié)果指定給子類的原型。
// 寄生組合式繼承 //與原型構(gòu)造組合類似,知識這里使用了一個寄生函數(shù)來實現(xiàn)原型鏈繼承 // // 用寄生的方式將【原型構(gòu)造組合】下面的包裝起來,使用的時候用下面的函數(shù)替換掉組合繼承里面的代碼即可 // SubType.prototype = new SuperType(); // SubType.prototype.constructor=SubType; inheritProto(SubType,SuperType){var proto=object(SuperType.prototype);//用父類的原型創(chuàng)建一個新的對象proto.prototype.constructor=SubType;SubType.prototype=proto;}?
轉(zhuǎn)載于:https://www.cnblogs.com/fanglylu/p/6824564.html
總結(jié)
以上是生活随笔為你收集整理的ECMAScript面向对象(三)——之继承的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 前端资源介绍
- 下一篇: Java虚拟机性能管理神器 - Visu