乐趣区

关于javascript:JS的new操作符

一、new 的应用

当咱们定义一个构造函数,用 new 创建对象时

function Person(){}

var person = new Person();

console.log(person); // Person{}

会返回一个指向该构造函数原型的对象。

二、new 创建对象的过程

依据红宝书的形容分为以下 4 个步骤:

  1. 创立一个新的对象;
  2. 将构造函数的函数作用域赋给新对象(因而 this 就指向了这个新对象);
  3. 执行构造函数中的代码(为这个新对象增加属性);
  4. 返回新对象。

三、模仿实现 new 操作

// newObj 承受不定量的参数,第一个参数是一个构造函数
function newObj(fn, ...arg) {
    // 1. 新建一个空对象
    var obj = {};
    // 2. 将新对象的原型指向构造函数的原型
    obj.__proto__ = fn.prototype;
    // 3. 将 fn 的 this 指向 obj
    fn.apply(obj, arg);
    // 4. 返回新对象
    return obj;
}

或
function newObj(fn, ...arg) {let obj = Object.create(fn.prototype);
    fn.apply(obj, arg);
    return obj;
}

接下来对 newObj 函数进行测试

function Person(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
}

// 在 Person 的原型上增加 sayName() 办法
Person.prototype.sayName = function() {alert(this.firstName + " " + this.lastName);
}

// 应用自定义的 newObj 创立 Person 的对象实例
var pitt = newObj(Person, "Bob", "Pitt");
// 调用 sayName()
pitt.sayName(); // "Bob Pitt"

// 应用 new 操作符创立实例对象
var sunny = new Person("Bob", "Sunny");
sunny.sayName(); // "Bob Sunny"
退出移动版