美文网首页
JS创建对象及对象属性获取

JS创建对象及对象属性获取

作者: 牙牙and小尾巴 | 来源:发表于2019-04-30 11:27 被阅读0次
    组合方式创建对象

    除了常用的创建单个对象的方式外,我们希望批量创建对象时,一般采用组合方式来创建对象。下面是具体的代码。

     //组合方式创建对象
      function Person(name,age,job){
            this.name=name;
            this.age=age;
            this.job=job;
        };
        Person.prototype={                  
            constructor:Person,
            sex:'men',
            sayName:function(){
                alert(this.name);
            }
        }
        var person1=new Person("Tom");
        var person2=new Person("Mike");
        console.log(person1.name);
        console.log(person2.name);
        console.log(person1.constructor);// ƒ Person()
    

    1.constructor:Person的原因:
    用对象字面量语法表示的时候,原型对象的constructor属性不在指向Person,因为每创建一个函数,同时会创建它的prototype对象,用对象字面量语法本质上相当于重写了prototype对象,constructor属性也会变成新对象的constructor属性(这里指向Object),因此,这里要将constructor重新指向Person
    如果不写constructor:Person,则可以看到

    console.log(person1.constructor);// ƒ Object()
    

    2.如果这样子写,则不需要重新为constructor指向到Person

         Person.prototype.sex='men';
         Person.prototype.sayName=function(){
                alert(this.name);
         };
    

    注意:写到Person.prototype中的属性对于函数和基本类型的共享不存在问题,因为基本类型可以屏蔽掉原型,但是对于引用类型的属性则存在一定的影响,看下面的例子:

       function Person(name,age,job){
           this.name=name;
           this.age=age;
           this.job=job;
       };
       Person.prototype={                  
           constructor:Person,
           sex:'men',
           friends:['lili','hoho'],
           sayName:function(){
               alert(this.name);
           }
       }
       var person1=new Person("Tom");
       var person2=new Person("Mike");
       person1.friends.push('gaga');
       console.log(person1.friends); //['lili','hoho','gaga']
       console.log(person2.friends);//['lili','hoho','gaga']
    
    

    可见,改变person1.friends后,person2.friends也被影响了。因为引用类型的存储是一个指针。
    因此,最好是将对象的私有属性及引用类型的属性,放到构造函数中,而不要放到prototype中。

         function Person(name,age,job){
            this.name=name;
            this.age=age;
            this.job=job;
            this.friends=['lili','hoho'],
        };
        Person.prototype={                  
            constructor:Person,
            sex:'men',
            sayName:function(){
                alert(this.name);
            }
        }
        var person1=new Person("Tom");
        var person2=new Person("Mike");
        person1.friends.push('gaga');
        console.log(person1.friends); //['lili','hoho','gaga']
        console.log(person2.friends);//['lili','hoho']
    
    对象属性获取
    1.Object.keys:

    Object.keys() 方法会返回一个由给定对象的自身可枚举属性组成的数组。
    小技巧:object对象没有length属性,可以通过Object.keys(person1).length,来获取person的长度了。

    console.log(Object.keys(person1));// ["name", "age", "job"]
    
    2.for in :

    使用for in 循环遍历对象的属性时,原型链上的所有属性都将被访问:

         for (var key in person1)
        {
          console.log(key);
        }
        //name age  job constructor sex sayName
    
    3Object.getOwnPropertyNames:

    用来获取对象自身的全部属性名,包括可枚举和不可枚举的属性。

    4.hasOwnProperty():

    检测属性是在实例中还是原型对象中

    使用hasOwnProperty()可以检测出实例对象是否具有某个属性,如果是原型属性统一返回false.

    console.log(person1.hasOwnProperty("sayName"));//false
    
    5.in:

    使用in操作符不管属性是在实例中还是原型对象中,都会返回true.

    console.log("sayName" in person1);//false
    

    ![]0FR9W@4(ZMI~LXYSWJD65.png

    相关文章

      网友评论

          本文标题:JS创建对象及对象属性获取

          本文链接:https://www.haomeiwen.com/subject/lnpmnqtx.html