JS手写代码篇---手写 new 操作符

3、手写 new 操作符

new就是新建一个对象,new的过程主要有四个

  1. 创建一个新对象 :这个新对象的原型被设置为构造函数的 prototype 属性。

    复制代码
    Object.create()
  2. 将新对象的 this 上下文绑定到构造函数 :这样构造函数内部的 this 就指向了这个新对象。

    复制代码
    apply()
  3. 执行构造函数:构造函数内部的代码被执行,通常会对新对象进行一些初始化操作。

  4. 返回新对象:如果构造函数没有返回一个对象或函数,则默认返回新创建的对象;如果构造函数返回了一个对象或函数,则返回该对象或函数。

我们只要按照着四步来,就可以实现手写new

复制代码
function myNew(constructor , ...args){
    //1、创建一个新对象:这个新对象的原型被设置为构造函数的 prototype 属性
    const obj = Object.create(constructor.prototype);
    //2、将新对象的 this 上下文绑定到构造函数
    //apply返回的是一个对象或者函数,如果构造函数没有返回一个对象或函数,则默认返回新创建的对象;如果构造函数返回了一个对象或函数,则返回该对象或函数。
    const res = constructor.apply(constructor , args);
    if(res && typeof res === 'object' || typeof res === 'function'){
        return res;
    }else {
        return obj;
    }
}
  1. apply 方法 :apply 是 JavaScript 中 Function 对象的一个方法,它允许你在一个指定的 this 值上调用函数,并传入一个数组作为参数

    复制代码
    function.apply(function , args) //改变function当中的this指向

​ 返回的是构造函数 function 的执行结果。具体来说,它返回的是构造函数内部通过 return 语句返回的值。如果构造函数内部没有显式返回一个对象或函数,那么 function.apply(obj, args) 将返回 undefined。

结果:

复制代码
function Person(name , age){
  this.name = name;
  this.age = age;
}
console.log(new Person('lily' , 19))
console.log(myNew(Person , 'lily' , 19))
console.log(myNew(Array , 1,2,3))

Person('lily' , 19))

console.log(myNew(Person , 'lily' , 19))

console.log(myNew(Array , 1,2,3))

复制代码
[外链图片转存中...(img-kW8TgG9q-1747474809858)]

**总结**:new的手写主要通过它实现的四个步骤进行一一实现,创建一个原型被设置为构造函数的 `prototype` 属性的对象,改变this的指向,判断新对象的类型最后进行对应的处理。
相关推荐
GIS数据转换器1 小时前
地下空间综合管廊运营管理平台
大数据·开发语言·人工智能·经验分享·perl
Wang's Blog6 小时前
Java 项目实战: 交友项目:登录链路回顾与今日任务地图
java·开发语言·状态模式·交友
砚底藏山河7 小时前
python量化:行情数据回溯
java·开发语言·python·金融·maven
今年下半年7 小时前
AI智能体项目实战记录(02):初始化 Python 项目
开发语言·人工智能·python·fastapi
Williamtym7 小时前
PickGo Lab实践:用浏览器、Python和MCP串起机器人搬运仿真
开发语言·python·机器人
DongQiShanRen7 小时前
六根硬件映射(四):归属澄清、两处不一致与卷十一总表
开发语言·人工智能·算法·rust·哈希算法·集成学习
CS创新实验室7 小时前
Python 对象“死“了之后去了哪?——引用计数与分代垃圾回收
开发语言·jvm·python
持敬chijing8 小时前
白盒测试与代码审计-js登录逆向实战
javascript·网络·安全·web安全·网络安全·网络攻击模型
quantdash_cc8 小时前
Pandas 处理分钟级股票行情:从原始数据清洗到 K 线聚合
开发语言·python·数据分析·pandas·量化交易·股票数据·quantdash
yu_zhidun8 小时前
企业电脑监控软件怎么选:别只看功能清单,先看这 6 个底层能力
开发语言·电脑·php·域智盾系统