zoukankan      html  css  js  c++  java
  • Object.defineProperty的理解

    一、Object.defineProperty:给一个对象定义一个新的属性或修改一个对象现有的属性,并且返回这个对象

    1.语法:Object.defineProperty(参数1,参数2,参数3)

      参数1:目标对象

      参数2:需要修改或者添加的属性名

      参数3:目标对象属性的一些特征(是一个对象)

      其中参数3中也有一些参数:

        参数1:value:属性值

        参数2:writable:对象属性值是否可被修改,true表示允许,false表示不允许

        参数3:configurable:对象属性是否可被删除,true为允许,false为不允许

        参数4:enumerable:对象属性是否可被枚举(即遍历)

        参数5:get():给一个属性提供getter方法,当访问这个对象的属性值时触发该方法

        参数6:set():给一个属性提供setter方法,当设置这个对象的属性值时触发该方法

    二、参数示例

    1、value

      var obj = {};
      Object.defineProperty(obj,"name",{value:"Leslie Cheung"});
      Object.defineProperty(obj,"age",{value:22});
      console.log(obj);//Object(是一个Object对象)

    2、writable

        var obj = {};
        Object.defineProperty(obj,"name",{
            value:"Leslie Cheung",
            writable:false//为false时不允许修改
        })
        obj.name = "leslie-cheung";
        console.log(obj.name);//Leslie Cheung
    
        var obj = {};
        Object.defineProperty(obj,"name",{
            value:"Leslie Cheung",
            writable:true//为true时允许修改
        })
        obj.name = "leslie-cheung";
        console.log(obj.name);//leslie-cheung

    3、configurable

        var obj = {};
        Object.defineProperty(obj,"name",{
            value:"Leslie Cheung",
            configurable:false//为false时不允许被删除
        })
        delete obj.name;
        console.log(obj.name);//Leslie Cheung
    
        var obj = {};
        Object.defineProperty(obj,"name",{
            value:"Leslie Cheung",
            configurable:true//为true时允许被删除
        })
        delete obj.name;
        console.log(obj.name);//undefined

    4、enumerable

        var obj = {name:"Leslie Cheung",age:"20"};
        Object.defineProperty(obj,"name",{
            enumerable:false//为false时不可被遍历
        });
        Object.defineProperty(obj,"age",{
            enumerable:false//为false时不可被遍历
        });
        console.log(Object.keys(obj));//[]
    
        var obj = {name:"Leslie Cheung",age:"20"};
        Object.defineProperty(obj,"name",{
            enumerable:true//为true时可被遍历
        });
        Object.defineProperty(obj,"age",{
            enumerable:true//为true时可被遍历
        });
        console.log(Object.keys(obj));//["name", "age"]

    5、get()和set()

        var obj = {name:"Leslie Cheung"};
        Object.defineProperty(obj,"name",{
            get(){
                console.log("被访问,触发get()方法");//被访问时触发get()方法
            },
            set(val){
                console.log("被设置了" + val + ",触发set()方法");//被设置时触发set()方法
            }
        });
        obj.name;//输出结果:被访问,触发get()方法
        obj.name = "leslie-cheung";//输出结果:被设置了leslie-cheung,触发set()方法
    注意:当使用了get()方法或者set()方法的时候就不能使用value和writable中的任何一个属性否则会报错

    6、for in和Object.keys()的区别

        function Person(name,age){
            this.name = name;
            this.age = age;
        }
        Person.prototype = {
            sex:"男"
        }
        var man = new Person("Leslie Cheung",20);
        console.log(Object.keys(man));//["name", "age"],返回一个数组,数组值为对象自身的属性,不包括继承原型的属性
        for(var key in man){
            console.log(key);//name age sex,遍历对象可枚举的属性,包括自身的属性,以及继承原型的属性
        }
  • 相关阅读:
    2017.5.8下午
    2017.5.8上午
    2017.5.5下午
    2017.5.5上午
    2017.5.4下午
    WPF DataGrid LoadingRow style 滚动失效
    centos nginx 环境变量
    Kettle-03-定时转换
    Kettle-02-转换
    Kettle-01-安装(CentOS 7 离线)
  • 原文地址:https://www.cnblogs.com/Leslie-Cheung1584304774/p/10557131.html
Copyright © 2011-2022 走看看