3. 對象

2023-02-16 09:16 更新
  • 3.1 使用字面值創(chuàng)建對象。

    // bad
    const item = new Object();
    
    // good
    const item = {};
  • 3.2 如果你的代碼在瀏覽器環(huán)境下執(zhí)行,別使用 保留字 作為鍵值。這樣的話在 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 創(chuàng)建有動態(tài)屬性名的對象時,使用可被計算的屬性名稱。

    為什么?因為這樣可以讓你在一個地方定義所有的對象屬性。

      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 使用對象方法的簡寫。

    // 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,
      };


以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號