js new在调用构造函数时发生了什么

196 阅读1分钟

1、用三个例子来康康背后发生了什么

1.1 无return情况,默认返回一个新对象

如图我们可以看到,通过new调用person构造函数时返回的是一个新对象{sexy:'boy'},同时我们打印person构造函数的prototype发现,构造函数person的proptotype被赋值给新对象xiaoming的_proto_

1.2 有return情况,返回return后面的的对象

通过代码我们可以看到构造函数有return情况时会返回return后面的对象,不会返回新对象了

1.3 当有return情况,但return后面不是对象时,return后面的内容会被忽略而返回默认的新对象

此时返回默认的新对象{sexy:'boy'}

2、原理总结

实际上使用 new 调用构造函数时,会依次执行下面的操作:

  1. 创建一个新对象;
  2. 构造函数的 prototype 被赋值给这个新对象的 _proto_
  3. 将新对象赋给当前的 this ;
  4. 执行构造函数;
  5. 如果函数没有返回其他对象,那么 new 表达式中的函数调用会自动返回这个新对象,如果返回的不是对象将返回默认的新对象; (以上引自慕课专栏课件)

3、注意事项

箭头函数没有构造函数,不能使用new调用,会报错。

原文参考自(侵删):juejin.cn/post/684490…