JavaScript简易实现new关键字

最新推荐文章于 2024-09-25 14:48:34 发布

wisdom-bear

最新推荐文章于 2024-09-25 14:48:34 发布

阅读量365

点赞数 2

分类专栏： JavaScript new 文章标签：原型模式 javascript 前端

本文链接：https://blog.csdn.net/qq_36413409/article/details/126104418

版权

JavaScript 同时被 2 个专栏收录

3 篇文章 0 订阅

订阅专栏

new

1 篇文章 0 订阅

订阅专栏

本文探讨了new关键字的作用，如何自定义构造函数myNew，包括创建空对象、设置原型链、执行函数体及返回值判断。并通过Object.create优化，并介绍了如何使用myNew创建Bear实例并调用其方法。

摘要由CSDN通过智能技术生成

手写一个方法之前要理清逻辑，首先就是我们要知道new这个关键字它到底干了什么？

1.创建一个空对象
2.设置原型链，将新的对象的隐式原型指向构造函数的原型对象
3.修改构造函数 this 指针指向新对象,并执行函数体
4.判断返回值，返回对象就用该对象,没有的话就创建一个对象

咱一步一步来，首先创建方法，设置参数，第一个参数是传递进来的构造函数，第二个参数是构造函数的参数

function myNew(con,...args) {}

1.创建空对象

function myNew(con,...args) {
  let obj = {}
}

2.设置原型链，将新的对象的隐式原型指向构造函数的原型对象

function myNew(con,...args) {
  let obj = {}
  obj.__proto__ = con.prototype
}

3.修改构造函数 this 指针指向新对象,并执行函数体

function myNew(con,...args) {
  let obj = {}
  obj.__proto__ = con.prototype
  let res = con.call(obj,...args)
}

4.判断返回值，返回对象就用该对象,没有的话就创建一个对象（完整代码）

function myNew(con,...args) {
  let obj = {}
  obj.__proto__ = con.prototype
  let res = con.call(obj,...args)
  if(res instanceof Object) {
    return res
  }else {
    return obj
  }
}

现在让我们试一下。能行

function Bear(age) {
  this.name = 'wisdom'
  this.age = age
  this.hobby = function() {
    console.log('dance');
  }
}
let bear = myNew(Bear,'18')
bear.hobby()//dance
console.log(bear.age);//age

突然想到Object.create()也能创建对象，他的作用是能创建一个新对象，使用现有的对象来作为新创建对象的原型（prototype），那么就可以用这个来优化一下

直接把构造函数的原型指向新对象，并且最后可以用三元表达式来简化

function myNew(con,...args) {
  let obj = Object.create(con.prototype)
  let res = con.call(obj,...args)
  return res instanceof Object ? res : obj
}

以上为个人学习总结，如有不对，请及时指出