动态

详情 返回 返回

New 操作符的原理 - 动态 详情

完整高頻題庫倉庫地址: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 头像 dingtongya 头像 alibabawenyujishu 头像 haoqidewukong 头像 linlinma 头像 yinzhixiaxue 头像 qingzhan 头像 kobe_fans_zxc 头像 aqiongbei 头像 zourongle 头像 razyliang 头像 leexiaohui1997 头像
点赞 144 用户, 点赞了这篇动态!
点赞

Add a new 评论

Some HTML is okay.