美文网首页
理解Javascript中的数据属性和访问属性

理解Javascript中的数据属性和访问属性

作者: gsonliu | 来源:发表于2016-04-19 07:09 被阅读780次

理解对象

ECMAScript中有两种属性:数据属性和访问器属性

数据属性

示例1:

Nodejs 中

    console.log(global.undefined);//undefined
    global.undefined = 1;
    console.log(global.undefined);//undefined

浏览器中

    console.log(window.undefined);//undefined
    window.undefined = 2;
    console.log(global.undefined);//undefined

在js中一切皆对象,我们都知道全局属性undefined的值为undefined.那么属性就应该是可以修改,上边对全局属性undefined进行修改却没有修改成功,这是为什么呢?

示例2:

Nodejs 中

    var des = Object.getOwnPropertyDescriptor(global,'undefined');
    console.log(des);

输出

    {
      value: undefined,
      writable: false,
      enumerable: false,
      configurable: false
    }

在浏览器中输出也应该一样.上面可以看到有四个属性,这就是javascript中的属性特性,它能设置属性的值,可编辑,可删除,可迭代特性。

  • Configurable

表示能够通过delete删除属性从而重新定义属性,能否修改属性的特性,或者能否把属性修改为访问器属性。默认值true。表示能否删除,如果是false,delete不起作用。在严格模式下报异常

  • Enumerable

表示能否通过for-in 循环返回属性。默认值true。false不可迭代

  • Writable

表示能否修改属性的值,默认是true。false不可修改

  • Value

包含这个属性的数据值,读取属性值的时候,从这个位置读;写入属性的时候把新值保存在这个位置,默认是undefined

要修改属性默认的特性,必须用ECMAScript5的Object.defineProperty(),接受三个参数,属性所在对象,属性名称,一个描述符对象。

示例3:

    var obj = {};
    Object.defineProperty(obj,'name',{
            'value' : 'name',
            'writable' : false
    });
    console.log(obj.name);//name
    obj.name = 'newname';
    console.log(obj.name);//name

访问器属性

示例4:

    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;
    console.log(book.edition);//2

访问器属性不包含数据值,它们包含一对getter和setter函数,(不过这两个函数都不是必须的),默认都是undefined.一般情况不用去定义setter和getter方法.找了很久也不知道在哪种场景适合用。上面这一种就是给一个属性赋值,导致另外一个属性变化,其实在代码中直接实现就可以.

上面代码需要注意的地方是,year用_year代替.前面加下划线是常用的用法,表示只能用对象方法访问的属性.如果用year回导致死循环赋值.

其他

另外还有 Object.definePropties可以批量为属性设置特性

相关文章

网友评论

      本文标题:理解Javascript中的数据属性和访问属性

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