js中的繼承總結全 含new 原理過程

2022-09-04 11:18:10 字數 831 閱讀 9808

1. 借用 new 建構函式繼承

mdn對new的描述:new運算子建立乙個使用者自定義的物件型別的例項或具有建構函式的內建物件的例項

new的原理過程:  var  fn = new foo()

1.1 建立空函式 fn(){} , 此時: fn.__proto__ === funciton.prototype  ,, fn.construtor === function

1.2 設定新函式的constructor屬 性為建構函式的名稱,設定新物件的proto屬性指向建構函式的prototype物件;

fn.__proto__ = foo.prototype;

擴充套件了新物件的原型鏈

1.3 使用新物件呼叫函式,函式中的this被指向新例項物件:

classa.call(obj);  //{}.建構函式();

1.4.返回this指標。當存在顯示的返回時,返回return後面的內容。新建的空物件作廢。

function test()

test.prototype = ,

b:{}

}var c = new test();

缺點: 不能繼承建構函式prototype原型上的方法,  只能部分繼承

2. 借用原型鏈__proto__找建構函式prototype原型繼承

原理: 利用物件的__proto__向上, 找到建構函式的prototype原型

缺點:3. 組合繼承( 結合構造和原型 )

3.1 

3.23.3  最完美繼承

缺點:4. es6的class實現的繼承

優點:

js中new的原理與實現

這裡使用es6的結構來獲取建構函式所需的引數 也可以使用arguments來獲取,不過es6中不這麼建議了,要用的話進行arguments 0 的提取與裁剪就可以了 function new fn,args 構造空物件 fn.obj,args 建構函式賦值與this指向的修改 obj.proto f...

JS中new的實現原理及重寫

提到new,肯定會和類和例項聯絡起來,如 function func let f new func 上面的 我們首先建立了乙個函式,如果是用物件導向的說法就是建立了乙個function類的例項,如果直接執行這個函式,那它就是乙個普通的函式,如果用new執行,則這個函式被稱為乙個自定義的類。如果是乙個...

js中的new操作符原理

舉乙個很常見的例子 function person name person.prototype.say function let p new person 花花 p.say 花花 為什麼會列印出 花花 為什麼建構函式中的 this 就指向了 物件?這就是 new 的原理起的作用 1 建立乙個類的例項...