3.1: new 基本原理
new命令的作用,就是执行一个构造函数,并且返回一个对象实例。使用new命令时,它后面的函数调用就不是正常的调用,而是依次执行下面的步骤。
a:创建一个空对象,作为将要返回的对象实例。
b:将空对象的原型指向了构造函数的prototype属性。
c:将空对象赋值给构造函数内部的this关键字。
d:开始执行构造函数内部的代码。
也就是说,构造函数内部,this指向的是一个新生成的空对象,所有针对this的操作,都会发生在这个空对象上。构造函数之所谓构造函数,意思是这个函数的目的就是操作一个空对象(即this对象),将其构造为需要的样子。
以上是new命令的基本原理,这个很重要。以下会用具体实例来验证该原理的过程。
一个问题,如果我们忘记使用new命令来调用构造函数,直接调用构造函数了,会发生什么?
这种情况下,构造函数就变成了普通函数,并不会生成实例对象。而且由于后面会说到的原因,this这时代表全局对象,将造成一些意想不到的结果
function Keith(){ this.height = 180; } var person = Keith(); console.log(person.height); //person is underfined
上面代码中,当在调用构造函数Keith时,忘记加上new命令。结果是this指向了全局作用域,height也就变成了全局变量。而变量person变成了undefined。
因此,应该非常小心,避免出现不使用new命令、直接调用构造函数的情况
如果构造函数内部有return语句,而且return后面跟着一个复杂数据类型(对象,数组等),new命令会返回return语句指定的对象;如果return语句后面跟着一个简单数据类型(字符串,布尔值,数字等),则会忽略return语句,返回this对象。
function Keith(){ this.height = 180; return{ height:200 }; } var boy = new Keith(); console.log(boy.height) //200 function Keith(){ this.height =100; return 200; } var boy = new Keith(); console.log(boy.height); //100
总结一下:我们这里有个Foo函数,这个函数有个prototype的对象属性,它的作用就是当使用new Foo()去构造实例的时候,这个构造器的prototype属性会用作new出来的这些对象的原型。
所以我们要搞清楚,prototype和原型是两回事,prototype是函数对象上的预设属性,原型通常是构造器上的prototype属性。