3. 对象

由 jimjing123 创建, 最后一次修改 2016-02-24
  • 3.1 使用字面值创建对象。

    // bad
    const item = new Object();
    
    // good
    const item = {};
  • 3.2 如果你的代码在浏览器环境下执行,别使用 保留字 作为键值。这样的话在 IE8 不会运行。 更多信息。 但在 ES6 模块和服务器端中使用没有问题。

    // bad
    const superman = {
      default: { clark: 'kent' },
      private: true,
    };
    
    // good
    const superman = {
      defaults: { clark: 'kent' },
      hidden: true,
    };
  • 3.3 使用同义词替换需要使用的保留字。

    // bad
    const superman = {
      class: 'alien',
    };
    
    // bad
    const superman = {
      klass: 'alien',
    };
    
    // good
    const superman = {
      type: 'alien',
    };
  • 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',
      };
  • 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 使用对象属性值的简写。

    为什么?因为这样更短更有描述性。

      const lukeSkywalker = 'Luke Skywalker';
    
      // bad
      const obj = {
        lukeSkywalker: lukeSkywalker,
      };
    
      // good
      const obj = {
        lukeSkywalker,
      };
  • 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,
      };
以上内容是否对您有帮助:
二维码
建议反馈
二维码