new操作符具体做了哪些工作

发布于:2024-05-04 ⋅ 阅读:(35) ⋅ 点赞:(0)

new 操作符在JavaScript中用于创建一个用户自定义的对象类型的实例或具有构造函数的内建对象的实例。当使用 new 操作符调用一个函数时,该函数被称为构造函数。以下是 new 操作符具体做的事情:

  1. 创建一个空对象:首先,new 操作符会创建一个新的空对象 {}。
  2. 设置原型链:新创建的对象的 [[Prototype]](内部属性,通常通过 proto 访问,但这不是标准属性)链接到构造函数的 prototype 对象。这允许新创建的对象访问构造函数的 prototype 对象上的属性和方法。
  3. 执行构造函数:构造函数以新创建的对象为上下文(this 指向新创建的对象)执行。这意味着在构造函数内部,你可以使用 this 关键字来添加属性和方法到新创建的对象上。
  4. 返回新对象:如果构造函数没有显式地返回一个对象,那么 new 操作符将返回新创建的对象。如果构造函数返回了一个非原始值(即对象或函数),那么这个非原始值将被作为 new 表达式的结果返回。如果构造函数返回了一个原始值(如 undefined、null、数字、字符串或布尔值),则忽略这个返回值,并返回新创建的对象。

下面是一个简单的例子,展示了 new 操作符的工作方式:

function Car(make, model, year) {
  this.make = make;
  this.model = model;
  this.year = year;
}

// 使用 new 操作符创建 Car 的实例
const myCar = new Car('Toyota', 'Camry', 2020);

console.log(myCar.make); // 输出 "Toyota"
console.log(myCar.model); // 输出 "Camry"
console.log(myCar.year); // 输出 2020

// 检查原型链
console.log(myCar.__proto__ === Car.prototype); // 输出 true

在这个例子中,new Car()的时候创建了一个新的对象,并且这个对象的make、model和year属性被设置为传入的参数值。

新建的对象myCar的原型链接到Car.prototype,允许它访问Car构造函数原型上的任何属性和方法。

搞清楚new操作符具体做些什么以后,我们自定义new操作符的功能,这样更容易理解new的执行过程,自定义的代码如下:

function newtest(Func, ...agrs) {
    // 创建一个新的对象
    const obj = {};
    // 新对象原型指向构造函数原型对象
    obj.__proto__ = Func.prototype;
    // 把构建函数的this指向新的对象
    let result = Func.apply(obj, agrs);
    // 根据返回值判断
    return result instanceof Object ? result : obj
}

function Person(name,number){
    this.name = name;
    this.number = number;
}

Person.prototype.ask = function(){
    console.log(this.name)
}

let io = newtest(Person,'测试',90000);

console.log(io); // Person { name: '测试', number: 90000 }

io.ask(); // 测试

这就是我对new操作符的理解,希望对你有所帮助!


网站公告

今日签到

点亮在社区的每一天
去签到