zoukankan      html  css  js  c++  java
  • 四、Object.defineProperty总结

     Object.defineProperty() 

    参考:https://segmentfault.com/a/1190000007434923


    定义:
    方法会直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象。
    语法  
    Object.defineProperty(obj,prop,descriptor)  
    #### 参数
    obj
    需要定义属性的对象。  
    prop
    需定义或修改的属性的名字。  
    descriptor
    将被定义或修改的属性的描述符。  
    返回值  
    ==返回传入函数的对象,即第一个参数obj==

    ```
    value: 设置属性的值
    writable: 值是否可以重写。true | false
    enumerable: 目标属性是否可以被枚举。true | false
    configurable: 目标属性是否可以被删除或是否可以再次修改特性 true | false
    ```

    一、writable  default : false
    当writable 为false 时 属性值不允许被修改

    var  obj={};
    Object.defineProperty(obj,"a",
    {
        value:1
    });
    obj.a++;
    console.dir(obj.a); // 1 
    
    02var  obj={};
    Object.defineProperty(obj,"a",
    {
        value:"shangyy,
        writable:true
    });
    obj.a="huyating";
    console.dir(obj.a);  //huyating
    View Code


    二、 enumerable  默认为false 是否允许属性被遍历

    var  obj={uname:"shangyy",age:18};
    Object.defineProperty(obj,"a",
    {
        value:1,
        writable:false,
        enumerable:false
    });
    console.dir(Object.keys(obj)); // 0: "uname" 1: "age"
    
    var  obj={uname:"shangyy",age:18};
    Object.defineProperty(obj,"a",
    {
        value:1,
        writable:false,
        enumerable:false
    });
    console.dir(Object.keys(obj)); // 0: "uname" 1: "age" 2:"a"
    View Code


    三、configurable  
    是否可以删除目标属性或是否可以再次修改属性的特性(writable, configurable, enumerable)。设置为true可以被删除或可以重新设置特性;设置为false,不能被可以被删除或不可以重新设置特性。默认为false。

    这个属性起到两个作用:

    目标属性是否可以使用delete删除

    目标属性是否可以再次设置特性
    var obj = {}

    #### 001 测试目标属性是否能被删除
    ```

    //第一种情况:configurable设置为false,不能被删除。
    Object.defineProperty(obj,"newKey",{
        value:"hello",
        writable:false,
        enumerable:false,
        configurable:false
    });
    //删除属性
    delete obj.newKey;
    console.log( obj.newKey ); //hello

    //第二种情况:configurable设置为true,可以被删除。
    Object.defineProperty(obj,"newKey",{
        value:"hello",
        writable:false,
        enumerable:false,
        configurable:true
    });
    //删除属性
    delete obj.newKey;
    console.log( obj.newKey ); //undefined
    ```
    002 测试是否可以再次修改特性
    ```

    //第一种情况:configurable设置为false,不能再次修改特性。
    Object.defineProperty(obj,"newKey",{
        value:"hello",
        writable:false,
        enumerable:false,
        configurable:false
    });

    //重新修改特性
    Object.defineProperty(obj,"newKey",{
        value:"hello",
        writable:true,
        enumerable:true,
        configurable:true
    });
    console.log( obj.newKey ); //报错:Uncaught TypeError: Cannot redefine property: newKey

    //第二种情况:configurable设置为true,可以再次修改特性。
    Object.defineProperty(obj,"newKey",{
        value:"hello",
        writable:false,
        enumerable:false,
        configurable:true
    });

    //重新修改特性
    Object.defineProperty(obj,"newKey",{
        value:"hello",
        writable:true,
        enumerable:true,
        configurable:true
    });
    console.log( obj.newKey ); //hello
    ```

    #### ****getter或setter
    ==注意:当使用了getter或setter方法,不允许使用writable和value这两个属性==  
    注意:get或set不是必须成对出现,任写其一就可以。如果不设置方法,则get和set的默认值为undefined

    var obj = {};
    var initValue = 'hello';
    Object.defineProperty(obj,"newKey",{
        get:function (){
            //当获取值的时候触发的函数
            return initValue;    
        },
        set:function (value){
            //当设置值的时候触发的函数,设置的新值通过参数value拿到
            initValue = value;
        }
    });
    //获取值
    console.log( obj.newKey );  //hello
    
    //设置值
    obj.newKey = 'change value';
    console.log( obj.newKey ); //change value
    View Code
  • 相关阅读:
    dede 专题的调用
    dede织梦CMS文件夹目录结构
    [转]Dedecms备份还原网站有效方法
    dede入侵步骤
    dede限制标题长度后,鼠标移到标题,不显示完整的锚文本标题解决方法
    dede列表缩图中,给缩图添加alt锚文本信息的方法
    dede织梦_高级功能function扩展-dede @me
    《DSP using MATLAB》示例Example4.8
    《DSP using MATLAB》示例Example4.7
    《DSP using MATLAB》示例Example4.6
  • 原文地址:https://www.cnblogs.com/shangyueyue/p/9993885.html
Copyright © 2011-2022 走看看