首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

comma-dangle

--fix命令行上的选项可以自动修复一些被这条规则反映的问题。

根据ECMAScript 5(和ECMAScript 3!)规范,对象文字中的尾随逗号是有效的。但是,IE8(当不在IE8文档模式下)和下面的代码在JavaScript中遇到尾随逗号时会引发错误。

代码语言:javascript
复制
var foo = {
    bar: "baz",
    qux: "quux",
};

尾随逗号可以简化向对象和数组中添加和删除项目的操作,因为只有您正在修改的行必须被触及。支持尾随逗号的另一个论据是,当从对象或数组中添加或删除项目时,它提高了差异的清晰度:

Less clear:

代码语言:javascript
复制
var foo = {
-    bar: "baz",
-    qux: "quux"
+    bar: "baz"
 };

更清晰:

代码语言:javascript
复制
var foo = {
     bar: "baz",
-    qux: "quux",
 };

规则细节

此规则强制在对象和数组文字中一致地使用尾随逗号。

选项

此规则具有字符串选项或对象选项:

代码语言:javascript
复制
{
    "comma-dangle": ["error", "never"],
    // or
    "comma-dangle": ["error", {
        "arrays": "never",
        "objects": "never",
        "imports": "never",
        "exports": "never",
        "functions": "ignore"
    }]
}
  • "never" (默认)不允许尾随逗号
  • "always" 需要尾随逗号
  • "always-multiline"当最后一个元素或属性与闭合的]} 在不同行时需要尾随逗号,以及, 当最后一个元素或属性与闭合的]}在同一行时不允许有尾随逗号
  • "only-multiline"当最后一个元素或属性与闭合的]}在不同行时 允许(但不要求)有尾随逗号,以及,当最后一个元素或属性与闭合]}在同一行时不允许有尾随逗号。

自ECMAScript 2017以来,函数声明和函数调用中的尾随逗号是有效的语法; 但是,字符串选项不检查这些情况的向后兼容性。

您还可以使用对象选项为每种语法类型配置此规则。下列选项每一个都可以被设置为"never""always""always-multiline""only-multiline",或"ignore""never"除非另有说明,每个选项的默认值是。

  • arrays是数组文字和数组模式的解构。(例如let [a,] = [1,];
  • objects是针对解构的对象文字和对象模式。(例如let {a,} = {a: 1};
  • imports用于ES模块的进口申报。(例如import {a,} from "foo";
  • exports用于ES模块的出口申报。(例如export {a,};
  • functions用于函数声明和函数调用。(例如(function(a,){ })(b,);
    • functions被设置为"ignore"默认情况下以字符串选项的一致性。
    • functions 只能在LINTING ECMAScript 2017或更高版本时启用。

决不

此规则的默认代码错误代码示例"never"

代码语言:javascript
复制
/*eslint comma-dangle: ["error", "never"]*/

var foo = {
    bar: "baz",
    qux: "quux",
};

var arr = [1,2,];

foo({
  bar: "baz",
  qux: "quux",
});

具有默认选项的此规则的正确代码示例"never"

代码语言:javascript
复制
/*eslint comma-dangle: ["error", "never"]*/

var foo = {
    bar: "baz",
    qux: "quux"
};

var arr = [1,2];

foo({
  bar: "baz",
  qux: "quux"
});

总是

此规则的错误代码示例包含以下"always"选项:

代码语言:javascript
复制
/*eslint comma-dangle: ["error", "always"]*/

var foo = {
    bar: "baz",
    qux: "quux"
};

var arr = [1,2];

foo({
  bar: "baz",
  qux: "quux"
});

此规则的正确代码示例包含以下"always"选项:

代码语言:javascript
复制
/*eslint comma-dangle: ["error", "always"]*/

var foo = {
    bar: "baz",
    qux: "quux",
};

var arr = [1,2,];

foo({
  bar: "baz",
  qux: "quux",
});

总是多

此规则的错误代码示例包含以下"always-multiline"选项:

代码语言:javascript
复制
/*eslint comma-dangle: ["error", "always-multiline"]*/

var foo = {
    bar: "baz",
    qux: "quux"
};

var foo = { bar: "baz", qux: "quux", };

var arr = [1,2,];

var arr = [1,
    2,];

var arr = [
    1,
    2
];

foo({
  bar: "baz",
  qux: "quux"
});

此规则的正确代码示例包含以下"always-multiline"选项:

代码语言:javascript
复制
/*eslint comma-dangle: ["error", "always-multiline"]*/

var foo = {
    bar: "baz",
    qux: "quux",
};

var foo = {bar: "baz", qux: "quux"};
var arr = [1,2];

var arr = [1,
    2];

var arr = [
    1,
    2,
];

foo({
  bar: "baz",
  qux: "quux",
});

只有-多

此规则的错误代码示例包含以下"only-multiline"选项:

代码语言:javascript
复制
/*eslint comma-dangle: ["error", "only-multiline"]*/

var foo = { bar: "baz", qux: "quux", };

var arr = [1,2,];

var arr = [1,
    2,];

此规则的正确代码示例包含以下"only-multiline"选项:

代码语言:javascript
复制
/*eslint comma-dangle: ["error", "only-multiline"]*/

var foo = {
    bar: "baz",
    qux: "quux",
};

var foo = {
    bar: "baz",
    qux: "quux"
};

var foo = {bar: "baz", qux: "quux"};
var arr = [1,2];

var arr = [1,
    2];

var arr = [
    1,
    2,
];

var arr = [
    1,
    2
];

foo({
  bar: "baz",
  qux: "quux",
});

foo({
  bar: "baz",
  qux: "quux"
});

功能

此规则的错误代码示例包含以下{"functions": "never"}选项:

代码语言:javascript
复制
/*eslint comma-dangle: ["error", {"functions": "never"}]*/

function foo(a, b,) {
}

foo(a, b,);
new foo(a, b,);

此规则的正确代码示例包含以下{"functions": "never"}选项:

代码语言:javascript
复制
/*eslint comma-dangle: ["error", {"functions": "never"}]*/

function foo(a, b) {
}

foo(a, b);
new foo(a, b);

此规则的错误代码示例包含以下{"functions": "always"}选项:

代码语言:javascript
复制
/*eslint comma-dangle: ["error", {"functions": "always"}]*/

function foo(a, b) {
}

foo(a, b);
new foo(a, b);

此规则的正确代码示例包含以下{"functions": "always"}选项:

代码语言:javascript
复制
/*eslint comma-dangle: ["error", {"functions": "always"}]*/

function foo(a, b,) {
}

foo(a, b,);
new foo(a, b,);

何时不使用它

如果你不关注悬摆逗号,你可以关闭这个规则。

该规则在ESLint 0.16.0中引入。

资源

扫码关注腾讯云开发者

领取腾讯云代金券