View:new关键词干了什么事,还有原型链是什么

View:new关键词干了什么事,还有原型链是什么

1.new关键词干了什么事:

这里来看一段代码

先创建一个函数,如下:

function myFunction(data) {}

我们现在来用new一个,如下:

const weakMap = new myFunction();

new完了,来打印看看都有什么:

console.log("1. 开始 new 操作");

const weakMap = new myFunction();

console.log("4.", weakMap, "返回this指向的实例");

function myFunction(data) {

console.log("2.",

this.proto === myFunction.prototype);

console.log("3.", this);

}

输出结果是:

那也就是说:

new 操作符做了什么事:

  1. 创建一个空对象

2.挂载连接双方原型,对象的原型是__proto__,构造函数的原型是prototype

3.执行构造函数,将this指向新创建的对象实例

4.如果构造函数返回的是一个对象,则返回这个对象,否则返回this指向的实例

第四点怎么理解呢?你看当上面的代码,我现在没有return,他就是myFunction,现在修改代码,修改为:

function myFunction(data) {

console.log("2.",this.proto === myFunction.prototype);

console.log("3.", this);

return {

age: 18,

}

}

添加了一个return,并且是个对象时,此时的打印结果:

变了,变成返回的对象了,那返回其他类型呢,例如返回一个字符串:

function myFunction(data) {

console.log("2.",this.proto === myFunction.prototype);

console.log("3.", this);

return '创建对象实例成功'

}

结果是返回的myFunction:

也就是对应上第四条:当构造函数有返回时,并且是个对象时,那返回的就是这个对象,否则就是这个this指向的实例。

2.原型链是什么?

我们知道对象上有个原型叫__proto__,函数上面有个原型叫prototype。根据上面我们知道了new操作符创建了一个空对象并且赋值给了weakMap,那也就是说weakMap.__proto__指向了myFunction.prototype。这个暂且参考上面的第二条。

补充:我们知道在 JavaScript 中,每个函数其实都是一个Function对象。函数默认返回undefined。函数的本质又是对象。

让我们来打印:

// 从weakMap开始分析

console.log(weakMap.proto === myFunction.prototype, "true");

console.log(typeof myFunction.prototype);

console.log(myFunction.prototype.proto === Object.prototype, "true");

console.log(typeof Object.prototype,);

console.log(Object.prototype.proto === null, "true");

console.log("===================================")

//从myFunction开始分析

console.log(myFunction.proto === Function.prototype, "true");

console.log(typeof Function.prototype);

console.log(Function.prototype.proto === Object.prototype, "true");

console.log(typeof Object.prototype);

console.log(Object.prototype.proto === null, "true");

结果是:

总结:

// 实例对象的原型链

weakMap(实例对象)

↓ proto

myFunction.prototype (构造函数的原型对象)

↓ proto

Object.prototype

↓ proto

null

// 构造函数本身的原型链

myFunction(构造函数)

↓ proto

Function.prototype

↓ proto

Object.prototype

↓ proto

null

这就是原型链。

补充:当构造函数返回的是一个对象时,他两的原型并不相等,因为此时weakMap 是函数返回的对象,并不是最初构造的函数。

相关推荐
卷无止境19 分钟前
便宜模型和贵模型到底差在哪儿?一份关于Claude与GPT分级体系的深度梳理
后端·python
阿狗童鞋1 小时前
SpringBoot微服务实战指南
spring boot·后端·微服务
FfHUCisI1 小时前
sync.Once 与 sync.Cond 源码与并发控制陷阱
服务器·开发语言·后端·golang
montEvergreen1 小时前
位运算不是魔法——AV1 配置解析实战
后端
程序猿乐锅1 小时前
【黑马点评 | 第九篇】秒杀优化-异步实现
java·spring boot·redis·后端·spring·中间件·mybatis
Wx-bishekaifayuan1 小时前
springboot户外登山社交小程序19787-计算机课程设计、毕业设计
spring boot·后端·python·spring·elasticsearch·django·课程设计
+VX:Fegn08951 小时前
计算机毕业设计|基于springboot + vue外卖点餐系统(源码+数据库+文档)
数据库·vue.js·spring boot·后端·课程设计
Ticnix3 小时前
RAG 烂大街?烂大街的只是那条流水线——真正的分水岭在这五处
后端·python·agent
Wx-bishekaifayuan4 小时前
springboot社区扶贫救助管理系统13300-计算机课程设计、毕业设计
spring boot·后端·python·django·课程设计·express·旅游
DolphinDB4 小时前
数据库自带 Agent:10 分钟搭起 DolphinX-Web 数据入库与分析框架
后端·架构