Stories

Detail Return Return

New 操作符的原理 - Stories Detail

完整高頻題庫倉庫地址:https://github.com/hzfe/awesome-interview

完整高頻題庫閲讀地址:https://febook.hzfe.org/

相關問題

  • new 操作符做了什麼
  • new 操作符的模擬實現

回答關鍵點

構造函數 對象實例

new 操作符通過執行自定義構造函數或內置對象構造函數,生成對應的對象實例。

知識點深入

1. new 操作符做了什麼

  1. 在內存中創建一個新對象。
  2. 將新對象內部的 \_\_proto\_\_ 賦值為構造函數的 prototype 屬性。
  3. 將構造函數內部的 this 被賦值為新對象(即 this 指向新對象)。
  4. 執行構造函數內部的代碼(給新對象添加屬性)。
  5. 如果構造函數返回非空對象,則返回該對象。否則返回 this。

2. new 操作符的模擬實現

function fakeNew() {
  // 創建新對象
  var obj = Object.create(null);
  var Constructor = [].shift.call(arguments);
  // 將對象的 __proto__ 賦值為構造函數的 prototype 屬性
  obj.__proto__ = Constructor.prototype;
  // 將構造函數內部的 this 賦值為新對象
  var ret = Constructor.apply(obj, arguments);
  // 返回新對象
  return typeof ret === "object" && ret !== null ? ret : obj;
}

function Group(name, member) {
  this.name = name;
  this.member = member;
}

var group = fakeNew(Group, "hzfe", 17);

參考資料

  1. new 操作符 - MDN
  2. The new Operator
user avatar tianmiaogongzuoshi_5ca47d59bef41 Avatar dingtongya Avatar alibabawenyujishu Avatar haoqidewukong Avatar linlinma Avatar yinzhixiaxue Avatar qingzhan Avatar kobe_fans_zxc Avatar aqiongbei Avatar zourongle Avatar razyliang Avatar leexiaohui1997 Avatar
Favorites 144 users favorite the story!
Favorites

Add a new Comments

Some HTML is okay.