js中的new()到底做了些什么

我们在日常的开发中经常会用到 new 操作符,来看看它到底做了什么事情;

以及它的实现原理 javascript 中,创建对象有两种方式:① 对象字面量   ② new 表达式

// 字面量形式
let person = {
   name: '王新焱',
   age: 33
}

// 构造函数形式 (new)
function Person(name, age) {
  this.name = name
  this.age = age
}

let  person  = new Person()

对象字面量写法缺点是每创建一个新的对象都需要写出完整的定义语句,不便于创建大量相同类型的对象,不利于使用继承等高级特性。

new 表达式是配合构造函数使用的,通过 new 一个构造函数去继承构造函数的属性。

创建 Person 新实例,必须使用 new 操作符。这种方式调用构造函数会经历以下 4个步骤:
①.创建一个空的简单 JavaScript 对象(即 {})
②.为新创建的对象添加属性 __proto__,将该属性链接至构造函数的原型对象
③.将新创建的对象作为 this 的上下文
④.返回新对象

什么是构造函数?
通过 new 函数名 来实例化对象的函数叫构造函数。构造函数与普通函数并没有太大差异,为了区分我们将函数名首字母大写的函数作为构造函数,主要作用就是构造函数通过new关键字创建对象为初始化的对象添加属性和方法。


构造函数在技术上是常规函数。不过有两个约定:

①.它们的命名以大写字母开头。
②.它们只能由 "new" 操作符来执行。

以下是一个构造函数示例:


// 构造函数Person

function Person(name, age) {
  this.name = name
  this.age = age
}

let p = new Person('王新焱', 33)

console.log(p) // { name: '王新焱', age: 33 }

p.constructor === Person // true

p.__proto__ === Person.prototype // true

猜你喜欢

转载自blog.csdn.net/qq_34402069/article/details/129544960