JavaScript：new操作符

痛定思痛。 2024-03-22 12:52 79阅读 0赞

**一、new操作符的作用**

用于创建一个给定构造函数的实例对象

new操作符创建一个用户定义的对象类型的实例 或 具有构造函数的内置对象的实例。  
  
**二、new一个构造函数的执行过程**

2.1、创建一个空对象obj  
2.2、将空对象的原型与构造函数的原型连接起来  
2.3、将构造函数中的this绑定到新建对象 / 空对象作为构造函数的上下文 / 改变this指向  
2.4、返回该对象 / 对构造函数返回值的处理判断 / 如果该函数没有返回对象，则返回 **`this`**

new 通过构造函数创建出来的实例可以访问到构造函数中的属性或方法  
  
**三、手写new**

3.1、手写new

function myNew(Func,...args){
         const obj = {}
         obj.__proto__=Func.prototype;
         let result = Func.apply(obj,args);
         return result instanceof Object ?result:obj;
     }

3.2、测试myNew

function Singer (name) {
        this.name = name
    }
    
    let S1 = myNew(Singer, "费玉清")
    
    console.log(S1)
    console.log(S1.__proto__ === Singer.prototype)

3.3、执行

![9cecc925b2da4371a1a1d351d3694d77.png][]

**四、new的意义，为什么需要new**

[https://www.cnblogs.com/onepixel/p/5043523.html][https_www.cnblogs.com_onepixel_p_5043523.html]

[new 运算符 - JavaScript | MDN][new _ - JavaScript _ MDN]

**五、相关内容**

[JavaScript：构造函数\_snow@li的博客-CSDN博客][JavaScript_snow_li_-CSDN]

**六、参考链接**

[【JS】十五、new操作符具体做了什么？\_哔哩哔哩\_bilibili][JS_new_bilibili]

[https://www.cnblogs.com/onepixel/p/5043523.html][https_www.cnblogs.com_onepixel_p_5043523.html]

[new操作符\_苦尽东来的博客-CSDN博客][new_-CSDN]

[9cecc925b2da4371a1a1d351d3694d77.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/a95df7c574d447a7a82af1218f85d0c9.png
[https_www.cnblogs.com_onepixel_p_5043523.html]: https://www.cnblogs.com/onepixel/p/5043523.html
[new _ - JavaScript _ MDN]: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/new
[JavaScript_snow_li_-CSDN]: https://blog.csdn.net/snowball_li/article/details/121858501
[JS_new_bilibili]: https://www.bilibili.com/video/BV1FF411H7ig/?spm_id_from=333.337.search-card.all.click&vd_source=704e2597123fc066b03283e82eb866c0
[new_-CSDN]: https://blog.csdn.net/weixin_51157081/article/details/115577751