学习笔记——new关键字在底层究竟做了什么

new关键字在JavaScript中用于实例化对象,它执行了包括创建新对象、设置原型链、绑定this及执行构造函数等步骤。在调用上下文中,new会创建一个新对象并初始化,this指向这个新对象。构造函数不返回值时,默认返回新创建的对象。同时,文章提到了栈内存和堆内存的区别,以及函数的prototype属性与constructor关系。
摘要由CSDN通过智能技术生成

new关键字(操作符)在底层究竟做了什么?

一、概念理解 

函数调用之前带有关键字new,它就构成了构造函数调用。

与普通函数调用在实参处理、调用上下文、返回值方面不同。

 一)实参处理

相同点:如果有实参,先计算这些实参表达式,然后传入函数内部。

不同点:如果没有实参,构造函数允许形参,构造函数在调用时,允许省略实参列表和圆括号。

例如:下列两段代码是等价的。

let obj = new Object()

let obj = new Object

二)调用上下文

构造函数创建一个新的对象,并初始化它,并将这个对象作为调用上下文。即this指针指向这个对象

普通函数的this指针则在调用函数时确定,谁调用该函数,this就指向谁。

三)返回值

造函数通常不使用return关键字。它们初始化新对象,并在函数执行完后显式返回。判断构造函数的返回值类型,如果是值类型,返回创建的对象。如果是引用类型,就返回这个引用类型的对象

普通函数如果有return关键字,则返回return关键字后的数据,否则返回undefined。

在js中,数据存储在内存中。而内存分为栈内存和堆内存。

栈内存中包含着Number、String等基本数据类型的数据以及定义变量 。

堆内存中包含着Object等引用数据类型的数据。

每个函数在创建后都自动拥有一个prototype属性,这个属性是一个对象,这个对象中包含唯一一个不可枚举的属性constructor。其值是一个函数对象。

 

二、new的执行过程

  1. 首先创建了一个新对象。
  2. 将空对象的原型 _proto_ 指向构造函数的 prototype 属性。
  3. 让构造函数的this指向这个对象,执行构造函数的代码(为这个新对象添加属性)。
  4. 判断函数的返回值类型,如果是值类型,返回创建的对象。如果是引用类型,就返回这个引用类型的对象。

三、手写new

function newFunc(Func,...args) {
    // 1.创建一个新对象
    let newObj = {}
    // 2.将新对象和构造函数通过原型链连接
    newObj.__proto__ = Func.prototype
    // 3.将构造函数的this绑定到新对象上
    const result = Func.apply(newObj,args)
    // 4.根据返回值类型判断,如果是值类型返回newObj,如果是引用类型返回正常引用类型
    return result instanceof Object ? result : newObj   
}

 

四、视频讲解

视频讲解icon-default.png?t=N3I4https://www.bilibili.com/video/BV1Da4y1G7iJ/?vd_source=be4efb0f2cfe5e83a1774731474196fd 

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

一一GG

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值