3. 对象

最后更新于:2022-04-01 21:12:04

* [3.1](https://github.com/yuche/javascript#3.1) 使用字面值创建对象。 ~~~ // bad const item = new Object(); // good const item = {}; ~~~ * [3.2](https://github.com/yuche/javascript#3.2) 如果你的代码在浏览器环境下执行,别使用 [保留字](http://es5.github.io/#x7.6.1) 作为键值。这样的话在 IE8 不会运行。 [更多信息](https://github.com/airbnb/javascript/issues/61)。 但在 ES6 模块和服务器端中使用没有问题。 ~~~ // bad const superman = { default: { clark: 'kent' }, private: true, }; // good const superman = { defaults: { clark: 'kent' }, hidden: true, }; ~~~ * [3.3](https://github.com/yuche/javascript#3.3) 使用同义词替换需要使用的保留字。 ~~~ // bad const superman = { class: 'alien', }; // bad const superman = { klass: 'alien', }; // good const superman = { type: 'alien', }; ~~~ * [3.4](https://github.com/yuche/javascript#3.4) 创建有动态属性名的对象时,使用可被计算的属性名称。 > 为什么?因为这样可以让你在一个地方定义所有的对象属性。 ~~~ function getKey(k) { return `a key named ${k}`; } // bad const obj = { id: 5, name: 'San Francisco', }; obj[getKey('enabled')] = true; // good const obj = { id: 5, name: 'San Francisco', [getKey('enabled')]: true, }; ~~~ * [3.5](https://github.com/yuche/javascript#3.5) 使用对象方法的简写。 ~~~ // bad const atom = { value: 1, addValue: function (value) { return atom.value + value; }, }; // good const atom = { value: 1, addValue(value) { return atom.value + value; }, }; ~~~ * [3.6](https://github.com/yuche/javascript#3.6) 使用对象属性值的简写。 > 为什么?因为这样更短更有描述性。 ~~~ const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { lukeSkywalker: lukeSkywalker, }; // good const obj = { lukeSkywalker, }; ~~~ * [3.7](https://github.com/yuche/javascript#3.7) 在对象属性声明前把简写的属性分组。 > 为什么?因为这样能清楚地看出哪些属性使用了简写。 ~~~ const anakinSkywalker = 'Anakin Skywalker'; const lukeSkywalker = 'Luke Skywalker'; // bad const obj = { episodeOne: 1, twoJedisWalkIntoACantina: 2, lukeSkywalker, episodeThree: 3, mayTheFourth: 4, anakinSkywalker, }; // good const obj = { lukeSkywalker, anakinSkywalker, episodeOne: 1, twoJedisWalkIntoACantina: 2, episodeThree: 3, mayTheFourth: 4, }; ~~~
';