JavaScript也有getter/setter方法:ES5 Object对象的5个不为人知的特性


发布者 ourjs  发布时间 1441691478297
关键字 JS学习  JavaScript 
这篇博客是关于ECMAScript5 Object的5个不为人知的特性。

1. ECMAScript 5有getter和setter属性方式


ECMAScript 5支持getters和setters。
你可以通过描述方法来实现。 


var obj = {
    get foo() {
        return Math.random();
    },
    set foo(value) {
        console.log('SET foo = '+value);
    },
};

你可以在console(F12)试一下:

> obj.foo
0.6029663002118468
> obj.foo
0.99780507478863
> obj.foo = 123;
SET foo = 123

2 以逗号结尾是合法的


从ES5开始,它就是合法的了,你可以在最后一个属性之后加一个逗号。这将有助于你添加一个新的属性(一些人将逗号前置来避免书写错误):

var translations = {
    yes: 'ja',
    no: 'nein',
    perhaps: 'vielleicht',
};


3. 对象的属性通常不需要使用引号


在ES5属性名的语法规范中规定,对象的属性可以是:

* 唯一标识符
* 字符串
* 数字

3.1 字符串作为key

var obj = {
    '#§$%': true,
    " \t\n": true,
};


3.2 唯一标识符作为key

var obj = {
    π: true,
    привет: true,
    café: true,
    $$$: true,
};

3.3 数字作为key

var obj = {
    1e2: true,
    1e-2: true,
    .234: true,
    0xFF: true,
};

这些数字key会会自动转换成字符串

> Object.keys(obj)
[ '100', '255', '0.01', '0.234' ]

与标识符不同。数字不能被点号引用

> obj.0xFF
SyntaxError: Unexpected token
> obj[0xFF]
true


4. 你可以使用保留字作为key


在 ECMAScript 3中你需要将保留字用引号休修饰这些属性。

> var obj = { 'new': 123 };
> obj['new']
123

在 ECMAScript 5没有必要了。

> var obj = { new: 123 };
> obj.new
123


5. 使用objects作为dictionary(键值对)有一些坑


ECMAScript5没有内置的字典数据结构(被称之为Map)。但其与Map对象还是有一些区别。

第一,你不能使用内置对象作为字典属性。比如hasOwnProperty这属性:

> var data = { hasOwnProperty: true };
> data.hasOwnProperty('someKey')
TypeError: boolean is not a function


其次,你必须小心继承的key。这就不是你想要的情况:

> var data = {}; // empty dictionary
> 'toString' in data
true
> data.toString
[Function: toString]

第三 __proto__作为key的话,会触发很多诡异的问题,因此你需要排除掉这种情况。


function escapeKey(key) {
    // Escape '__proto__', its escaped version etc.
    if (key.indexOf('__proto__') === 0) {
        return key+'%';
    } else {
        return key;
    }
}

function getValue(obj, key) {
    return obj[escapeKey(key)];
}

function setValue(obj, key, value) {
    obj[escapeKey(key)] = value;
}



5.1 正确的使用字典的方式

当一个字典对象的原型是null时,它可以很完美的工作。

> var dict = Object.create(null);
> dict.foo = 123;
> 'toString' in dict
false
> dict.toString
undefined
> 'foo' in dict
true






回复 (2)
微信扫码 立即评论