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

admin

admin

发表于 2016-07-14 16:07:25

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.foo0.6029663002118468> obj.foo0.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,

    " tn": 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.0xFFSyntaxError: Unexpected token> obj[0xFF]true



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


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


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


在 ECMAScript 5没有必要了。


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



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 datatrue> 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 dictfalse> dict.toStringundefined> 'foo' in dicttrue





用户评论(0)
大牛,别默默的看了,快登录帮我点评一下吧 :)      登录 | 注册

×
×
51前端

注册

×
绑定手机

请绑定手机号,在继续操作

×
单次下载支付

应付金额:279

支付完成后,回到下载页面,在进行下载

官方QQ群
意见反馈
qq群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到