• Object.defineProperty()


    对象的定义

    对象是由多个名/值成对组成的无序的集合。对象中每个属性对应任意类型的值。
    定义对象可以使用构造函数或字面量的形式:

    //采用构造函数方式,构造一个空对象。
     var obj = new Object; 
     obj.name = "张三";  //添加属性
     obj.say = function(){};  //添加方法
    //采用字面量方式创建对象
    var obj={};
    obj.name = "张三";  //添加属性
    obj.say = function(){};  //添加方法

    除了以上方式外还有一种方式Object.defineProperty可以给对象添加属性或者修改属性。

    Object.defineProperty()

    Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象。

    语法

    Object.defineProperty(obj, prop, descriptor)

    参数

    obj要在其上定义属性的对象。

    prop要定义或修改的属性的名称。

    descriptor将被定义或修改的属性描述符。

    返回值

    被传递给函数的对象。

    该方法允许精确添加或修改对象的属性。通过赋值操作添加的普通属性是可枚举的,能够在属性枚举期间呈现出来(for...in 或 Object.keys 方法),

    这些属性的值可以被改变,也可以被删除。这个方法允许修改默认的额外选项(或配置)。默认情况下,使用 Object.defineProperty() 添加的属性

    值是不可修改的。

    属性描述符

    对象里目前存在的属性描述符有两种主要形式:数据描述符存取描述符数据描述符是一个具有值的属性,该值可能是可写的,也可能不是可写的。

    存取描述符是由getter-setter函数对描述的属性。描述符必须是这两种形式之一;不能同时是两者。

    数据描述符和存取描述符均具有以下可选键值:

    configurable当且仅当该属性的 configurable 为 true 时,该属性描述符才能够被改变,同时该属性也能从对应的对象上被删除。默认为 false

    enumerable当且仅当该属性的enumerable为true时,该属性才能够出现在对象的枚举属性中。默认为 false

    数据描述符同时具有以下可选键值

    value该属性对应的值。可以是任何有效的 JavaScript 值(数值,对象,函数等)。默认为 undefined

    writable当且仅当该属性的writable为true时,value才能被赋值运算符改变。默认为 false

    存取描述符同时具有以下可选键值

    get一个给属性提供 getter 的方法,如果没有 getter 则为 undefined。当访问该属性时,该方法会被执行,方法执行时没有参数传入,但是会传
    this对象(由于继承关系,这里的this并不一定是定义该属性的对象)。默认为 undefined
    set一个给属性提供 setter 的方法,如果没有 setter 则为 undefined。当属性值修改时,触发执行该方法。该方法将接受唯一参数,即该属性新
    的参数值。默认为 undefined

    描述符可同时具有的键值:

    如果一个描述符不具有value,writable,get 和 set 任意一个关键字,那么它将被认为是一个数据描述符。如果一个描述符同时有(value或

    writable)和(get或set)关键字,将会产生一个异常。

    示例

    创建属性

    如果对象中不存在指定的属性,Object.defineProperty()就创建这个属性。当描述符中省略某些字段时,这些字段将使用它们的默认值。拥有布尔值

    的字段的默认值都是falsevaluegetset字段的默认值为undefined。一个没有get/set/value/writable定义的属性被称为“通用的”,并被“键入”

    为一个数据描述符。示例:

    var o = {}; // 创建一个新对象
    
    // 在对象中添加一个属性与数据描述符的示例
    Object.defineProperty(o, "a", {
      value : 37,
      writable : true,
      enumerable : true,
      configurable : true
    });
    
    // 对象o拥有了属性a,值为37
    
    // 在对象中添加一个属性与存取描述符的示例
    var bValue;
    Object.defineProperty(o, "b", {
      get : function(){
        return bValue;
      },
      set : function(newValue){
        bValue = newValue;
      },
      enumerable : true,
      configurable : true
    });
    
    o.b = 38;
    // 对象o拥有了属性b,值为38
    
    // o.b的值现在总是与bValue相同,除非重新定义o.b
    
    // 数据描述符和存取描述符不能混合使用
    Object.defineProperty(o, "conflict", {
      value: 0x9f91102, 
      get: function() { 
        return 0xdeadbeef; 
      } 
    });

    修改属性

    如果属性已经存在,Object.defineProperty()将尝试根据描述符中的值以及对象当前的配置来修改这个属性。如果旧描述符将其configurable 属性

    设置为false,则该属性被认为是“不可配置的”,并且没有属性可以被改变(除了单向改变 writable 为 false)。当属性不可配置时,不能在数

    据和访问器属性类型之间切换。

    当试图改变不可配置属性(除了valuewritable 属性之外)的值时会抛出TypeError,除非当前值和新值相同。

    var o = {}; // Creates a new object
    
    Object.defineProperty(o, 'a', {
      value: 37,
      writable: false
    });
    
    console.log(o.a); // logs 37
    o.a = 25; // No error thrown
    // (it would throw in strict mode,
    // even if the value had been the same)
    console.log(o.a); // logs 37. The assignment didn't work.
    
    // strict mode
    (function() {
      'use strict';
      var o = {};
      Object.defineProperty(o, 'b', {
        value: 2,
        writable: false
      });
      o.b = 3; // throws TypeError: "b" is read-only
      return o.b; // returns 2 without the line above
    }());

    如示例所示,试图写入非可写属性不会改变它,也不会引发错误。

    添加多个属性和默认值

    考虑特性被赋予的默认特性值非常重要,通常,使用点运算符和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
    });

    详情请见:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty

  • 相关阅读:
    Linux运维之监控CPU和内存的日志工具
    Linux磁盘缓存的有趣实验
    Linux运维之内存分析2
    Linux运维之内存分析
    使用kubectl create 和 kubectl apply创建资源对象的区别
    Docker学习:Image的本地存储结构
    Docker 空间使用分析与清理
    HeidiSQL、Navicat、mysql命令和source命令导入sql脚本的速度比较
    Centos 7.2天兔(Lepus 3.8)数据库监控系统部署
    MegaCli 监控raid状态
  • 原文地址:https://www.cnblogs.com/wxf-h/p/10555440.html
Copyright © 2020-2023  润新知