1.new是什么?
在 JavaScript 中,new 关键字用于创建自定义对象类型的实例或内置对象的实例。通过 new 关键字,可以轻松地实例化对象并初始化它们的属性和方法。
2.new 的工作原理
当我们使用 new 关键字调用一个函数时,这个函数被称为构造函数。new 关键字执行以下步骤:
创建一个空对象:首先new会创建了一个空对象,作为返回的对象实例设置原型:将生成的空对象的原型对象指向构造函数的 prototype 属性,从而设置原型链。- 绑定
this: 将当前实例对象赋值给构造函数内部的 this,使得构造函数中的任何对 this 的操作都会影响新对象。 执行构造函数:执行构造函数的初始代码。如果构造函数没有显式返回一个对象,那么new表达式会默认返回新创建的对象。返回新对象:如果构造函数没显式返回一个对象,new表达式会默认返回新创建的对象
3.代码示例
//定义构造函数
function Study(title){
//设置属性
this.title = title;
//添加方法
this.exportInfo = function(arg){
console.log(`${title}:${arg}`)
}
// 如果这里返回一个引用类型的数据,那么 new 会返回这个引用类型的数据
// return {}; // 这里注释掉,让 new 默认返回新创建的对象
};
//使用 new 关键字创建实例
const Study1 = new Study("web");
// 调用实例方法
Study1.exportInfo("hello");// 输出:web:hello
//检查原型链
console.log(Study.prototype == new Study().__proto__) // true
模拟 new 的过程和行为
function createStudy(color) {
// 创建一个新对象
const obj = {};
// 设置原型
obj.__proto__ = Study.prototype;
// 绑定 this 并执行构造函数
Study.call(obj, color);
// 返回新对象
return obj;
}
// 使用手动实现的 createStudy 函数创建 Study 实例
const study2 = createStudy('js');
// 调用实例的方法
study2.exportInfo('中的prototype和this'); //输出:js:中的prototype和this
在这个手动实现的 createStudy 函数中,我们模拟了 new 关键字的四个主要步骤:创建新对象、设置原型、绑定 this 并执行构造函数、返回新对象。
4.总结
- 创建对象实例:new 关键字用于创建自定义对象类型的实例。
- 初始化对象:通过构造函数初始化新对象的属性和方法。
- 设置原型:新对象的原型对象指向构造函数的 prototype 属性。
- 绑定 this:构造函数内部的 this 被指派给新创建的对象。
- 返回新对象:如果构造函数没有显式返回一个对象,new 表达式会默认返回新创建的对象。