ESLint 1.0.0新ルールまとめ
こんにちは、@armorik83 です。ESLint 1.0.0がリリースされました(今朝 Twitter で気付いた)。以前.eslintrc
を晒したあとあまり面倒を見てなかったので、これを機に動向を追ってみました。
1.0.0 新ルールまとめとしましたが、前回の記事以降にリリースされた v0.21.0 から v0.24.0 も扱います。全ての変更点や Breaking Change は扱わず、新ルールだけ取り上げます。
v0.21.0 (May 10)
dot-location
var a = universe.galaxy;
var b = universe.galaxy;
私はb
派。
no-unneeded-ternary
// Bad
var isYes = answer === 1 ? true : false;
// Good
var isYes = answer === 1;
その三項演算子要る?っていう指摘。
linebreak-style
// option 'unix'
var a = 'a';\r\n
// option 'windows'
var a = 'a';\n
面倒なところも面倒みてくれる。
--init
http://eslint.org/docs/user-guide/command-line-interface#options
CLI に--init
が追加されました。今まで他人のコピペなどで下地作りをすることが多かったと思いますが、取っ付き易くなりました。ルールではないですが重要な新機能として。
v0.22.0 (May 31)
object-curly-spacing
var obj = { foo: "bar" };
var obj = { foo: "bar" };
var obj = { foo: { zoo: "bar" } };
var obj = { foo: { zoo: "bar" } };
わかる。これバラついたり、他の担当者のソース確認しにいったりしますよね。
lines-around-comment
var night = "long";
/* what a great and wonderful day */
var day = "great";
var night = "long";
/* what a great and wonderful day */
var day = "great";
これもわかるなぁ。
accessor-pairs
// Bad
var o = {
set a(value) {
this.val = value;
},
};
// Good
var o = {
set a(value) {
this.val = value;
},
get a() {
return this.val;
},
};
アクセサがペアで用意されているかも面倒見られるようになりました。
no-empty-character-class
no-empty-class
は deprecated となりました。
v0.23.0 (Jun 15)
prefer-const
let a = 3;
console.log(a);
再格納してないならconst
でよくね?という指摘。これを待っていた!
spaced-comment
// This is a comment with a whitespace at the beginning
//This is a comment with no whitespace at the beginning
有りそうで無かった。
v0.24.0 (Jun 27)
no-unexpected-multiline
主にケツセミコロン絡み。ニッチな需要がありそうな箇所。
constructor-super, no-this-before-super
http://eslint.org/docs/rules/constructor-super > http://eslint.org/docs/rules/no-this-before-super
super()
絡み。今までも Babel が警告していましたが、IDE・エディタレベルで早期発見ができて嬉しい。
array-bracket-spacing
var arr = ["foo", "bar"];
var arr = ["foo", "bar"];
var arr = [["foo"], "bar"];
var arr = [["foo"], "bar"];
object-curly-spacing
に続いて Array 版。
v1.0.0 (Aug 1)
ようやく v1.0.0 の話です。rc.1 とか rc.2 とかは無視して、stable にまとめます。1.0.0 から「全てのルールの初期値は Off となる」という Breaking Change が入ったので、0.x 系の方は"Migrating to v1.0.0"を読んで備えてください。
arrow-parens, arrow-spacing
http://eslint.org/docs/rules/arrow-parens > http://eslint.org/docs/rules/arrow-spacing
@Jxck*先生案件が本採用されました!
callback-return
function foo() {
if (err) {
callback(err); // ここreturn要るよね?
}
callback();
}
return
漏れを見つけます。callback-return: [2, ["callback", "cb", "next"]]
といったオプションでreturn
を期待する引数名を宣言できる。
id-length, id-match
http://eslint.org/docs/rules/id-length > http://eslint.org/docs/rules/id-match
変数名の長さ、変数名の正規表現 match。ありそうでなかった。"id-length": [2, {"min": 3, "max": 10, "exceptions": ["i"]}]
などで 1 文字変数名も例外的に許容できるのがエラい。
init-declarations
var
やlet
の宣言タイミングについて。常時const
派なので使わなさそう。
no-class-assign
class
に再格納なんてやめてください。
no-const-assign
個人的大本命!const
宣言した変数への再格納を禁止できます。これを待ってたよー!
no-implicit-coercion
var b = !!foo;
var b = ~foo.indexOf(".");
var n = +foo;
var n = 1 * foo;
var s = "" + foo;
JS での型キャストなど、初学者がとっつきにくい記法を扱えます。
no-invalid-this
JS のややこしいthis
をより強固に検出できる。
no-useless-call, prefer-reflect
http://eslint.org/docs/rules/no-useless-call > http://eslint.org/docs/rules/prefer-reflect
.call()
や.apply()
といった複雑そうにみえる箇所について。うっ…Reflect
不勉強でした。
prefer-spread
var args = [1, 2, 3, 4];
Math.max.apply(Math, args);
var args = [1, 2, 3, 4];
Math.max(...args);
また.apply()
絡み。ES 2015 の Spread operator を積極的に使おうというオプションは学習用途にも良い。
require-yield
Generator にyield
が無ければ警告。まだ不慣れなのでありがたい。
感想
@mysticatea 先生無双でした!
今回は ES 2015 構文についての検証が豊富で、前回の構築時(5 月)から 3 ヶ月でえらい整った印象です。3 ヶ月程度で.eslintrc
を見直さないと腐ってしまうと学べました。prefer-.*
は ES 2015 のベストな書き方を推奨する優秀なオプションで心強いです。どんどん使っちゃいましょう。
それでは快適な ES 2015 ライフを!
Discussion