美文网首页饥人谷技术博客JavaScript高级程序设计总结
【JavaScript高程总结】 面向对象的程序设计-理解对象

【JavaScript高程总结】 面向对象的程序设计-理解对象

作者: 动感超逗 | 来源:发表于2018-12-03 11:34 被阅读5次

    对象的属性类型

    -----数据属性

    数据属性包含一个数据值的位置,这个位置上可以读取和写入,数据属性有4个描述其行为的特性 ;

    • [[Configurable]] :表示能否通过delete删除属性从而重新定义属性;能否修改属性的特性或者能否把属性修改成访问器属性;如果我们直接在对象上定义属性如person.name = '小明'则这个数据属性默认的[[Configurable]] 为true

    • [[Enumerable]] : 能否通过for-in循环;

    • [[Writable]] : 表示能否修改属性的值;

    • [[Value]] : 包含这个属性的数据值,读取属性的值从这个位置读取,写入属性的值也是保存在这个位置;

    类向下面一样定义个对象他的属性name的 [[Configurable]],[[Enumerable]], [[Writable]]都为true,[[Value]]则为定义的值‘'小明'对这个值得修改都反映在这个位置上

    var person = {
      name: "小明"
    };
    

    Object.defineProperty()可以修改属性的默认特性;

    接受三个参数:

    • 属性所在对象
    • 属性名称
    • 描述对象;这个对象的属性关键字必须是 Configurable,Enumerable, Writable,Value中一个
    var person = {};
    Object.defineProperty(person, "name", {
        writable: false,
        value: "Nicholas"
    });
    alert(person.name); //"Nicholas" 
    person.name = "Greg"; // 由于writable:设置为false严格模式下这个操作会抛出错误
    alert(person.name); //"Nicholas"
    

    注意:当用Object.defineProperty()吧Configurable设置为false(不可配置)这不能在设置回true(可配置);再次调用Object.defineProperty()修改除writable意外的特性都会报错

    -----访问器属性

    访问器属性不包含数据值但是包含一对getter 和setter函数(这两个函数都不是必须的 );访问器属性有如下四个特性;

    • [[Configurable]] :表示能否通过delete删除属性从而重新定义属性;能否修改属性的特性或者能否把属性修改成访问器属性;如果我们直接在对象上定义属性如person.name = '小明'则这个数据属性默认的[[Configurable]] 为true

    • [[Enumerable]] : 能否通过for-in循环;

    • [[Get]] : 在读取属性的时候调用,默认值为undefined;

    • [[Set]] : 在写入属性的时候调用,默认值为undefined;

    通过Object.defineProperty()可以修改属性的默认特性;

    var book = {
      _year: 2004,
      edition: 1 
    };
    Object.defineProperty(book, "year", {
      get: function(){
        return this._year;
      },
      set: function(newValue){
        if (newValue > 2004) {
            this._year = newValue;
            this.edition += newValue - 2004;
        } 
      }
    });
    book.year = 2005; 
    alert(book.edition); //2
    

    Object.defineProperties()定义多个属性的特性

    var book = {};
    Object.defineProperties(book, {
        _year: {
            value: 2004
        },
        edition: {
            value: 1
        },
        year: {
            get: function(){
                 //代码...
            },
            set: function(newValue){
                // 代码...
            }
        }
    })
    

    Object.getOwnPropertyDescriptor()读取属性的特性

    var book = {};
    Object.defineProperties(book, {
      _year: {
        value: 2004
      },
      edition: {
        value: 1
      },
      year: {
        get: function(){
            return this._year;
        },
        set: function(newValue){
            if (newValue > 2004) {
                this._year = newValue;
                this.edition += newValue - 2004;
            } 
        }
      }
    });
    
    var descriptor = Object.getOwnPropertyDescriptor(book, "_year");
    alert(descriptor.value); //2004
    alert(descriptor.configurable); //false
    alert(typeof descriptor.get); //"undefined"
    
    var descriptor = Object.getOwnPropertyDescriptor(book, "year"); 
    alert(descriptor.value); //undefined 
    alert(descriptor.enumerable); //false
    alert(typeof descriptor.get); //"function"

    相关文章

      网友评论

        本文标题:【JavaScript高程总结】 面向对象的程序设计-理解对象

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