一. 原型鏈繼承
function Person() { //被繼承的函數叫做超類型(父類,基類) this.name='mumu'; this.age='18'; } Person.prototype.name='susu';//當屬性名相同時需就近原則,先在實例里面查找,沒找到再到原型里找 function Worker(){ //繼承的函數叫做子類型(子類,派生類) this.job='student'; } Worker.prototype=new Person();//通過原型鏈繼承,超類型實例化后的對象實例,賦值給子類的原型屬性 var p2=new Worker(); console.log(p2.name); console.log(p2 instanceof Object);//ture 所有的構造函數都繼承自Object
以上實現繼承關鍵在于:Worker.prototype=new Person(); 將Worker的原型成為Person的一個實例,通過原型鏈繼承。
注意:在使用原型鏈實現繼承時,不能使用對象字面量創建原型方法,因為這樣會中斷關系而重寫原型鏈。
原型鏈繼承問題:
1.出現引用共享問題,他們還是共用一個空間,子類會影響父類
2.在創建子類型的實例時,不能像超類型的構造函數中傳遞參數。
那么如何解決原型鏈的兩個問題呢?那就繼續看下面的繼承方式吧~
二. 借用構造函數繼承(也叫對象冒充,偽造對象或經典繼承)
簡單分析下以上使用借用構造函數的原理:Person.call(this,name,age);這句代碼調用父級構造函數,繼承父級屬性,使用call方法調用Person構造函數改變函數執行時候的this, 這里的this-> new出來的一個Worker對象 構造函數偽裝方法:把Worker傳給上面的Person。
當引用類型放在構造函數里面的時候就不會被共享,所以p2不受影響。
這里借用構造函數繼承方式就解決了原型鏈不能傳遞參數以及引用類型共享的問題。
小知識:call()和apply()方法可以改變函數執行的作用域, 簡言之就是改變函數中this指向的內容。
call()和apply()都接受兩個參數:第一個是在其中運行函數的作用域,另一個是傳遞的參數。
call和apply的區別就是參數的不同.
call中的參數必須是一個個枚舉出來的.
apply中的參數必須是數組或者是arguments對象
那么問題來了:為什么p1.showName()結果是錯誤的呢?----因為借用構造函數繼承方式只能繼承構造函數里的屬性和方法。這里也就發現了借用構造函數的一個問題。
注意:由于把方法都放在構造函數里,每次我們實例化就會分配內存空間給它造成資源的浪費,所以一般我們都是把方法放在原型里,屬性放在構造函數里。
借用構造函數繼承問題:
因為借用構造函數只能繼承構造函數里的屬性和方法,在超類型的原型中定義的方法對子類而言是不可見的,所以就相當于沒有了原型。結果所有的方法都只能在構造函數里定義,因此就沒有函數復用了。
那么如何解決借用構造函數所產生的問題呢?那就要看下面這種繼承方式了
三. 組合繼承(偽經典繼承)
組合繼承:將原型鏈與借用構造函數結合。
思路:通過使用原型鏈實現原型上的屬性和方法繼承,借用構造函數實現實例屬性的繼承
以上的例子Person.call(this,name,age);借用構造函數繼承了屬性
Worker.prototype=new Person();原型鏈繼承了方法 , 避免了兩者的缺點,融合了它們的優點,成為最常用的繼承模式。
組合繼承的問題:
調用兩次超類型構造函數,一次是在創建子類型原型時,另一次是在子類型的構造函數內部。
要解決這個問題就要用到寄生組合式繼承方式了。
四. 原型式繼承
簡單分析下:function object(proto)是一個臨時中轉函數,里面的參數proto表示將要傳遞進入的一個對象,F()構造函數是臨時新建的對象,用來存儲傳遞過來的對象,F.prototype = proto;將對象實例賦值給F構造函數的原型對象,最后返回傳遞過來的對象的對象實例。原型式繼承還是會共享引用類型的屬性。
五. 寄生式繼承
六. 寄生組合式繼承
這種方法也是現在實現繼承方法中最完美的,也是最理想的。
以上這篇JavaScript繼承學習筆記【新手必看】就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com