new 操作符

1. new 操作符干了什么？

new 用于创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。

如果构造函数返回对象，则 new 操作会将实例绑定到返回的对象上；如果构造函数没有显式返回一个对象，则返回新创建的对象。

2. new 操作符的流程

  1. 创建一个全新的空对象。
  2. 这个新对象的原型（__proto__）指向构造函数的 prototype。
  3. 将构造函数的 this 指向这个新对象，执行构造函数中的代码（为新对象添加属性）。
  4. 若构造函数显式返回一个对象，则返回该对象；否则返回新创建的对象。

3. 手写 new

function mynew(Func, ...args) {
  // 1. 创建新对象
  const obj = {};
  // 2. 新对象原型指向构造函数原型
  obj.__proto__ = Func.prototype;
  // 3. 将构造函数的 this 指向新对象并执行
  const result = Func.apply(obj, args);
  // 4. 若构造函数显式返回对象则使用它，否则返回新对象
  return result instanceof Object ? result : obj;
}

// 测试
function Person(name) { this.name = name; }
Person.prototype.sayHi = function () { console.log('hi, ' + this.name); };

const p = mynew(Person, 'Tom');
p.sayHi();           // hi, Tom
p instanceof Person; // true

来源整理自：vue3js.cn 面试官系列