JavaScriptの品質チェックと厳格なコーディングには「JSLint」と「use strict」を使う[ECMAScript5以降]

JavaScriptの「品質チェック」「厳格なコーディング」を確認する方法です。

品質チェック - JSLint

JavaScriptのコードの品質チェックには「JSLint」というWebアプリを使用します。操作方法はチェックしたいコードをテキストボックスにコピペしてボタンを押すだけです。

品質チェックを試すには、私のはじめてのJavaScriptライブラリの粗雑なコードでやってみるといいです。(2003年のDelphiコードからJavaScriptに移植)

pdf-designer.js (192k)

実行例

Warningsの警告で「JSLint was unable to finish.」(JSLintは終了することができませんでした。)という事になりました。特に多いのは「Unexpected trailing space.」(予期しない末尾のスペース。)ですね。

JSLintに関してはチェックが厳しすぎるので使用している方は少ないかも知れません。この記事のメインは次の厳格なコーディングの章です。

厳格なコーディング - use strict

厳格なコーディングは「ソースコードの先頭」または「関数毎」に

の行を追加します。

[ソースの先頭]

"use strict";

function hoge() {
  ...
}

[関数]

function hoge() {
  "use strict";
  ...
}

「ソースの先頭」に記述すると以下のソースは厳格なコーディングでコードをチェックされます。「関数」に記述した場合はその関数内のみで厳格なコーディングでコードをチェックされます。

この「use strict」を宣言するとJavaScriptは「strictモード」(厳格モード)となります。宣言していない場合は「非strictモード」です。この「strictモード」は「ECMAScript 5」以降で使用することが可能です。※ECMAScriptは後述。

strictモードでは、次のような場合に各ブラウザのF12開発者ツールのコンソールにエラーが表示されスクリプトの実行が停止されます。

と、このようにブラウザでエラーチェックをしてくれるようになります。大きな点はこれぐらいですが、詳細は後半のリンク先で確認して下さい。

使い方としてはJavaScriptのライブラリなどの開発中にはstrictモードで作成して、公開する際には非strictモードにすると良いかも知れませんね。

ECMAScript

ECMAScript(エクマスクリプト)はJavaScriptの標準規格です。「ECMAScript 5」は2009年12月に公開されて、IE10、IE11、Edge、Chrome、FireFox、Safari6などのモダンブラウザで使用できます。

最新版は2015年6月17日に公開された「ECMAScript 6」です。この「ECMAScript 6」は実際に使用され始めるのは2,3年後になると思います。

※モダンブラウザは現代的なブラウザ。レガシーブラウザはIE8以下の過去の遺物のブラウザの事です。

HTML文法チェッカー

HTMLの文法チェッカーは「Crescent Eve」を使用すると良いと思います。

リンク

Strict モード (FireFoxのMDN)
厳格モード (Microsoft)

• Twitter
• Facebook
• はてブ

• Pocket
• LINE

関連記事