quote-props
需要引用对象字面值属性名称(quote-props)
在--fix
命令行上的选项可以自动修复一些被这条规则反映的问题。
对象字面值属性名称可以用两种方式定义:使用文字或使用字符串。例如,这两个对象是等价的:
var object1 = {
property: true
};
var object2 = {
"property": true
};
在许多情况下,如果您选择使用标识符而不是字符串,反之亦然,这并不重要。即便如此,您可能会决定在您的代码中执行一致的样式。
但是,有些情况下,您必须使用引号:
1. 如果您使用的是 ECMAScript 3 JavaScript引擎(如 IE8),并且希望将关键字(如if
)用作属性名称。ECMAScript 5中删除了此限制。
2. 你想在属性名称中使用非标识符字符,例如拥有一个类似"one two"
空间的属性。
另一个引用重要的示例是将数字文字用作属性键的情况:
var object = {
1e2: 1,
100: 2
};
这看起来可能一见钟情,但是这个代码事实上在 ECMAScript 5严格模式下会引发语法错误。这是因为1e2
和100
习惯作为属性名之前被迫字符串。两者String(1e2)
和String(100)
碰巧等于"100"
,这会导致“在严格模式下不允许的对象文本中的重复数据属性”错误。像这样的问题对于调试可能会很棘手,所以有些人喜欢在所有属性名称周围加引号。
规则细节
此规则需要引用对象字面值属性名称。
选项
该规则有两个选项,一个字符串选项和一个对象选项。
字符串选项:
"always"
(默认)需要围绕所有对象字面值属性名称进行引号
"as-needed"
不允许围绕非严格要求的对象字面值属性名称进行引号
"consistent"
强制执行一致的引用风格需要引用对象字面值属性名称
"consistent-as-needed"
如果任何名称严格需要引号,则需要在所有对象字面值属性名称周围加引号,否则不允许围绕对象属性名称引用引号
对象选项:
"keywords": true
需要用作对象属性名称的语言关键字周围的引号(仅适用于使用as-needed
or的情况consistent-as-needed
)
"unnecessary": true
(默认)不允许围绕非严格要求的对象字面值属性名称引用(仅在使用时适用as-needed
)
"unnecessary": false
允许围绕不严格要求的对象字面值属性名引用(仅在使用时适用as-needed
)
"numbers": true
需要围绕用作对象属性名称的数字引号(仅在使用时适用as-needed
)
always
此规则的默认"always"
选项错误
代码示例:
/*eslint quote-props: ["error", "always"]*/
var object = {
foo: "bar",
baz: 42,
"qux-lorem": true
};
具有默认"always"
选项的此规则的正确
代码示例:
/*eslint quote-props: ["error", "always"]*/
/*eslint-env es6*/
var object1 = {
"foo": "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
'foo': 'bar',
'baz': 42,
'qux-lorem': true
};
var object3 = {
foo() {
return;
}
};
as-needed
此规则的错误
代码示例包含以下"as-needed"
选项:
/*eslint quote-props: ["error", "as-needed"]*/
var object = {
"a": 0,
"0": 0,
"true": 0,
"null": 0
};
此规则的正确
代码示例包含以下"as-needed"
选项:
/*eslint quote-props: ["error", "as-needed"]*/
/*eslint-env es6*/
var object1 = {
"a-b": 0,
"0x0": 0,
"1e2": 0
};
var object2 = {
foo: 'bar',
baz: 42,
true: 0,
0: 0,
'qux-lorem': true
};
var object3 = {
foo() {
return;
}
};
consistent
此规则的错误
代码示例包含以下"consistent"
选项:
/*eslint quote-props: ["error", "consistent"]*/
var object1 = {
foo: "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
'foo': 'bar',
baz: 42
};
此规则的正确
代码示例包含以下"consistent"
选项:
/*eslint quote-props: ["error", "consistent"]*/
var object1 = {
"foo": "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
'foo': 'bar',
'baz': 42
};
var object3 = {
foo: 'bar',
baz: 42
};
consistent-as-needed
此规则的错误
代码示例包含以下"consistent-as-needed"
选项:
/*eslint quote-props: ["error", "consistent-as-needed"]*/
var object1 = {
foo: "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
'foo': 'bar',
'baz': 42
};
此规则的正确
代码示例包含以下"consistent-as-needed"
选项:
/*eslint quote-props: ["error", "consistent-as-needed"]*/
var object1 = {
"foo": "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
foo: 'bar',
baz: 42
};
keywords
使用以下"as-needed", { "keywords": true }
选项的此规则的其他不正确
代码示例:
/*eslint quote-props: ["error", "as-needed", { "keywords": true }]*/
var x = {
while: 1,
volatile: "foo"
};
使用以下"consistent-as-needed", { "keywords": true }
选项的此规则的其他不正确
代码示例:
/*eslint quote-props: ["error", "consistent-as-needed", { "keywords": true }]*/
var x = {
"prop": 1,
"bar": "foo"
};
unnecessary
此规则的附加正确
代码示例包含以下"as-needed", { "unnecessary": false }
选项:
/*eslint quote-props: ["error", "as-needed", { "keywords": true, "unnecessary": false }]*/
var x = {
"while": 1,
"foo": "bar" // Would normally have caused a warning
};
numbers
使用以下"as-needed", { "numbers": true }
选项的此规则的其他不正确
代码示例:
/*eslint quote-props: ["error", "as-needed", { "numbers": true }]*/
var x = {
100: 1
}
何时不使用它
如果您不关心属性名称是否始终用引号括起来,并且不针对传统ES3环境,请关闭此规则。
进一步阅读
版本
这条规则是在 ESLint 0.0.6中引入的。