js是門靈活的語言,實現一種功能每每有多種作法,ECMAScript沒有明確的繼承機制,而是經過模仿實現的,根據js語言的自己的特性,js實現繼承有如下通用的幾種方式
1.使用對象冒充實現繼承(該種實現方式能夠實現多繼承)
實現原理:讓父類的構造函數成爲子類的方法,而後調用該子類的方法,經過this關鍵字給全部的屬性和方法賦值app
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方法改變函數上下文實現繼承(該種方式不能繼承原型鏈,若想繼承原型鏈,則採用5混合模式)
實現原理:改變函數內部的函數上下文this,使它指向傳入函數的具體對象函數
3.採用Apply方法改變函數上下文實現繼承(該種方式不能繼承原型鏈,若想繼承原型鏈,則採用5混合模式)
實現原理:改變函數內部的函數上下文this,使它指向傳入函數的具體對象this
2: 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: 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.採用原型鏈的方式實現繼承
實現原理:使子類原型對象指向父類的實例以實現繼承,即重寫類的原型,弊端是不能直接實現多繼承prototype
5.採用混合模式實現繼承code
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(); ----------------------------------------------------------------- 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();