0
点赞
收藏
分享

微信扫一扫

实例化一个对象(new)到底做了什么+ 手写实现new

Gaaidou 2021-09-30 阅读 62
JavaScript
文字总结一下:

创建了1个空对象
将空对象的constructor的prototype就等于Based的原型
将当前对象的this在Base中执行一边 于是空对象就有了Base的this上的所有值

function Base() {
    this.a = function () {
        console.log('我是Base中的a')
    }
}

Base.prototype.b = function () {
    console.log('我是Base prototype上的b')
}

var obj = new Base();
// 实际上做了以下几件事
// var obj = {};
// obj.__proto__ = Base.prototype;
// Base.call(obj);
// 第一行,我们创建了一个空对象obj
// 第二行,我们将这个空对象的__proto__成员指向了Base函数对象prototype成员对象
// 第三行,我们将Base函数中this上的成员赋值给obj

引申:手写实现一个new

  • 首先创建一个空的对象,空对象的proto属性指向构造函数的原型对象
  • 把上面创建的空对象赋值构造函数内部的this,用构造函数内部的方法修改空对象
  • 如果构造函数返回一个非基本类型的值,则返回这个值,否则上面创建的对象
    写法1:
function _new(fn, ...arg) {
    var obj = Object.create(fn.prototype);
    const result = fn.apply(obj, ...arg);
    return Object.prototype.toString.call(result) == '[object Object]' ? result : obj;
}

写法2:

function myNew (fun, ...arg) {
    // 创建一个新对象且将其隐式原型指向构造函数原型
    let obj = {
        __proto__: fun.prototype 
    }
    // 执行构造函数
    fun.apply(obj, arg)
    
    // 返回该对象
    return obj
}

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

let _person = myNew(Person, 'huang', '21')
console.log(_person)
举报

相关推荐

0 条评论