美文网首页
关于new操作符

关于new操作符

作者: _咻咻咻咻咻 | 来源:发表于2021-01-24 13:24 被阅读0次

    一 通过构造函数与class类实现一个简单的创建实例的过程

    // ES5构造函数
    let Parent = function (name, age) {
      this.name = name;
      this.age = age;
    }
    Parent.prototype.sayName = function () {
      console.log(this.name)
    }
    const child = new Parent('lining', 25);
    child.sayName(); //'lining
    
    // ES6 class类
    class Parent {
      constructor(name, age) {
        this.name = name;
        this.age = age;
      }
      sayName(){
        console.log(this.name)
      }
    }
    const child = new Parent('echo', 25);
    child.sayName(); //'echo
    

    二 new一个对象时发生了什么

    1. 创建一个空对象,将空对象的proto指向构造函数的prototype
    2. 将this指向改为空对象,然后执行构造函数,将属性和方法挂载在空对象上
    3. 返回this指向的空对象,也就是实例
    // ES5构造函数
    let Parent = function (name, age) {
        //1.创建一个新对象,赋予this,这一步是隐性的,
        // let this = {};
        //2.给this指向的对象赋予构造属性
        this.name = name;
        this.age = age;
        //3.如果没有手动返回对象,则默认返回this指向的这个对象,也是隐性的
        // return this;
    };
    const child = new Parent();
    

    三 实现一个new方法

    let newMethod = function(Parent, ...arg){
      // 1. 以构造函数的prototype属性为原型,创建新对象
      // let child = {}; child.__proto__ = Parent.prototype;
      let child = Object.create(Parent.prototype);
      // 2. 将this指向新对象,并执行
      // Parent.call(child, ...arg)
      Parent.apply(child, arg);
      // 返回新对象
      return child;
    }
    const child = newMethod(Parent, 'zhangsan',19);
    child.sayName() // 'zhangsan'
    

    相关文章

      网友评论

          本文标题:关于new操作符

          本文链接:https://www.haomeiwen.com/subject/ovubzktx.html