• ES5 Object.defineProperty 方法


    先看一个例子:

    var o = {};
    o.a = 1;
    // 等待于:
    Object.defineProperty(o, 'a', {
      value: 1,
      writable: true,
      configurable: true,
      enumerable: true
    });
    
    Object.defineProperty(o, 'a', { value: 1 });
    // 等待于:
    Object.defineProperty(o, 'a', {
      value: 1,
      writable: false,
      configurable: false,
      enumerable: false
    });

    下面详细描述这些参数的意义:

    configurable

    false(默认)

    true
    1) 对象的描述可以修改或者增加, 描述包括 configurable enumerable set get value

    2) obj.b 是可以删除的, delete(obj.b);

    下面的例子设置为 false 以后, 再设置 上面的那些属性都会报错。

    var o = {}
    Object.defineProperty(o, 'b', {
      configurable: false
    });
    Object.defineProperty(o, 'b', {
      configurable: true
    }); // thrown error
    Object.defineProperty(o, 'b', {
      enumerable: false
    }); // thrown error

    enumerable

    false(默认)
    true, 代表是可以枚举的

    value

    undefined(默认)
    obj 的属性的值

    writable
    false(默认)
    true, 代表这个值可以修改, 修改值不受 configurable 影响

    var o = {}
    Object.defineProperty(o, 'b', {
      configurable: false,
      value: 2,
      writable: true
    });
    o.value = 3333; // 3333

    set 和 get 方法

    对象取值会调用get方法, 取得的值为 get 函数里的返回值
    对象赋值会调用set方法, 但是若赋值是用 Object.defineProperty 则不会调用set方法

    例:
    var o = {}
    Object.defineProperty(o, 'b', {
      configurable: true,
      get: () => { console.log('get'); return 1},
      set: (para) => { console.log('set' + para); }
    });
    o.b; // 输出'get'; 值为1
    o.b = 2; // 输出'set2'; 值为2
    
    
    // 下面的赋值 不会调用 set 方法
    Object.defineProperty(o, 'b', {
      value: 22222
    }); // o.b = 22222
    
    
    // 注意下面的写法则会报错
    Object.defineProperty(obj, 'b', {
        value: 1,
      get: function() { return 1; }
    });
    
    Uncaught TypeError: Invalid property descriptor. Cannot both specify accessors and a value or writable attribute
    不能同时设置 存取器(get 和 set方法) 和 (value 或 writable) 属性, 就算 writable 属性设置为 true 也不行

    参考地址:

    https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty

  • 相关阅读:
    项目质量管理
    项目成本管理
    项目进度管理
    项目范围管理
    项目整体管理
    项目立项管理
    信息系统项目管理基础
    信息化和信息系统
    linux(3)
    Patorjk
  • 原文地址:https://www.cnblogs.com/zhengming2016/p/6703201.html
Copyright © 2020-2023  润新知