no-extra-parens
このルールは、必要な場合にのみ括弧の使用を制限します。
ルールの詳細
このルールは、次の周囲の余分な括弧を常に無視します。
- wrap-regexルールとの競合を避けるための、
(/abc/).test(var)のような正規表現リテラル - wrap-iifeルールとの競合を避けるための、
var x = (function () {})();やvar x = (function () {}());のような即時実行関数式（IIFEとも呼ばれます） - arrow-parensルールとの競合を避けるための、アロー関数の引数
このルールによって報告された問題は、括弧を削除すると新しいディレクティブが作成され、コードのセマンティクスが変更される可能性がある場合を除き、自動的に修正できます。たとえば、次のスクリプトはコンソールにobjectを出力しますが、"use strict"の周りの括弧を削除すると、代わりにundefinedが出力されます。
<!--
// this is a script
// -->
("use strict");
function test() {
console.log(typeof this);
}
test();この場合、ルールは"use strict"の周りの括弧を削除しようとはしませんが、それでも問題を報告します。
オプション
このルールには文字列オプションがあります
"all"(デフォルト) は、あらゆる式の周囲の不要な括弧を許可しません"functions"は、関数式の周囲のみの不要な括弧を許可しません
このルールには、"all"オプションに対する例外のオブジェクトオプションがあります
"conditionalAssign": falseは、条件テスト式での代入の周囲の余分な括弧を許可します"returnAssign": falseは、returnステートメントでの代入の周囲の余分な括弧を許可します"nestedBinaryExpressions": falseは、ネストされた二項演算式での余分な括弧を許可します"ternaryOperandBinaryExpressions": falseは、三項演算子?:のオペランドである二項演算式の周囲の余分な括弧を許可します"ignoreJSX": "none|all|multi-line|single-line"は、JSXコンポーネントの周囲の余分な括弧を、なし/すべて/複数行/単一行で許可します。デフォルトはnoneです。"enforceForArrowConditionals": falseは、アロー関数の本体である三項演算子の周りの余分な括弧を許可します"enforceForSequenceExpressions": falseは、シーケンス式の周囲の余分な括弧を許可します"enforceForNewInMemberExpressions": falseは、メンバー式でのnew式の周囲の余分な括弧を許可します"enforceForFunctionPrototypeMethods": falseは、関数式での即時の.callおよび.applyメソッド呼び出しの周り、および同じコンテキスト内の関数式の周りの余分な括弧を許可します。"allowParensAfterCommentPattern": "any-string-pattern"は、正規表現に一致するコメントが先行する余分な括弧を許可します。
all
デフォルトの"all"オプションを使用した、このルールの不正なコードの例
/* eslint @stylistic/no-extra-parens: "error" */
a = (b * c);
(a * b) + c;
for (a in (b, c));
for (a in (b));
for (a of (b));
typeof (a);
(Object.prototype.toString.call());
class A {
[(x)] = 1;
}
class B {
x = (y + z);
}デフォルトの"all"オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: "error" */
(0).toString();
({}.toString.call());
(function(){}) ? a() : b();
(/^a$/).test(x);
for (a of (b, c));
for (a of b);
for (a in b, c);
for (a in b);
class A {
[x] = 1;
}
class B {
x = y + z;
}conditionalAssign
"all"と{ "conditionalAssign": false }オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { "conditionalAssign": false }] */
while ((foo = bar())) {}
if ((foo = bar())) {}
do; while ((foo = bar()))
for (;(a = b););returnAssign
"all"と{ "returnAssign": false }オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { "returnAssign": false }] */
function a1(b) {
return (b = 1);
}
function a2(b) {
return b ? (c = d) : (c = e);
}
b => (b = 1);
b => b ? (c = d) : (c = e);nestedBinaryExpressions
"all"と{ "nestedBinaryExpressions": false }オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { "nestedBinaryExpressions": false }] */
x = a || (b && c);
x = a + (b * c);
x = (a * b) / c;ternaryOperandBinaryExpressions
"all"と{ "ternaryOperandBinaryExpressions": false }オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { "ternaryOperandBinaryExpressions": false }] */
(a && b) ? foo : bar;
(a - b > a) ? foo : bar;
foo ? (bar || baz) : qux;
foo ? bar : (baz || qux);ignoreJSX
allと{ "ignoreJSX": "all" }オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { ignoreJSX: "all" }] */
const ThisComponent = (<div />)
const ThatComponent = (
<div
prop={true}
/>
)allと{ "ignoreJSX": "multi-line" }オプションを使用した、このルールの不正なコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { ignoreJSX: "multi-line" }] */
const ThisComponent = (<div />)
const ThatComponent = (<div><p /></div>)allと{ "ignoreJSX": "multi-line" }オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { ignoreJSX: "multi-line" }] */
const ThisComponent = (
<div>
<p />
</div>
)
const ThatComponent = (
<div
prop={true}
/>
)allと{ "ignoreJSX": "single-line" }オプションを使用した、このルールの不正なコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { ignoreJSX: "single-line" }] */
const ThisComponent = (
<div>
<p />
</div>
)
const ThatComponent = (
<div
prop={true}
/>
)allと{ "ignoreJSX": "single-line" }オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { ignoreJSX: "single-line" }] */
const ThisComponent = (<div />)
const ThatComponent = (<div><p /></div>)enforceForArrowConditionals
"all"と{ "enforceForArrowConditionals": false }オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { "enforceForArrowConditionals": false }] */
const b = a => 1 ? 2 : 3;
const d = c => (1 ? 2 : 3);enforceForSequenceExpressions
"all"と{ "enforceForSequenceExpressions": false }オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { "enforceForSequenceExpressions": false }] */
(a, b);
if ((val = foo(), val < 10)) {}
while ((val = foo(), val < 10));enforceForNewInMemberExpressions
"all"と{ "enforceForNewInMemberExpressions": false }オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { "enforceForNewInMemberExpressions": false }] */
const foo = (new Bar()).baz;
const quux = (new Bar())[baz];
(new Bar()).doSomething();enforceForFunctionPrototypeMethods
"all"と{ "enforceForFunctionPrototypeMethods": false }オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { "enforceForFunctionPrototypeMethods": false }] */
const foo = (function () {}).call();
const bar = (function () {}).apply();
const baz = (function () {}.call());
const quux = (function () {}.apply());allowParensAfterCommentPattern
このルールで特定のコメントが先行する余分な括弧を許可するには、このオプションをRegExpコンストラクターに渡される文字列パターンに設定します。
"all"と{ "allowParensAfterCommentPattern": "@type" }オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: ["error", "all", { "allowParensAfterCommentPattern": "@type" }] */
const span = /**@type {HTMLSpanElement}*/(event.currentTarget);
if (/** @type {Foo | Bar} */(options).baz) console.log('Lint free');
foo(/** @type {Bar} */ (bar), options, {
name: "name",
path: "path",
});
if (foo) {
/** @type {Bar} */
(bar).prop = false;
}functions
"functions"オプションを使用した、このルールの不正なコードの例
/* eslint @stylistic/no-extra-parens: ["error", "functions"] */
((function foo() {}))();
var y = (function () {return 1;});"functions"オプションを使用した、このルールの正しいコードの例
/* eslint @stylistic/no-extra-parens: ["error", "functions"] */
(0).toString();
(Object.prototype.toString.call());
({}.toString.call());
(function(){} ? a() : b());
(/^a$/).test(x);
a = (b * c);
(a * b) + c;
typeof (a);