JS原型鏈-創建對象

1.直接聲明

var o1 ={name:'o1'};
var o11 = new Object({name:'o11'})

2.顯示構造函數創建對象

var M = function(){this.name = 'o2'};
var o2 = new M();

3.

var p = {name:'o3'};
var o3 = Object.create(P)

Object.create的實現方式

Object.create =  function (o) {
    var F = function () {};
    F.prototype = o;
    return new F();
};

Object.create是內部定義一個對象,並且讓F.prototype對象 賦值爲引進的對象/函數 o,並return出一個新的對象。

再看看var o1 = new Base()的時候new做了什麼。

JavaScript 實際上執行的是:
var o1 = new Object();
o1.[[Prototype]] = Base.prototype;
Base.call(o1);

new做法是新建一個obj對象o1,並且讓o1的proto指向了Base.prototype對象。並且使用call 進行強轉作用環境。從而實現了實例的創建。

測試:

var Base = function () {
    this.a = 2
}
Base.prototype.a = 3;
var o1 = new Base();
var o2 = Object.create(Base);
console.log(o1.a);
console.log(o2.a);

輸出:

2
undefined

原因:
爲什麼通過Object.create構造的連Base原型上的屬性都訪問不到,因爲他壓根就沒有指向他的prototype。這也就說明了_proto_ 和 prototype 的區別。所以上面在prototype定義的a,只是Base的prototype對象上的一個屬性。

再來看看就是:

new關鍵字必須是以function定義的。
Object.create 則 function和object都可以進行構建。

發佈了39 篇原創文章 · 獲贊 6 · 訪問量 3萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章