JSLint のページがリニューアル

昨日とは違う画面になっていた。
JSLint のページが新しくなっていました。

オプションの有効・無効の設定が、今までは、白と黒と灰色の表示でしたが、False と True と Default という文字の表示になってわかりやすくなっている。

これまで、オプションの設定に白と黒と灰色の３種類あって、なんで２種類じゃなくて３種類なんだろうと思っていたら、３つめは "Default" だったのか！

んっ、Default ?
Default って True と False のどっちなんだろう・・・。

JSLint で自分のコードをチェックしてみた

JSLint でチェック

JavaScript の品質チェックツールである JSLint を使ってみました。
Web 上で実行してみると警告メッセージがたくさん出た。
見慣れないメッセージがたくさんあり（初めてなので見慣れないのは当たり前だが）、何を直せばいいのか一瞬途方に暮れる。

JSLint は JavaScript の書き方をより良いものにするためのチェックをしてくれるわけですが、では "より良い" というのは、何を目指せば良いのか？　JSLint に合格するには何をすれば良いのか？

何を目指せば良いのかの指針がここに書いてある。
http://www.jslint.com/lint.html （これの翻訳が "JavaScript: The Good Parts" の付録 C にある。）

エラーメッセージ

もう一度エラーメッセージを見てみる。いくつか代表的なものをピックアップ。

・グローバル変数

Problem at line 2 character 12: 'document' was used before it was defined.

すべての変数は使われる前に定義されていないと、JSLint ではエラーとみなされる。 ブラウザで HTML に対して JavaScript を使用する時には "document" プロパティは当然、変数としては 宣言しないのでエラーになります。
オプションの "Assume a browser" にチェックを入れておくとブラウザであることが仮定されて、 document などのグローバルプロパティは宣言済みとみなされエラーとならなくなります。


・var

Problem at line 23 character 10: Move 'var' declarations to the top of the function.

変数宣言を関数の先頭で行いなさいということ。

for (var i=0; i<max; i++) {

といった var の使い方もダメです。
（でも、"JavaScriptパターン" の中で上記のような書き方をしているところを見つけてしまいました。フフッ。 "JavaScript パターン" では全てのコードが JSLint をパスしているはずなのに。）


・インデント

Problem at line 16 character 5: Expected 'callback' at column 9, not column 5.

インデントした文の開始が 5 ではなく 9 列目からにしなさいということ。 自分のコードの中で一つこのエラーの理由がよくわからないところがあるのですが、インデントの指針がどこにも書いていないし、ソフトの品質とは関係ない問題なので、オプション "Tolerate messy white space" で チェックしない様にします。（少し後ろめたいですが・・・。）

Warning!

JSLint のページの最初に、

Warning!
JSLint will hurt your feelings.

とあるように、些細な体裁の問題でたくさんのエラーが出るのでちょっと嫌になります。 でも、JavaScript を公開する前にはやっぱり一度はチェックするようにしようと思います。

なぜなら、

1. JSLint ではブラウザのデバッグツールで見つからなかったエラーも見つかることがある。
2. JSLint は些細な体裁も指摘してくれるので JavaScript 初心者でも、パッと見は恥ずかしくないものに直せる。

からです。

コンパイラは悪くない

インデントの問題に蓋をしてしまいましたが、自分のコードをよくよく見るとインデントにスペースとタブが混在していました。
タブはスペース 4 つと計算されるようです。
本来は同じレベルのインデントになるはずの文で、一方はスペースとタブでもう一方はタブのみとなっていて、 それでインデントを合わせなさいというような警告になっていたのでした。
（最近 Emacs の設定でインデントのタブをスペースに置き換えたので、そのためにスペースとタブが混在してしまったのかもしれません。）

ついつい、コンパイラの方を疑ってしまいました。
達人プログラマー への道は遠いなぁ。

達人プログラマー―システム開発の職人から名匠への道