版本

object-shorthand

要求或禁止物件字面值的方法和屬性簡寫語法

🔧 可修正

此規則報告的一些問題可透過 --fix 命令列選項自動修正

ECMAScript 6 提供了一種簡潔的形式來定義物件字面值的方法和屬性。這種語法可以使定義複雜的物件字面值更加簡潔。

以下是一些使用 ES5 語法的常見範例

// properties
var foo = {
    x: x,
    y: y,
    z: z,
};

// methods
var foo = {
    a: function() {},
    b: function() {}
};

現在這裡有一些 ES6 的等效寫法

// properties
var foo = {x, y, z};

// methods
var foo = {
    a() {},
    b() {}
};

規則詳情

此規則強制使用簡寫語法。這適用於在物件字面值中定義的所有方法(包括產生器),以及任何定義的屬性,其鍵名稱與賦值變數的名稱相符。

以下每個屬性都會發出警告

/*eslint object-shorthand: "error"*/

var foo = {
    w: function() {},
    x: function *() {},
    [y]: function() {},
    z: z
};

在這種情況下,預期的語法應該是

/*eslint object-shorthand: "error"*/

var foo = {
    w() {},
    *x() {},
    [y]() {},
    z
};

此規則不會標記物件字面值內的箭頭函式。以下內容不會發出警告

/*eslint object-shorthand: "error"*/

var foo = {
    x: (y) => y
};

選項

該規則採用一個選項,指定何時應應用該規則。它可以設定為以下值之一

  • "always" (預設) 期望在任何可能的情況下都使用簡寫。
  • "methods" 確保使用方法簡寫 (也適用於產生器)。
  • "properties" 確保使用屬性簡寫 (當鍵和變數名稱相符時)。
  • "never" 確保在任何物件字面值中都不使用屬性或方法簡寫。
  • "consistent" 確保在物件字面值中使用所有簡寫或所有長形式。
  • "consistent-as-needed" 確保在物件字面值中使用所有簡寫或所有長形式,但盡可能確保所有簡寫。

您可以在設定中設定選項,如下所示

{
    "object-shorthand": ["error", "always"]
}

此外,該規則採用一個可選的物件設定

  • "avoidQuotes": true 表示當物件鍵是字串字面值時,優先使用長形式語法 (預設: false)。請注意,此選項只能在字串選項設定為 "always""methods""properties" 時啟用。
  • "ignoreConstructors": true 可用於防止規則報告建構函式的錯誤。(預設情況下,規則會以與其他函式相同的方式處理建構函式)。請注意,此選項只能在字串選項設定為 "always""methods" 時啟用。
  • "methodsIgnorePattern" (string) 對於名稱與此 regex 模式相符的方法,將不會強制執行方法簡寫。請注意,此選項只能在字串選項設定為 "always""methods" 時使用。
  • "avoidExplicitReturnArrows": true 表示對於函式屬性,方法優先於顯式返回箭頭函式。(預設情況下,規則允許這兩種方式)。請注意,此選項只能在字串選項設定為 "always""methods" 時啟用。

avoidQuotes

{
    "object-shorthand": ["error", "always", { "avoidQuotes": true }]
}

使用 "always", { "avoidQuotes": true } 選項時,此規則的錯誤程式碼範例

在遊樂場中開啟
/*eslint object-shorthand: ["error", "always", { "avoidQuotes": true }]*/

var foo = {
    "bar-baz"() {}
};

使用 "always", { "avoidQuotes": true } 選項時,此規則的正確程式碼範例

在遊樂場中開啟
/*eslint object-shorthand: ["error", "always", { "avoidQuotes": true }]*/

var foo = {
    "bar-baz": function() {},
    "qux": qux
};

ignoreConstructors

{
    "object-shorthand": ["error", "always", { "ignoreConstructors": true }]
}

使用 "always", { "ignoreConstructors": true } 選項時,此規則的正確程式碼範例

在遊樂場中開啟
/*eslint object-shorthand: ["error", "always", { "ignoreConstructors": true }]*/

var foo = {
    ConstructorFunction: function() {}
};

methodsIgnorePattern

使用 "always", { "methodsIgnorePattern": "^bar$" } 選項時,此規則的正確程式碼範例

在遊樂場中開啟
/*eslint object-shorthand: ["error", "always", { "methodsIgnorePattern": "^bar$" }]*/

var foo = {
    bar: function() {}
};

avoidExplicitReturnArrows

{
    "object-shorthand": ["error", "always", { "avoidExplicitReturnArrows": true }]
}

使用 "always", { "avoidExplicitReturnArrows": true } 選項時,此規則的錯誤程式碼範例

在遊樂場中開啟
/*eslint object-shorthand: ["error", "always", { "avoidExplicitReturnArrows": true }]*/

var foo = {
  foo: (bar, baz) => {
    return bar + baz;
  },

  qux: (foobar) => {
    return foobar * 2;
  }
};

使用 "always", { "avoidExplicitReturnArrows": true } 選項時,此規則的正確程式碼範例

在遊樂場中開啟
/*eslint object-shorthand: ["error", "always", { "avoidExplicitReturnArrows": true }]*/

var foo = {
  foo(bar, baz) {
    return bar + baz;
  },

  qux: foobar => foobar * 2
};

使用 "consistent" 選項時,此規則的錯誤程式碼範例

在遊樂場中開啟
/*eslint object-shorthand: [2, "consistent"]*/

var foo = {
    a,
    b: "foo",
};

使用 "consistent" 選項時,此規則的正確程式碼範例

在遊樂場中開啟
/*eslint object-shorthand: [2, "consistent"]*/

var foo = {
    a: a,
    b: "foo"
};

var bar = {
    a,
    b,
};

使用 "consistent-as-needed" 選項時,此規則的錯誤程式碼範例,該選項與 "consistent" 非常相似

在遊樂場中開啟
/*eslint object-shorthand: [2, "consistent-as-needed"]*/

var foo = {
    a: a,
    b: b,
};

何時不使用它

任何尚未處於 ES6 環境中的人都不會想套用此規則。其他人可能會覺得簡寫語法的簡潔性難以閱讀,並且可能不想使用此規則來鼓勵它。

版本

此規則在 ESLint v0.20.0 中引入。

延伸閱讀

資源

變更語言