comma-style

强制执行一致的逗号样式

🔧 Fixable

此规则报告的一些问题可通过 --fix 命令行选项自动修复

此规则在 ESLint v8.53.0 中已弃用。请在 @stylistic/eslint-plugin-js 中使用 相应的规则

¥This rule was deprecated in ESLint v8.53.0. Please use the corresponding rule in @stylistic/eslint-plugin-js.

逗号样式规则强制使用逗号分隔列表的样式。JavaScript 中主要使用两种逗号样式:

¥The Comma Style rule enforces styles for comma-separated lists. There are two comma styles primarily used in JavaScript:

  • 标准样式,其中逗号放在当前行的末尾

    ¥The standard style, in which commas are placed at the end of the current line

  • 逗号优先样式,其中逗号放在下一行的开头

    ¥Comma First style, in which commas are placed at the start of the next line

使用 Comma First 样式的理由之一是它可以帮助跟踪缺少和尾随的逗号。这些都是有问题的,因为变量声明中缺少逗号会导致全局变量泄漏,而尾随逗号会导致旧版本 IE 中的错误。

¥One of the justifications for using Comma First style is that it can help track missing and trailing commas. These are problematic because missing commas in variable declarations can lead to the leakage of global variables and trailing commas can lead to errors in older versions of IE.

规则详情

¥Rule Details

此规则在数组字面、对象字面和变量声明中强制使用一致的逗号样式。

¥This rule enforce consistent comma style in array literals, object literals, and variable declarations.

本规则不适用于下列任何一种情况:

¥This rule does not apply in either of the following cases:

  • 逗号前后是换行符(单逗号)

    ¥comma preceded and followed by linebreak (lone comma)

  • 单行数组字面量、对象字面量和变量声明

    ¥single-line array literals, object literals, and variable declarations

选项

¥Options

此规则有一个字符串选项:

¥This rule has a string option:

  • "last"(默认)需要在数组元素、对象属性或变量声明之后且在同一行上有一个逗号

    ¥"last" (default) requires a comma after and on the same line as an array element, object property, or variable declaration

  • "first" 需要在数组元素、对象属性或变量声明之前和同一行上使用逗号

    ¥"first" requires a comma before and on the same line as an array element, object property, or variable declaration

此规则还接受一个额外的 exceptions 对象:

¥This rule also accepts an additional exceptions object:

  • "exceptions" 具有名称与 JavaScript 代码的抽象语法树 (AST) 中的节点类型相对应的属性:

    ¥"exceptions" has properties whose names correspond to node types in the abstract syntax tree (AST) of JavaScript code:

    • "ArrayExpression": true 忽略数组字面量中的逗号样式

      ¥"ArrayExpression": true ignores comma style in array literals

    • "ArrayPattern": true 忽略解构数组模式中的逗号样式

      ¥"ArrayPattern": true ignores comma style in array patterns of destructuring

    • "ArrowFunctionExpression": true 忽略箭头函数表达式参数中的逗号样式

      ¥"ArrowFunctionExpression": true ignores comma style in the parameters of arrow function expressions

    • "CallExpression": true 忽略函数调用参数中的逗号样式

      ¥"CallExpression": true ignores comma style in the arguments of function calls

    • "FunctionDeclaration": true 忽略函数声明参数中的逗号样式

      ¥"FunctionDeclaration": true ignores comma style in the parameters of function declarations

    • "FunctionExpression": true 忽略函数表达式参数中的逗号样式

      ¥"FunctionExpression": true ignores comma style in the parameters of function expressions

    • "ImportDeclaration": true 忽略导入声明说明符中的逗号样式

      ¥"ImportDeclaration": true ignores comma style in the specifiers of import declarations

    • "ObjectExpression": true 忽略对象字面量中的逗号样式

      ¥"ObjectExpression": true ignores comma style in object literals

    • "ObjectPattern": true 忽略解构对象模式中的逗号样式

      ¥"ObjectPattern": true ignores comma style in object patterns of destructuring

    • "VariableDeclaration": true 忽略变量声明中的逗号样式

      ¥"VariableDeclaration": true ignores comma style in variable declarations

    • "NewExpression": true 忽略构造函数表达式参数中的逗号样式

      ¥"NewExpression": true ignores comma style in the parameters of constructor expressions

确定由 ESTree 定义的节点类型的一种方法是将 AST Explorer 与 espree 解析器一起使用。

¥A way to determine the node types as defined by ESTree is to use AST Explorer with the espree parser.

last

使用默认 "last" 选项的此规则的错误代码示例:

¥Examples of incorrect code for this rule with the default "last" option:

在线运行
/*eslint 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" 选项的此规则的正确代码示例:

¥Examples of correct code for this rule with the default "last" option:

在线运行
/*eslint 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" 选项的此规则的错误代码示例:

¥Examples of incorrect code for this rule with the "first" option:

在线运行
/*eslint comma-style: ["error", "first"]*/

var foo = 1,
    bar = 2;

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

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

使用 "first" 选项的此规则的正确代码示例:

¥Examples of correct code for this rule with the "first" option:

在线运行
/*eslint 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 语句中强制使用逗号样式。

¥An example use case is to enforce comma style only in var statements.

此规则的错误代码示例以及示例 "first", { "exceptions": { … } } 选项:

¥Examples of incorrect code for this rule with sample "first", { "exceptions": { … } } options:

在线运行
/*eslint comma-style: ["error", "first", { "exceptions": { "ArrayExpression": true, "ObjectExpression": true } }]*/

var o = {},
    a = [];

此规则的正确代码示例以及示例 "first", { "exceptions": { … } } 选项:

¥Examples of correct code for this rule with sample "first", { "exceptions": { … } } options:

在线运行
/*eslint comma-style: ["error", "first", { "exceptions": { "ArrayExpression": true, "ObjectExpression": true } }]*/

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

何时不使用

¥When Not To Use It

如果你的项目不关心强制使用一致的逗号样式,则可以安全地关闭此规则。

¥This rule can safely be turned off if your project does not care about enforcing a consistent comma style.

版本

此规则是在 ESLint v0.9.0 中引入。

进阶读物

资源

ESLint 中文网
粤ICP备13048890号