JS之new关键字

这是我参与更文挑战的第22天，活动详情查看： 更文挑战

JS之new

new的作用就是执行一个构造函数，返回一个实例对象。在new的过程中，根据构造函数的情况来确定是否可以接受参数的传递。

function Person(){
	this.name:"An"
}
var p1 = new Person()
console.log(p.name)//An

可以看出p1是由构造函数Person生成的一个实例对象。那new在生成实例的过程中都做了哪些事情呢？

1. 创建一个新的对象，此处就是对应p1
2. 将构造函数的作用域赋给新对象(this指向新对象)
3. 执行构造函数中的代码(给新对象添加属性)
4. 返回新对象

如果没new关键字会怎么样

function Person(){
	this.name:"An"
}
var p = Person()
console.log(p.name)//undefined
console.log(p) //undefined
console.log(name) //An

没有new的情况下，JavaScript在默认情况下this的指向是window，所以name输出的就是An。

如果构造函数中有return一个对象的操作，结果会怎么样？

function Person(){
   this.name = 'An'; 
   return {age: 22}
}
var p = new Person(); 
console.log(p)  // {age: 22}
console.log(p.name) // undefined
console.log(p.age) // 18

可以看到p.name居然是undefined，当构造函数最后return出来是一个和this无关的对象时，new命令相当于直接失效了。

function Person(){
   this.name = 'An'; 
   return {age: 22}
}
var p = Person(); 
console.log(p)  // {age: 22}
console.log(p.name) // undefined
console.log(p.age) // 18

可以看到即使不添加new，结果也是完全一样的。

我们接着试一下返回一个原始类型会怎么样

function Person(){
   this.name = 'An'; 
   return 1
}
var p = new Person(); 
console.log(p)  // {name: "An"}
console.log(p.name) // An
console.log(p.age) // undefined

可以看出来，和直接new是一样的，没有任何区别。

结论：如果在构造函数中返回对象类型，那么new就会失效，生成的对象就是返回的对象；如果在构造函数中返回的是原始类型，那么return对构造函数没任何影响，等于return没写。

还有一点新创建的对象的隐式原型指向该函数的原型，这一步是为了继承构造函数原型上的属性和方法。