生活随笔
收集整理的這篇文章主要介紹了
(转)js实现继承的5种方式
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
js是門(mén)靈活的語(yǔ)言，實(shí)現(xiàn)一種功能往往有多種做法,ECMAScript沒(méi)有明確的繼承機(jī)制，而是通過(guò)模仿實(shí)現(xiàn)的，根據(jù)js語(yǔ)言的本身的特性,js實(shí)現(xiàn)繼承有以下通用的幾種方式
1.使用對(duì)象冒充實(shí)現(xiàn)繼承(該種實(shí)現(xiàn)方式可以實(shí)現(xiàn)多繼承)
實(shí)現(xiàn)原理:讓父類(lèi)的構(gòu)造函數(shù)成為子類(lèi)的方法,然后調(diào)用該子類(lèi)的方法,通過(guò)this關(guān)鍵字給所有的屬性和方法賦值
Js代碼??
function?Parent(firstname)??{??????this.fname=firstname;??????this.age=40;??????this.sayAge=function()??????{??????????console.log(this.age);??????}??}??function?Child(firstname)??{??????this.parent=Parent;??????this.parent(firstname);??????delete?this.parent;??????this.saySomeThing=function()??????{??????????console.log(this.fname);??????????this.sayAge();??????}??}??var?mychild=new??Child("李");??mychild.saySomeThing();?? ?
2.采用call方法改變函數(shù)上下文實(shí)現(xiàn)繼承(該種方式不能繼承原型鏈,若想繼承原型鏈，則采用5混合模式)
實(shí)現(xiàn)原理:改變函數(shù)內(nèi)部的函數(shù)上下文this,使它指向傳入函數(shù)的具體對(duì)象
Js代碼??
function?Parent(firstname)??{??????this.fname=firstname;??????this.age=40;??????this.sayAge=function()??????{??????????console.log(this.age);??????}??}??function?Child(firstname)??{????????this.saySomeThing=function()??????{??????????console.log(this.fname);??????????this.sayAge();??????}?????this.getName=function()?????{?????????return?firstname;?????}????}??var?child=new?Child("張");??Parent.call(child,child.getName());??child.saySomeThing();?? ?
3.采用Apply方法改變函數(shù)上下文實(shí)現(xiàn)繼承(該種方式不能繼承原型鏈,若想繼承原型鏈，則采用5混合模式)
實(shí)現(xiàn)原理:改變函數(shù)內(nèi)部的函數(shù)上下文this,使它指向傳入函數(shù)的具體對(duì)象
Js代碼??
function?Parent(firstname)??{??????this.fname=firstname;??????this.age=40;??????this.sayAge=function()??????{??????????console.log(this.age);??????}??}??function?Child(firstname)??{????????this.saySomeThing=function()??????{??????????console.log(this.fname);??????????this.sayAge();??????}??????this.getName=function()??????{??????????return?firstname;??????}????}??var?child=new?Child("張");??Parent.apply(child,[child.getName()]);??child.saySomeThing();?? ?
4.采用原型鏈的方式實(shí)現(xiàn)繼承
實(shí)現(xiàn)原理:使子類(lèi)原型對(duì)象指向父類(lèi)的實(shí)例以實(shí)現(xiàn)繼承,即重寫(xiě)類(lèi)的原型,弊端是不能直接實(shí)現(xiàn)多繼承
Js代碼??
function?Parent()??{????????this.sayAge=function()??????{??????????console.log(this.age);??????}??}??function?Child(firstname)??{??????this.fname=firstname;??????this.age=40;??????this.saySomeThing=function()??????{??????????console.log(this.fname);??????????this.sayAge();??????}??}????Child.prototype=new??Parent();??var?child=new?Child("張");??child.saySomeThing();?? ?
5.采用混合模式實(shí)現(xiàn)繼承
Js代碼??
function?Parent()??{????????this.sayAge=function()??????{??????????console.log(this.age);??????}??}????Parent.prototype.sayParent=function()??{?????alert("this?is?parentmethod!!!");??}????function?Child(firstname)??{??????Parent.call(this);??????this.fname=firstname;??????this.age=40;??????this.saySomeThing=function()??????{??????????console.log(this.fname);??????????this.sayAge();??????}??}????Child.prototype=new??Parent();??var?child=new?Child("張");??child.saySomeThing();??child.sayParent(); ?
轉(zhuǎn)載于:https://www.cnblogs.com/christal-11/p/5872589.html
總結(jié)
以上是生活随笔為你收集整理的(转)js实现继承的5种方式的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。
