[JavaScript面试问题]6. new的原理

最新推荐文章于 2024-10-01 18:51:18 发布

阿非233353

最新推荐文章于 2024-10-01 18:51:18 发布

阅读量110

点赞数

文章标签： javascript 前端原型模式

本文链接：https://blog.csdn.net/m0_52769805/article/details/124700291

版权

这篇博客探讨了JavaScript中的对象创建过程，详细解释了如何使用构造函数和原型链来创建及初始化新对象。通过`_new`函数的实现，展示了如何手动模拟`new`操作符的工作原理，包括创建空对象、设置原型、执行构造函数以及处理返回值。示例中创建了`person`构造函数，并展示了如何创建`tom`和`perter`两个实例，以及它们如何调用原型上的`show`方法显示姓名和年龄。

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

1 创建一个空对象

2 将该对象的原型链接到要创建的对象上

3 将构造函数的作用域赋值给新对象，即this指向这个新对象

4 如果函数没有返回其他对象，那么new表达式中的函数调用会自动返回这个新对象。

function person(name, age) {
        this.name = name
        this.age = age
      }
      person.prototype.show = function () {
        console.log(`${this.name},${this.age}`)
      }

      function _new(fn, ...arg) {
        var obj = {}
        obj.__proto__ = fn.prototype
        let res = fn.apply(obj, arg)
        return res instanceof Object ? res : obj
      }

      let tom = new person('tom', 18)
      console.log(tom)
      tom.show()

      let perter = _new(person, 'perter', 220)
      console.log(perter)
      perter.show()