JS构造函数创建对象时的传参问题

    xiaoxiao2021-03-25  95

    当对象属性为字符串时

    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" } });

    如此,就能解决对象的属性值为对象的传参问题了。

    转载请注明原文地址: https://ju.6miu.com/read-15816.html

    最新回复(0)