JS构造函数创建对象时的传参问题
2017-03-09 本文已影响0人
JacobMa1996
当对象属性为字符串时
function User(obj){
this.name = obj.name;
this.password = obj.password;
}
var user = new User({
name:"name",
password:"password"
});
window.onload = function(){
console.log(user);
}
通过构造函数传参的方式新建对象,并可以正确输出对象
但是如果对象在属性值为一个对象
function User(obj){
this.loginInfos.name = obj.loginInfos.name;
this.loginInfos.password = obj.loginInfos.password;
}
var user = new User({
loginInfos:{
name:"name",
password:"password"
}
});
window.onload = function(){
console.log(user);
}
会显示**"Can not find property 'name' of undfined" ** ,就是找不到this.loginInfos这个属性,这是因为在构造函数User(obj)中,没有定义loginInfos这个属性,自然找不到loginInfos.name,那为什么前面直接定义this.name可以呢?
javascript在全局作用域中定义的函数,是定义在Global对象中的(即浏览器的window对象),在全局作用域中调用普通函数,this就指向Global对象(window对象),我们这里说构造函数,其实在没有使用new操作符时,User(boj)就是一个普通函数,所以当它在全局作用域中不通过new操作符调用时,this.name就是window.name;
function User(obj){
this.name = obj.name;
this.password = obj.password;
}
User({name:"name",password:"password"});
window.onload = function(){
console.log(window.name);//name
console.log(window.password);//password
}
而通过new操作符创建对象,会经历以下4个步骤:
1.创建一个新对象
2.将构造函数的作用域赋给新对象(因此this就指向了这个新对象)
3.执行构造函数中的代码(为这个新对象添加属性)
4.返回新对象
所以如果要通过构造函数传参创建一个属性值为对象的对象,可以在构造函数定义好属性值为对象的属性,可以如下
function User(obj){
this.loginInfos = {};
this.loginInfos.name = obj.loginInfos.name;
this.loginInfos.password = obj.loginInfos.password;
}
var user = new User({
loginInfos:{
name:"name",
password:"password"
}
});
如此,就能解决对象的属性值为对象的传参问题了。