keyword-spacing

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

关键字是 JavaScript 的语法元素，例如function和if。这些标识符对语言有特殊意义，因此在代码编辑器中经常以不同的颜色显示。作为语言的重要组成部分，风格指南通常指的是围绕关键词使用的空格。例如，您可能有一个样式指南，指出关键字应始终由空格包围，这意味着if-else语句必须如下所示：

if (foo) {
    // ...
} else {
    // ...
}

当然，你也可以有一个不允许围绕关键字的空格的风格指南。

规则细节

此规则强制执行围绕关键字和关键字标记的一致空格: as (in module declarations), async (of async functions), await (of await expressions), break, case, catch, class, const, continue, debugger, default, delete, do, else, export, extends, finally, for, from (in module declarations), function, get (of getters), if, import, in, instanceof, let, new, of (in for-of statements), return, set (of setters), static, super, switch, this, throw, try, typeof, var, void, while, with, and yield。这个规则的设计要谨慎，不要与其他间隔规则相冲突：它不适用于其他规则报告问题的间隔。

选项

该规则有一个对象选项：

• "before": true （默认）在关键字之前至少需要一个空格

• "before": false 在关键字之前禁止使用空格

• "after": true （默认）在关键字后至少需要一个空格

• "after": false 在关键字后禁止使用空格

• "overrides" 允许覆盖指定关键字的间距样式

before

此规则的默认代码错误代码示例{ "before": true }：

/*eslint keyword-spacing: ["error", { "before": true }]*/

if (foo) {
    //...
}else if (bar) {
    //...
}else {
    //...
}

具有默认选项的此规则的正确代码示例{ "before": true }：

/*eslint keyword-spacing: ["error", { "before": true }]*/
/*eslint-env es6*/

if (foo) {
    //...
} else if (bar) {
    //...
} else {
    //...
}

// no conflict with `array-bracket-spacing`
let a = [this];
let b = [function() {}];

// no conflict with `arrow-spacing`
let a = ()=> this.foo;

// no conflict with `block-spacing`
{function foo() {}}

// no conflict with `comma-spacing`
let a = [100,this.foo, this.bar];

// not conflict with `computed-property-spacing`
obj[this.foo] = 0;

// no conflict with `generator-star-spacing`
function *foo() {}

// no conflict with `key-spacing`
let obj = {
    foo:function() {}
};

// no conflict with `object-curly-spacing`
let obj = {foo: this};

// no conflict with `semi-spacing`
let a = this;function foo() {}

// no conflict with `space-in-parens`
(function () {})();

// no conflict with `space-infix-ops`
if ("foo"in {foo: 0}) {}
if (10+this.foo<= this.bar) {}

// no conflict with `jsx-curly-spacing`
let a = <A foo={this.foo} bar={function(){}} />

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

/*eslint keyword-spacing: ["error", { "before": false }]*/

if (foo) {
    //...
} else if (bar) {
    //...
} else {
    //...
}

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

/*eslint keyword-spacing: ["error", { "before": false }]*/

if (foo) {
    //...
}else if (bar) {
    //...
}else {
    //...
}

after

此规则的默认代码错误代码示例{ "after": true }：

/*eslint keyword-spacing: ["error", { "after": true }]*/

if(foo) {
    //...
} else if(bar) {
    //...
} else{
    //...
}

具有默认选项的此规则的正确代码示例{ "after": true }：

/*eslint keyword-spacing: ["error", { "after": true }]*/

if (foo) {
    //...
} else if (bar) {
    //...
} else {
    //...
}

// not conflict with `array-bracket-spacing`
let a = [this];

// not conflict with `arrow-spacing`
let a = ()=> this.foo;

// not conflict with `comma-spacing`
let a = [100, this.foo, this.bar];

// not conflict with `computed-property-spacing`
obj[this.foo] = 0;

// not conflict with `generator-star-spacing`
function* foo() {}

// not conflict with `key-spacing`
let obj = {
    foo:function() {}
};

// not conflict with `func-call-spacing`
class A {
    constructor() {
        super();
    }
}

// not conflict with `object-curly-spacing`
let obj = {foo: this};

// not conflict with `semi-spacing`
let a = this;function foo() {}

// not conflict with `space-before-function-paren`
function() {}

// no conflict with `space-infix-ops`
if ("foo"in{foo: 0}) {}
if (10+this.foo<= this.bar) {}

// no conflict with `space-unary-ops`
function* foo(a) {
    return yield+a;
}

// no conflict with `yield-star-spacing`
function* foo(a) {
    return yield* a;
}

// no conflict with `jsx-curly-spacing`
let a = <A foo={this.foo} bar={function(){}} />

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

/*eslint keyword-spacing: ["error", { "after": false }]*/

if (foo) {
    //...
} else if (bar) {
    //...
} else {
    //...
}

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

/*eslint keyword-spacing: ["error", { "after": false }]*/

if(foo) {
    //...
} else if(bar) {
    //...
} else{
    //...
}

overrides

此规则的正确代码示例包含以下{ "overrides": { "if": { "after": false }, "for": { "after": false }, "while": { "after": false } } }选项：

/*eslint keyword-spacing: ["error", { "overrides": {
  "if": { "after": false },
  "for": { "after": false },
  "while": { "after": false }
} }]*/

if(foo) {
    //...
} else if(bar) {
    //...
} else {
    //...
}

for(;;);

while(true) {
  //...
}

何时不使用它

如果您不希望强制实现关键字间隔的一致性，那么禁用此规则是安全的。

版本

此规则在 ESLint 2.0.0-beta.1中引入。

资源

• Rule source

• Documentation source