JavaScript IntelliSense

  • [アーティクル]

IntelliSense ではコード入力中に情報が表示されるため、コードの記述が速くなり、エラーも減少します。JavaScript のエディターでクライアント スクリプトを使用すると、IntelliSense では、現在のコンテキストに基づいて使用できるオブジェクト、関数、プロパティ、およびパラメーターを示します。IntelliSense で表示されるポップアップ リストから入力するコードを選択し、コードを完成することができます。

IntelliSense を使用して、次のタスクを簡単に実行できます。

  • メンバー情報を検索する。

  • 言語要素をコードに直接挿入する。

  • コード エディターを離れることなくコンテキストを維持する。

  • XML ドキュメント コメント、および JavaScript IntelliSense の機能拡張の IntelliSense をカスタマイズする。

新しい JavaScript の言語サービスの機能の詳細については、Visual Studio 2012 の新機能を参照してください。

このトピックは、次のセクションで構成されています。

  • IntelliSense のコンテキストの確認

  • IntelliSense の情報の処理

  • JavaScript IntelliSense の機能

  • JavaScript IntelliSense の機能拡張

  • JavaScript 検証

Visual Studio の IntelliSense の機能の詳細については、「IntelliSense の使用方法」を参照してください。

IntelliSense のコンテキストの確認

JavaScript IntelliSense では、現在のスクリプトのコンテキストに関連するすべてのスクリプトに基づいてコードを選択できます。これには、現在のファイル内のスクリプト要素が含まれます。また、スクリプト ファイル参照、アセンブリ スクリプト参照、サービス参照、ページに関連付けられた参照など、作業中のスクリプトから直接的または間接的に参照されるコードもすべて含まれます。

現在のスクリプトのコンテキストは、次の項目に基づいて作成されます:

  • すべてのスクリプトで定義される関数はアクティブなドキュメントにブロック。ファイル名拡張子が .aspx、.ascx、.master、.html、および .htm のファイルでは、インライン スクリプト ブロックがサポートされています。

  • 別のスクリプト ファイルを指定する src の属性のscript の要素。参照先スクリプト ファイルのファイル名拡張子は .js であることが必要です。

  • JavaScript は reference ディレクティブを使用してその参照を他の JavaScript ファイルします。

  • グローバル オブジェクト、IntelliSense の拡張機能、遅延読み込みスクリプト ファイル グループの参照。

  • XML Web サービスへの参照。

  • Web アプリケーションが ASP.NET AJAX アプリケーションの場合は、ScriptManager コントロールおよび ScriptManagerProxy コントロール。

  • AJAX 対応の ASP.NET Web アプリケーションの作業をしている場合は、Microsoft Ajax Library。

    [!メモ]

    IntelliSense は、HTML 要素のイベント ハンドラー属性内のスクリプトや href 属性に定義されたスクリプトではサポートされません。

IntelliSense の情報の処理

JavaScript IntelliSense を提供するには、言語サービス、次の操作を実行します:

  • アクティブ ドキュメント内の参照に基づいており、再帰的にチェックのスクリプトに基づいて、参照ファイルで参照する依存の JavaScript ファイルのリストを作成します。

  • リストを走査し、各ファイルから型情報やその他の関連データを収集します。

  • データを集計して、IntelliSense に型情報やデータを使用できる JavaScript の言語サービスに渡します。

  • ファイルで IntelliSense のリストに影響する可能性がある変更を監視し、必要に応じてリストを更新します。リモート ストアのスクリプトは、(HTTP を使用して参照されるような) 監視するしません。

JavaScript IntelliSense の機能

