JavaScript 複習之例項物件與 new 命令

DreamTruth發表於2019-02-27

建構函式有自己的特徵和用法:

  • 函式體內部使用this關鍵字,代表了索要生成的物件例項
  • 生成物件的時候,必須使用 new 命令

new 命令的作用,就是執行建構函式,返回一個例項物件。其原理是:

  1. 建立一個空物件,作為將要返回的物件例項
  2. 將這個空物件的原型,指向建構函式的prototype屬性
  3. 將這個空物件賦值給函式內部的this
  4. 開始執行建構函式內部程式碼

注意:如果建構函式內部有return語句,而且return後面跟著一個物件,new命令會返回return語句指定的物件,否則,就會不管return語句,返回this物件。

var Vehicle = function(){
    this.price = 1000;
    return 1000;
}
(new Vehicle()) === 1000 //false

var Bsterm = function (){
  this.price = 1000;
  return { price: 2000 };
};

(new Bsterm()).price // 2000
複製程式碼

上面程式碼中,建構函式Vehiclereturn語句,返回的是一個數值。new命令就會忽略這個return語句,返回“構造”後的this物件。 建構函式Bstermreturn語句,返回的是一個新物件。new命令會返回這個物件,而不是this物件。

如果是普通函式(內部沒有this關鍵字的函式)使用new命令,則會返回一個空物件。

new.target : 函式內部可以使用new.target屬性。如果當前函式是new命令呼叫,new.target指向當前函式,否則為undefined

function f() {
  console.log(new.target === f);
}

f() // false
new f() // true
複製程式碼

Object.create() 建立例項物件

建構函式作為模板,可以生成例項物件。但是有時候拿不到建構函式,只能拿到一個現有物件。我們希望把這個物件作為模板,生成新的例項物件,這時候就可以用Object.create()方法。

var person1 = {
  name: '張三',
  age: 38,
  greeting: function() {
    console.log('Hi! I\'m ' + this.name + '.');
  }
};

var person2 = Object.create(person1);

person2.name // 張三
person2.greeting() // Hi! I'm 張三.
複製程式碼

相關文章