1.原型鏈繼承:可以繼承屬性和方法,但是會對原型上的方法誤修改:
例如:繼承屬性
//父類
function
person
() //子類
function
student
(s) student.prototype = new person();
var stu1 = new student(1);
console.log(stu1.head) //aaa
stu1.head = 'bbb';
console.log(stu1.head)//bbb
var stu2 = new student(1);
console.log(stu2.head)//aaa
列印出bbb的地方,是因為stu1.head自己新增了乙個本地屬性,而並不會影響原型上的屬性
例如:原型鏈繼承方法:
//父類
function
person
()//子類
function
student
(s)student.protype = new person();
var stu1 = new student(1);
console.log(stu1.love);//我愛你
stu1.love.push('呀');
console.log(stu1.love);//我愛你呀
var stu2 = new student(1);
console.log(stu2.love);//我愛你呀(這邊並沒有在本地修改,但是卻對person裡面的方法進行了修改)
例如:
function person()
function student(s)
var stu1 = new student(1);
console.log(stu1.fn);//
'a','b','c'
stu1.fn.push('eeeeee');
console.log(stu1.fn);//
'a','b','c','eeeeeee'
var stu2 = new student(1);
console.log(stu2.fn); //
'a','b','c','d'
person.call(this),代表了把person建構函式借用給student函式,那麼誰呼叫student,this就指向誰,因為建立了乙個student例項,所以相當於person.call(stu1),所以再修改就只是修改stu1這個例項物件,而不會影響其他
//缺點:這種形式的繼承,每個子類例項都會拷貝乙份父類建構函式的方法,作為例項自己的方法,占用
很多記憶體,而且當需求改變時,無法達到快速更新例項中的屬性及方法
3.結合使用兩種繼承模式:
例如:
function
person()}
person.prototype.eat = function
()person.prototype.sleep = function
()function
student
(id)
student.prototype = new person();
student.prototype.constructor = student;
var stu1 = new student(1);
console.log(stu1.a);//a,b,c
stu1.a.push('d');
console.log(stu1.a)//a,b,c,d
var stu2 = new student(1);
console.log(stu2.a);//a,b,c
stu1.eat();//aaa
stu2.sleep();//bbb
console.log(stu1.constructor); //student
其實還有乙個拷貝的方法,也可以模擬繼承:
總結一下:
原型鏈繼承:是通過子類的原型等於父類的例項物件,從而繼承父類原型中的方法及屬性.
缺點是:如果修改子類的例項物件中的方法,父類中原型的方法以及屬性(引用型別)也會隨著修改
組合繼承:採用了原型鏈繼承+借用繼承,保證了子類例項可以繼承父類原型中的屬性和方法,然後根據本地修改,而不需要每一次都繼承父類,然後又用了借用,這樣修改例項就不會影響父類的原型了
js繼承的幾種方式及優缺點
前言 js作為物件導向的弱型別語言,繼承也是其非常強大的特性之一。那麼如何在js中實現繼承呢?讓我們拭目以待。既然要實現繼承,那麼首先我們得有乙個父類,如下 定義乙個動物類 function animal name 原型方法 animal.prototype.eat function food 核心...
JS中幾種繼承的方式及缺點
原型鏈繼承 每個建構函式都有乙個原型物件 通過prototype屬性 原型物件都包含乙個指向建構函式的指標 通過constructor屬性 例項都包含乙個指向原型物件的內部指標 通過隱式proto屬性 那麼,若原型物件等於另乙個原型的例項,則此時原型物件將包含乙個指向另乙個原型物件的指標。相應的另乙...
js繼承的原理 方式以及優缺點
之前看js繼承問題,自己查閱資料,看到有一篇文章整理還可以,便在文章的基礎上又細化了一些。js作為物件導向的弱型別語言,繼承也是其非常強大的特性之一。那麼如何在js中實現繼承呢?讓我們拭目以待。js繼承的實現方法 原型鏈繼承 構造繼承 例項繼承 拷貝繼承 組合繼承 寄生組合繼承。既然要實現繼承,那麼...