javascript中初始化构造函数时new所起的做用

先看一下以下实例代码函数

function Person(name,age){
	this.name=name;
	this.age=age;
}
Person.prototype.say=function(){
	console.log("姓名:"+this.name+",年龄:"+this.age);				
}
var p1=new Person("黎明",30);
console.log(p1.name);//黎明
p1.say();//姓名:黎明,年龄:30
复制代码

一、new在这个过程当中执行了如下三个步骤

一、建立一个空对象;
二、而后让这个空对象的__proto__指向函数的原型prototype,继承了该函数的原型。
三、调用call方法,将这个空对象对象做为函数的this传进去,而且最后隐式的返回这个空对象 。this

二、调用构造函数使用new关键字的状况

var p1=new Person("黎明",30)这句代码的内部代码执行以下:spa

new Person("黎明",30)={
     var obj  = {};//建立一个空对象 
	 obj.__proto__ = Person.prototype;   
	 Person.call(obj,"黎明",30);
	 return obj;
 }
复制代码

  分析:因此new在这个过程当中的做用是,使p1继承了Person的name和age属性,使p1的原型指向了Person的原型,使得p1拥有了Person的所有实例属性和原型对象,所以p1具备了name和age属性以及say方法。new Person("黎明",30)返回的是以下所示的对象prototype

三、调用构造函数不使用new关键字的状况

var p2=Person("李明",24);
 console.log(p2.name);//Cannot read property 'age' of undefined
复制代码

  分析:此时至关于只是调用了Person("李明",24)的这样一个普通方法,并非调用Person构造函数建立一个新的实例对象,而且该方法没有返回值,因此调用Person("李明",24)返回的是默认值undefined。所以P2也没有name和age属性。code

var p2=Person("李明",24)
p1.say.call(p2);//"姓名:李明,年龄:24
复制代码

为何这句代码会有输出呢?缘由以下
cdn

一、var p2=Person("李明",24);在Person构造方法中的this表示的是window,因此就有;对象

window.name="李明";
        window.age=24;
复制代码

二、p1.say.call(p2)中的p2表示是调用Person("李明",24)构造函数后的返回值,可是该构造函数没有返回值,所以p2=undefined,根据call方法的定义,因此在say()方法中的this表示window。 blog

四、调用构造函数时,在内部有retun语句的状况

function Person(name,age){
	this.name=name;
	this.age=age;
	return name;
}
 var p1=new Person("黎明",23);
 console.log(p1);//{name: "黎明",age:23}
复制代码

function Person(name,age){
	this.name=name;
	this.age=age;
	return {};
}
 var p1=new Person("黎明",23);
 console.log(p1);//{}
复制代码

  缘由分析:构造函数不须要显示的返回值。使用new来建立对象(调用构造函数)时,若是return返回的是非对象(数字、字符串、布尔类型等)会忽略返回值;若是return的是对象,则返回该对象(注:若return null也会忽略返回值)。继承

相关文章
相关标签/搜索