JavaScript の編集
version 6.1 以降の NetBeans IDE では、Java、Ruby、およびその他の言語ですでに提供されているサポートに基づいた、改良版の JavaScript 編集機能を提供しています。このガイドで、それらの機能の概要を説明します。
目次
チュートリアルに必要なソフトウェア
このチュートリアルに従うには、次のソフトウェアとリソースが必要です。
この節では、IDE の基本的な JavaScript 編集機能について説明します。
新しいファイルの作成
「新規ファイル」ウィザードを使用して、任意のプロジェクトに新しい JavaScript ファイルを作成できます。ウィザードを開くには、「新規」>「その他」をクリックします。ウィザードでは、「その他」カテゴリを開き、「JavaScript ファイル」を選択します。新しい JavaScript ファイルがテンプレートから作成されます。
JavaScript ファイルを「プロジェクトエディタ」で表示するには、src などの、プロジェクト内の適切なサブフォルダに JavaScript ファイルを作成します。
JavaScript のデフォルトのテンプレートには、ライセンス情報だけが含まれます。テンプレートに内容を追加するには、IDE で「ツール」>「テンプレート」を選択し、JavaScript テンプレートを開きます。
構文の強調表示
IDE は、メソッドと変数を区別するために、真の意味解釈の強調表示 を提供します。
コード折り畳み
メソッドのコードは折り畳みまたは展開できます。エディタ内でメソッドの横の
「表示」>「コード折り畳み」メニューで、すべてのメソッドを折り畳むか、展開することができます。
ナビゲーション
IDE の「ナビゲータ」タブに JavaScript ファイルの構造が表示されます。ナビゲータでは、プロトタイプスタイルのクラス定義が認識され、メソッドがあるクラスとして表示されます。
バックグラウンドパーサー
パーサーがバックグラウンドで実行され、詳細なエラーメッセージが表示されます。
括弧の一致
閉じ括弧が自動的に入力されます。'、"、[、(、または { を入力すると、対応する終了記号が挿入されます。終了記号を入力すると、挿入された記号が上書きされます。Backspace キーで開始記号を削除すると、対応する終了記号が削除されます。
整形
改行キーを押すと次の行の位置に従ってキャレットがインデントされます。} キーを押すと行のインデントがすぐに解除されます。選択範囲またはバッファー全体を再整形すると、ファイル全体が再インデントされます。
JSON のサポート
JSON ファイルが JavaScript として処理されます。バックグラウンドパーサーは、関数がないオブジェクトリテラル表現だけが許可されるなど、特殊な JSON モードで実行されます。
メソッド宣言はボールドで表示され (オブジェクトリテラル内のプロトタイプスタイルメソッド宣言を含む)、大域変数は緑で表示され、使用されていない変数はグレーの下線つきで表示されます。
記号の上にキャレットを置くと、同じ変数または呼び出しが使用されているほかの箇所が強調表示されます。また、関数のキーワードの上にキャレットを置くと、そのメソッドからの戻りがすべて強調表示されます (return、throw)。これは、キャレットを return の上に置いた場合も同じです。
局所変数で Ctrl-R キーまたは Command-R キーを押すと、ファイル全体で記号の名前を同期的に変更できます。
製品内で変数または操作を使用している箇所をすべて検索できます。使用状況を検索したら、製品全体で変数または操作が出現するすべての箇所で名前を変更し、リファクタリングを行うことができます。リファクタリングを行う前に、分割画面の UI で変更箇所を確認できます。
変数または操作の使用箇所をすべて検索し、名前を変更するには、次の手順に従います。
エディタで変数または操作の出現箇所を選択します。
「編集」>「使用状況を検索」(Alt-F7) を選択します。コメントやアクティブなコードを検索するオプションがあります。「使用状況」ビューが開き、変数または操作が使用されているすべての箇所がツリー表示されます。
エディタ内でふたたび同じ変数を選択し、「リファクタリング」>「名前を変更」(Ctrl-R または Command-R) を選択します。ダイアログが開くので、新しい名前を入力します。
「プレビュー」をクリックします。「リファクタリング」ビューが開き、左側に変更箇所がツリー表示され、右側の分割画面に元のファイルとリファクタリング後のファイルが表示されます。
変数または操作の名前を変更しない箇所を選択することもできます。左側のツリー表示で個々の項目の選択を解除します。
確認後、「リファクタリングを実行」をクリックすると、すべてのファイルがリファクタリングされます。
IDE は JavaScript コードに多くの意味解釈のチェックを行い、簡易修正を提供します。簡易修正を表示するには、「ソース」>「コードを修正」(Alt-Enter) を選択します。意味解釈チェックには次の処理が含まれます。
パラメータの再代入
匿名関数が値を返さない場合
変数が引数を隠す場合
副次的影響がないコード (呼び出しなし、代入なし)。
条件での代入 (if x = y)。この意味解釈エラーは、== 式への変換、二重括弧の追加など、複数の簡易修正で警告をオフにできます。
関数から戻る方法の不統一 (return 式が値を返す場合と返さない場合があるなど)。
バックグラウンドパーサーと警告の簡易修正はタスクリストに統合されています。ファイル内での JavaScript に関連するエラーを表示するには、タスクリストを開きます (「ウィンドウ」>「タスクリスト」)。リスト内でタスクをダブルクリックすると、該当する行がエディタに表示されます。
JavaScript コード補完では、IDE に組み込まれている JavaScript コアクラスを選択してコードに挿入できます。たとえば、次のように記述したとします。
x = "foo"; y = x; y.
この場合、コード補完によって JavaScript 文字列に使用可能なメソッドが表示されます。コード補完は、JavaScript のすべてのリテラル型に使用できます。型分析とコード補完の機能では、プロトタイプスタイルクラス (通常の関数のみ) とこれらを構築するための新しい演算子も認識されます。
NetBeans IDE では、関数パラメータと戻り値の型 (@type、@param) について型パラメータが参照されます。これらの型はコード補完時に、リスト内、ドキュメント内、およびパラメータヒント内 (Ctrl-P) に表示されます。戻り値の型は、コード補完ダイアログで関数名のあとにコロンで区切って表示されます。
@deprecated でメソッドをマークした場合、ナビゲータと、このメソッドへのコード補完の呼び出しで取り消し線が表示されます。付属する非推奨の記述は、コード補完ドキュメントの別のセクションに背景を強調表示して表示されます。
NetBeans IDE で多数の関数の戻り値の型を判別することもできます。この機能は JSQuery のサポートに不可欠です。たとえば、True または False を返すメソッドにはブール型の戻り値があり、リテラルの数値を返すメソッドには数値型の戻り値があります。IDE は型の推測と、コメントによって宣言される型の明示的な追跡の両方を行います。もっとも重要な意味は、IDE が呼び出しによって型に従うということです。次のようなコードがあるとします。
"foo".big().charCodeAt(50).toExponential(fractionDigits);
NetBeans は、最初に foo が文字列であることを認識し、String クラスで big() メソッドを確認します。この文字列の charCodeAt(50) 関数は数値型であるため、ここにコード補完を適用すると、数値で利用可能なメソッドのみが表示されます。
注: 戻り値の型を検索する際、索引も検索します。これには時間がかかる可能性があるため、型分析の間、IDE は時間を見て、1 秒か 2 秒経過したあと、型の計算中止します。これは関数が巨大な場合、コンピュータが遅い場合、または高速なコンピュータでも作業負荷が重い場合に発生します。
Ctrl キーを押してカーソルをコード行の上に置きます。変数名をクリックします。IDE で変数の型 (そしてターゲット関数) を認識できなかった場合は、プロジェクト内にあるその変数の宣言をすべて含むポップアップメニューが表示されます。
コード補完では、JavaScript のコア API と DOM API の両方の API ドキュメントが表示されます。独自の関数のドキュメントを表示することもできます。Ctrl キーを押しながら呼び出しをポイントしてドキュメントを表示することもできます (ツールチップとして)。
Prototype.js $("...") 関数で、HTML 内の要素 ID のコード補完が機能します。要素 ID のコード補完を表示するには、引用符の中で Ctrl- スペースキーを押します。たとえば、
variable = $("f
| ") を追加して f の直後にカーソル (
| ) を置いて Ctrl- スペースキーを押すと、ドキュメント内で f から始まる HTML 要素 ID がすべて表示されます。
JavaScript でサポートするブラウザを選択できます。選択したブラウザでサポートされていないコード補完オプションは取り消されます。
サポートするブラウザを選択するには、次の手順に従います。
「ツール」>「オプション」/「環境設定」を開きます。
「その他」アイコンをクリックします。複数のタブがあるページが開きます。
「JavaScript」タブを開きます。
ブラウザとバージョンの選択と選択解除を行います。
ドキュメント には、対象の API 要素をサポートするブラウザのアイコンが示されます。
次のコード補完ダイアログで、IDE はいくつかのオプションを取り消し線で表示します。これは、それらのオプションが、選択したブラウザ (Opera のみ) でサポートされていないためです。
JavaScript 編集機能は、RHTML、HTML、および JSP ファイルに埋め込まれた JavaScript に使用できます。
Ctrl-O キーまたは Command-O キーを押してファイル間で任意の関数にジャンプできます。
メソッドに注釈 @private を付けると、そのメソッドにはナビゲータでロックアイコンが表示されます。関数に注釈 @constructor を付けると、その関数はコンストラクタとして表示され (コード補完で "new" キーワードのあとに含められ)、@class と @namespace を使用して関数を明示的に特定のクラスに割り当てることができます。ただし、型アナライザによってこれらの関数が自動的に割り当てられる場合もあります。@ignore とマークされた関数はコード補完に表示されません。ただし、このような関数は索引に含まれ、「宣言へ移動 」に使用できます。
HTML のコード補完には、参照されている JavaScript ファイルのコードだけが含まれます。ファイル
foo.js で関数
foo() を定義し、ファイル
bar.js で関数
bar() を定義しているプロジェクトがあるとします。 ファイル
hello.html に
<script src="bar.js"></script> だけが含まれる場合、
hello.html のコード補完に
bar() 関数だけが表示されます。
NetBeans IDE を使用して Java 以外の言語を編集する方法についての詳細は、次のリソースを参照してください。
nbj2ee
@
netbeans.org
メーリングリスト
アイコンをクリックするとメソッドが折り畳まれます。折り畳まれているメソッドの横の 
アイコンをクリックするとメソッドが展開されます。折り畳まれているコードは省略符号ボックスで表されます。
省略符号ボックスの上にカーソルを置くと、折り畳まれているメソッドが表示されます。
