重写内置NEW

本文深入探讨JavaScript中的new操作符的工作原理,包括创建实例对象、设置this上下文以及处理返回值。同时,通过代码示例展示了如何重写内置new,创建自己的实例化过程。此外,讨论了哪些函数类型可以使用new关键字进行实例化,强调必须是函数、具备prototype属性且非生成器函数。
摘要由CSDN通过智能技术生成


一、内置new的时候做了什么

首先会像正常函数一样,产生私有上下文

1、创建当前内的一个实例(空实例对象)

2、让函数中的THIS指向这个对象

3、看函数的返回值,如果返回的是对象,则以自己返回的为主,否则把创建的实例对象返回

二、重写内置new

代码如下(示例):

function Dog(name) {
    this.name = name;
}
Dog.prototype.bark = function () {
    console.log('wangwang');
}
Dog.prototype.sayName = function () {
    console.log('my name is ' + this.name);
}

/*
 入参介绍
 	Ctor:constructor缩写 想创在哪一个构造函数的实例
 	params:实参集合  未来传递给构造函数的实参
*/
const _new = function _new(Ctor, ...params) {
    // 对Ctor的格式做校验:必须是个函数 & 必须具备prototype属性 & 不能是生成器函数 & 排除Symbol/BigInt ...
    if (Ctor === Symbol || Ctor === BigInt || Object.prototype.toString.call(Ctor) !== "[object Function]" || !Ctor.prototype) throw new TypeError(`Ctor is not a constructor`);
    // 核心处理
    let obj,
        result;
     // @1 创造当前类的一个实例{空实例对象}
    //   实例对象.__proto__ 指向 构造函数.prototype
    obj = Object.create(Ctor.prototype);
    // @2 像普通函数执行一样把构造函数执行,让函数中的THIS指向创建的实例对象
    result = Ctor.call(obj, ...params);
     // @3 看函数的返回值,如果返回的是个对象,则以自己返回的为主,否则把创建的实例对象返回
    if (result !== null && /^(object|function)$/.test(typeof result)) return result;
    return obj;
};


======》》》》》》》》test

let sanmao = _new(Dog, '三毛');
sanmao.bark(); //=>"wangwang"
sanmao.sayName(); //=>"my name is 三毛"
console.log(sanmao instanceof Dog); //=>true



在这里插入图片描述

三、哪些可以new实例对象

1、必须是个函数

在这里插入图片描述

2、必须具备prototype属性

在这里插入图片描述

3、不能是生成器函数

在这里插入图片描述

4、排除Symbol/BigInt

在这里插入图片描述

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值