通过构造函数中设置
this.name = ‘jszhang’;let Foo = function() { this.name = ‘zhazhazhang’;}let foo = new Foo();console.log(foo.name); // 输出啥？console.log(window.name); // 输出啥？
答案是：
- zhazhazhang
- jszhang
在将这个答案的缘故之前，我们看下 new Foo() 中，JavaScript 引擎做了什么事：
- 首先创建一个空对象 tempObj = {}。
- 接着调用 Foo.apply 方法，将 tempObj 作为 apply 方法的参数，这样当 Foo 的执行上下文创建时，它的 this 就指向 tempObj 对象。
- 然后执行 Foo 函数，此时的 Foo 函数执行上下文中的 this 指向了 tempObj 对象。
- 最后返回 tempObj 对象。
如上，我们可以看到此时 this 是属于 tempObj 的，绑定到 foo 上去了，从而获取到：
- zhazhazhang
- 25
- jszhang
当然，了解到这里，我们还是完善下 new 这个手写方法，免得误导小伙伴们觉得 new 就做了那么点事：
function myNew(func, …args) { // 1. 判断方法体 if (typeof func !== ‘function’) { throw ‘第一个参数必须是方法体’; } // 2. 创建新对象 const obj = {}; // 3. 这个对象的 __proto__ 指向 func 这个类的原型对象 // 即实例可以访问构造函数原型（constructor.prototype）所在原型链上的属性 obj.__proto__ = Object.create(func.prototype); // 为了兼容 IE 可以让步骤 2 和 步骤 3 合并 // const obj = Object.create(func.prototype); // 4. 通过 apply 绑定 this 执行并且获取运行后的结果 let result = func.apply(obj, args); // 5. 如果构造函数返回的结果是引用数据类型，则返回运行后的结果 // 否则返回新创建的 obj const isObject = typeof result === ‘object’ && result !== null; const isFunction = typeof result === ‘function’; return isObject || isFunction ? result : obj;}// 测试function Person(name) { this.name = name; return function() { // 用来测试第 5 点 console.log(‘返回引用数据类型’); };}// 用来测试第 2 点和第 3 点Person.prototype.sayName = function() { console.log(`My name is ${this.name}`);}const me = myNew(Person, ‘jszhang’); // 用来测试第 4 点me.sayName(); // My name is jszhangconsole.log(me); // Person {name: ‘jszhang’}// 用来测试第 1 点// const you = myNew({ name: ‘jszhang’ }, ‘jszhang’); // 报错：第一个参数必须是方法体
这样，我们就知道构造函数中的 new 是怎么一回事了。