`comma-style`

カンマスタイルルールは、カンマ区切りのリストのスタイルを適用します。JavaScriptでは主に2つのカンマスタイルが使用されます。

標準スタイルでは、カンマは現在の行の最後に配置されます。
カンマファーストスタイルでは、カンマは次の行の先頭に配置されます。

カンマファーストスタイルを使用する正当性の1つは、不足しているカンマと末尾のカンマを追跡するのに役立つことです。これらは問題となる可能性があります。なぜなら、変数宣言でのカンマの不足はグローバル変数のリークにつながる可能性があり、末尾のカンマは古いバージョンのIEでエラーにつながる可能性があるからです。

ルール詳細

このルールは、配列リテラル、オブジェクトリテラル、および変数宣言において、一貫したカンマスタイルを適用します。

このルールは、以下のいずれかの場合にも適用されません。

改行の前後にカンマがある場合（孤立したカンマ）
単一行の配列リテラル、オブジェクトリテラル、および変数宣言

オプション

このルールには、文字列オプションがあります。

"last" (デフォルト) は、配列要素、オブジェクトプロパティ、または変数宣言の後、同じ行にカンマを配置することを要求します。
"first" は、配列要素、オブジェクトプロパティ、または変数宣言の前、同じ行にカンマを配置することを要求します。

このルールは、追加のexceptionsオブジェクトも受け入れます。

"exceptions"には、JavaScriptコードの抽象構文木（AST）のノードタイプに対応する名前のプロパティがあります。
- "ArrayExpression": true は、配列リテラルのカンマスタイルを無視します。
- "ArrayPattern": true は、デストラクチャリングの配列パターンのカンマスタイルを無視します。
- "ArrowFunctionExpression": true は、アロー関数式の引数のカンマスタイルを無視します。
- "CallExpression": true は、関数呼び出しの引数のカンマスタイルを無視します。
- "FunctionDeclaration": true は、関数宣言の引数のカンマスタイルを無視します。
- "FunctionExpression": true は、関数式の引数のカンマスタイルを無視します。
- "ImportDeclaration": true は、import宣言の指定子のカンマスタイルを無視します。
- "ObjectExpression": true は、オブジェクトリテラルのカンマスタイルを無視します。
- "ObjectPattern": true は、デストラクチャリングのオブジェクトパターンのカンマスタイルを無視します。
- "VariableDeclaration": true は、変数宣言のカンマスタイルを無視します。
- "NewExpression": true は、コンストラクタ式の引数のカンマスタイルを無視します。

ESTreeで定義されているノードタイプを確認する方法の1つは、espreeパーサーを使用してAST Explorerを使用することです。

last

デフォルトの"last"オプションを使用する場合の、正しくないコードの例

/*eslint @stylistic/js/comma-style: ["error", "last"]*/

var foo = 1
,

bar = 2;

var foo = 1
    ,
 bar = 2;

var foo = ["apples"
                      ,
 "oranges"];

function baz() {
    return {
        "a": 1
                ,
"b:": 2
    };
}

不正

デフォルトの"last"オプションを使用する場合の、正しいコードの例

/*eslint @stylistic/js/comma-style: ["error", "last"]*/

var foo = 1, bar = 2;

var foo = 1,
    bar = 2;

var foo = ["apples",
           "oranges"];

function baz() {
    return {
        "a": 1,
        "b:": 2
    };
}

正解

first

"first"オプションを使用する場合の、正しくないコードの例

/*eslint @stylistic/js/comma-style: ["error", "first"]*/

var foo = 1,

    bar = 2;

var foo = ["apples",

           "oranges"];

function baz() {
    return {
        "a": 1,

        "b:": 2
    };
}

不正

"first"オプションを使用する場合の、正しいコードの例

/*eslint @stylistic/js/comma-style: ["error", "first"]*/

var foo = 1, bar = 2;

var foo = 1
    ,bar = 2;

var foo = ["apples"
          ,"oranges"];

function baz() {
    return {
        "a": 1
        ,"b:": 2
    };
}

正解

exceptions

使用例としては、`var`ステートメントでのみカンマスタイルを適用することが挙げられます。

サンプルの"first", { "exceptions": { … } }オプションを使用する場合の、正しくないコードの例

/*eslint @stylistic/js/comma-style: ["error", "first", { "exceptions": { "ArrayExpression": true, "ObjectExpression": true } }]*/

var o = {},

    a = [];

不正

サンプルの"first", { "exceptions": { … } }オプションを使用する場合の、正しいコードの例

/*eslint @stylistic/js/comma-style: ["error", "first", { "exceptions": { "ArrayExpression": true, "ObjectExpression": true } }]*/

var o = {fst:1,
         snd: [1,
               2]}
  , a = [];

正解

使用しない場合

プロジェクトで一貫したカンマスタイルの適用を気にしない場合は、このルールを安全にオフにすることができます。

comma-style ​

ルール詳細 ​

オプション ​

last ​

first ​

exceptions ​

使用しない場合 ​