JavaScript IntelliSense では次のオブジェクトをサポートします:

  • ドキュメント オブジェクト モデル (DOM: Document Object Model) 要素

  • 組み込みオブジェクト

  • ユーザー定義の変数、関数、およびオブジェクト

  • スクリプト参照、参照ディレクティブと 参照グループなどの参照を使用して外部ファイルで定義されているオブジェクト。

  • パラメーターやフィールドなどの [XML ドキュメントのコメント]で、指定されたオブジェクト。

  • 標準的な JavaScript のコメントでタグを使用して記述するオブジェクト (//)。詳細については、「JavaScript IntelliSense の拡張」を参照してください。

  • JavaScript IntelliSense の機能拡張 機構を使用してサポートされるオブジェクト。詳細については、「JavaScript IntelliSense の拡張」を参照してください。

  • ASP.NET AJAX オブジェクト

IntelliSense がオブジェクトの種類を決定できないときにアクティブ ドキュメント識別子を使用してステートメント入力候補のオプションを提供します。詳細については、「識別子の入力候補」を参照してください。

Bb385682.collapse_all(ja-jp,VS.110).gifHTML DOM 要素

JavaScript IntelliSense は body、formと divなどの HTML (DHTML) の DOM 要素に動的プログラミングの参照を提供します。現在のドキュメントとマスター ページに含まれる要素だけが IntelliSense によって表示されます。JavaScript IntelliSense では、window と document のオブジェクトとメンバーをサポートします。

Bb385682.collapse_all(ja-jp,VS.110).gif組み込みオブジェクト

JavaScript IntelliSense は、組み込みオブジェクト Array、String、Math、Dateと Numberのプログラミングで参照をネイティブに示します。組み込みオブジェクトの詳細については、「組み込みオブジェクト (JavaScript)」を参照してください。

Bb385682.collapse_all(ja-jp,VS.110).gifユーザー定義の変数、関数、およびオブジェクト

JavaScript ファイルを変更すると使用可能なすべてのコード リソースを確認するには、Visual Studio 開かれる、リファレンス ドキュメントで検索します。これには、ユーザーが作成した変数、関数、およびオブジェクトが含まれます。これらのリソースは、JavaScript IntelliSense で利用できます。

ユーザー定義の変数、関数、およびオブジェクトの詳細については、MSDN Web サイトの「Creating Your Own Objects」を参照してください。

Bb385682.collapse_all(ja-jp,VS.110).gif外部ファイル参照

コードの IntelliSense のサポートを実現するために、外部ファイル参照のさまざまな型を含めることができます。外部ファイル参照がスクリプト参照、参照ディレクティブでない可能性もあるので、参照はグループを使用して指定できます。

Bb385682.collapse_all(ja-jp,VS.110).gifスクリプト参照

ページ内にすべてのクライアント スクリプトを記述する代わりに、スクリプト コードを格納した外部ファイルを参照できます。これによって、ページ間でのコードの再利用が容易になり、ブラウザーでクライアント スクリプトをキャッシュできるようになります。

ASP.NET AJAX 対応の Web ページで作業していない場合は、script 要素の開始タグにある src 属性を使用して外部スクリプト ファイルを参照できます。src 属性には、ソース コードまたはデータを格納した外部ファイルへの URL が指定されます。

script タグの src 属性を使用してスクリプト ファイルを参照するマークアップの例を次に示します。

<script type="text/javascript" src="~/Scripts/JavaScript.js">
  
</script>

ASP.NET AJAX 対応の Web ページで作業している場合は、ScriptManager コントロールの ScriptReference オブジェクトを使用してスクリプト ファイルを参照できます。

ScriptManager コントロールの ScriptReference オブジェクトを使用してスクリプト ファイルを参照するマークアップの例を次に示します。

<asp:ScriptManager ID="ScriptManager1" runat="server">
  <Scripts>
    <asp:ScriptReference Path="~/Scripts/JavaScript.js" />
  </Scripts>
</asp:ScriptManager>

IntelliSense では、ASP.NET AJAX Web アプリケーションのアセンブリ内にリソースとして埋め込まれるスクリプト ファイルもサポートされます。埋め込みスクリプト リソースの詳細については、「Embedding a JavaScript File as a Resource in an Assembly」を参照してください。

Bb385682.collapse_all(ja-jp,VS.110).gif参照ディレクティブ

reference ディレクティブを使用すると、現在編集中のスクリプトとその他のスクリプトとの間の関係を Visual Studio で確立できます。reference ディレクティブにより、現在のスクリプト ファイル内のスクリプトのコンテキストにスクリプト ファイルを含めることができます。これにより、コードの入力時に、外部で定義されている関数、型、およびフィールドを IntelliSense で参照できます。

XML コメントの形式で reference のディレクティブを作成します。このディレクティブは、ファイル内で他のいずれのスクリプトよりも前に定義する必要があります。reference ディレクティブには、ディスク ベースのスクリプト参照、アセンブリ ベースのスクリプト参照、サービス ベースのスクリプト参照、またはページ ベースのスクリプト参照を含めることができます。

ディスク ベースの参照ディレクティブを使用する例を次に示します。最初の例では、言語サービスはプロジェクト ファイル (たとえば、.jsproj) を含む同じフォルダー内のファイルを検索します。

/// <reference path="ScriptFile1.js" />

/// <reference path="Scripts/ScriptFile2.js" />

/// <reference path="../ScriptFile3.js" />

/// <reference path="~/Scripts/ScriptFile4.js" />

アセンブリ ベースのスクリプトへの参照を作成する方法の例を次に示します。

/// <reference name "Ajax.js" assembly="System.Web.Extensions, ..." />

サービス ベースのスクリプトへの参照方法の例を次に示します。

/// <reference path="MyService.asmx" />

/// <reference path="Services/MyService.asmx" />

/// <reference path="../MyService.asmx" />

/// <reference path="~/Services/MyService.asmx" />

[!メモ]

JavaScript IntelliSense は、Web アプリケーション プロジェクト (WAP) Web サービス (.asmx) ファイルに含まれるスクリプトではサポートされません。

ページ ベースのスクリプトへの参照方法の例を次に示します。

/// <reference path="Default.aspx" />

/// <reference path="Admin/Default.aspx" />

/// <reference path="../Default.aspx" />

/// <reference path="~/Admin/Default.aspx" />

reference ディレクティブには、次の規則が適用されます。

  • reference XML コメントは、他のいずれのスクリプトよりも前に定義する必要があります。

  • XML コメントの構文を 3 つのスラッシュと共に使用する必要があります。標準のコメントの構文 (2 つのスラッシュ) を使用して作成された参照は無視されます。

  • ディレクティブごとに、1 つのファイルまたは 1 つのリソースだけを指定できます。

  • ページ ベースのスクリプトへの複数の参照は指定できません。

  • ページ参照を指定する場合、これ以外の種類の参照ディレクティブは指定できません。

  • ファイル名には相対パスを使用します。ティルダ演算子 (~) を使用すると、アプリケーション ルートに対する相対パスを指定できます。

  • 絶対パスは無視されます。

  • 参照されるページにある参照ディレクティブは処理されません。つまり、参照ディレクティブは、ページに対して再帰的には解決されません。ページによって直接参照されるスクリプトだけが含まれます。

Bb385682.collapse_all(ja-jp,VS.110).gif参照グループ

IntelliSense 特定の .js ファイルがすべての JavaScript、プロジェクトのスコープ内にあることを指定するために参照グループを使用できます。3 人の参照:グループを使用できます。暗黙の (Windows)、暗黙 (Web)、およびワーカー専用のグループの参照。暗黙的な (Windows) 参照は JavaScript を使用して Windows ストア の apps 用であり、暗黙の (Web) 参照は HTML5 プロジェクト用です。これらの暗黙的な参照変換グループに含まれるファイルがコード エディターで開かれた .js ファイルのスコープ内にあります。

専用のワーカー HTML5 Web 参照はグループのワーカー スレッド用です。このグループに指定したファイルは、専用のワーカー参照グループへの明示的な参照する .js ファイルのスコープ内にあります。暗黙の参照は、専用のワーカー参照グループへの明示的な参照する .js ファイルには適用されません。

JavaScript コード エディターで暗黙の参照を指定できるように構成オプションを使用できます。詳細については、「[オプション]、[テキスト エディター]、[JavaScript]、[IntelliSense]」を参照してください。

ヒントヒント

IntelliSense の参照は、通常、グローバルなオブジェクトと IntelliSense 拡張機能の IntelliSense サポートを提供するために使用されます。スクリプトまたはローダーを使用して、実行時に読み込む必要があるスクリプトでは、この機能を使用できます。

Bb385682.collapse_all(ja-jp,VS.110).gifXML ドキュメントのコメント

XML ドキュメント コメントは、スクリプトに追加される説明テキストです。これらの説明テキストは、IntelliSense には、コメントされたスクリプトを参照すると表示されます。たとえば、関数のパラメーターと戻り値に関する情報を提供します。XML ドキュメント コメントは、参照ファイル、アセンブリ、およびサービスでのみ使用できます。詳細については、「XML ドキュメント コメント (JavaScript)」および「方法: JavaScript XML ドキュメントのコメントを作成する」を参照してください。

IntelliSense では、次のファイル参照が使用されているときに XML コメントのコード参照を表示できます。

  • 別の .js ファイルを参照する .js ファイル。

  • .aspx ファイルを参照する .js ファイル。

  • .js ファイルを参照する .aspx ファイル。

いずれかの .aspx ファイルで別の .aspx ファイルを参照している場合、IntelliSense は使用できません。

Bb385682.collapse_all(ja-jp,VS.110).gifASP.NET AJAX オブジェクト

ASP.NET AJAX も JavaScript IntelliSense をサポートしています。ASP.NET AJAX では、ECMAScript (JavaScript) で使用できる標準の型を拡張するクライアント フレームワークが含まれています。ASP.NET AJAX オブジェクトに関する詳細を提供すると、JavaScript IntelliSense を有効にするには、XML ドキュメント コメントは Microsoft Ajax Library全体に追加されました。これらの XML ドキュメント コメントは ASP.NET AJAX ライブラリに含まれる型およびメンバーを使用すると表示されます。

[!メモ]

プライベート メンバーは JavaScript IntelliSense によって表示されます。プライベート メンバーは、ASP.NET AJAX ではアンダースコア (_) で始まるメンバーとして表されます。

JavaScript IntelliSense の機能拡張

JavaScript の言語サービスは、サードパーティのライブラリを使用する開発者の IntelliSense の機能を変更できる関数とオブジェクトが用意されています。これらの機能は既定の言語サービスが貴社に提供するすべての情報を提供する場合に特に役立ちます。詳細については、「JavaScript IntelliSense の拡張」を参照してください。

JavaScript 検証

検証スクリプトを JavaScript では、Background に連続的に発生します。Visual Studio が JavaScript コードの構文エラーを検出すると、フィードバックは次のように提供されています:

  • エディター内の下線付き要素。赤い波型の下線はエラーを示します。マウス ポインターをエラーの上に置くと、ツールヒントにエラーの説明が表示されます。

  • [エラー一覧] ウィンドウ。[エラー一覧] ウィンドウに、エラーの説明、エラーが発生したファイル、行番号と列番号、およびプロジェクトが表示されます。[エラー一覧] ウィンドウを表示するには、[表示] メニューの [エラー一覧] をクリックします。

  • [出力]ウィンドウに読み込まれていない参照が表示されます。

ページのトップへ

参照

処理手順

方法: JavaScript XML ドキュメントのコメントを作成する

概念

JavaScript IntelliSense の拡張

識別子の入力候補

XML ドキュメント コメント (JavaScript)

その他の技術情報

IntelliSense の使用方法

DHTML オブジェクト モデルについて

List Members

SRC の属性 | src のプロパティ