了解如何使用適用於 JavaScript 的程式碼編輯器
在這個 Visual Studio 程式碼編輯器簡介中，我們將探討 Visual Studio 讓撰寫、巡覽和了解程式碼更加輕鬆的一些方式。
提示
如果您尚未安裝 Visual Studio，請前往 Visual Studio 下載頁面免費進行安裝。 如需取得 TypeScript 語言服務的詳細資訊，請參閱 TypeScript 支援。
本文假設您已熟悉 JavaScript 開發。 如果您不熟悉，建議您先瀏覽教學課程 (例如建立 Node.js 和 Express 應用程式)。
新增專案檔
您可以使用 IDE 將新檔案新增至您的專案。
當您的專案在 Visual Studio 中開啟時，以滑鼠右鍵按一下 [方案總管] (右窗格) 中的資料夾或專案節點，然後選擇 [新增]>[新增項目]。
如果您沒有看到所有項目範本，請選擇 [顯示所有範本]，然後選擇項目範本。
在 [新增檔案] 對話方塊的 [一般] 類別下，選擇您要新增的檔案類型 (例如 [JavaScript 檔案])，然後選擇 [開啟]。
這會將新檔案新增至您的專案，並在編輯器中開啟該檔案。
使用 IntelliSense 自動完成文字
IntelliSense 是您撰寫程式碼時的重要資源。 它可以顯示類型可用成員的相關資訊，或方法之不同多載的參數詳細資料。 在下列程式碼中，當您鍵入 Router() 時，您會看到可傳遞的引數類型。 這稱為簽章說明。
在您鍵入足夠的字元來釐清文字之後，也可以使用 IntelliSense 自動完成文字。 如果您將游標放在下列程式碼中的 data 字串後面並鍵入 get，IntelliSense 將會顯示稍早在程式碼中定義或在協力廠商程式庫中定義並已新增至專案的函式。
當您將滑鼠停留在程式設計項目時，IntelliSense 也會顯示類型的相關資訊。
語言服務可以使用 TypeScript d.ts 檔案和 JSDoc 註解來提供 IntelliSense 資訊。 若是最常見的 JavaScript 程式庫，則會自動取得 d.ts 檔案。 如需如何取得 IntelliSense 資訊的詳細資料，請參閱 JavaScript IntelliSense。
檢查語法
語言服務使用 ESLint 提供語法檢查和 Lint 檢查。 如果您需要設定編輯器中的語法檢查選項，請選取 [工具]>[選項]>[JavaScript/TypeScript]>[Linting]。 [Linting] 選項會將您導向至全域 ESLint 組態檔。
在下列程式碼中，您會看到運算式上的綠色語法醒目提示 (綠色波浪線)。 將滑鼠停留在語法醒目提示上方。
此訊息的最後一行告訴您：語言服務必須要有逗號 (,)。 綠色波浪線表示警告。 紅色波浪線表示錯誤。
在下方窗格中，您可以按一下 [錯誤清單] 索引標籤來查看警告和描述，以及檔案名稱和行號。
您可以在 "data" 前面新增逗號 (,) 來修正此程式碼。
如需 Lint 分析的其他資訊，請參閱 Lint 分析。
註解化程式碼
工具列是 Visual Studio 功能表列下的按鈕列，有助您提高撰寫程式碼的效率。 例如，您可以切換 IntelliSense 完成模式 (IntelliSense 是程式碼撰寫的輔助工具，可顯示其他項目中符合的方法清單)，增加或減少行的縮排，也可以為不要編譯的程式碼加上註解。 在本節中，我們會為一些程式碼加上註解。
在編輯器中選取一行或多行程式碼，然後選擇工具列上的 [註解選取行] 按鈕 
。 如果您習慣使用鍵盤，請按 Ctrl+K、Ctrl+C。
JavaScript 註解字元 // 會新增至每個選取行的開頭，為程式碼加上註解。
摺疊程式碼區塊
如果您需要整理某些區域的程式碼檢視，您可以將它摺疊。 選擇函式第一行邊緣中其內有減號的小型灰色方塊。 或者，如果您是鍵盤使用者，請將游標放在建構函式程式碼中的任何位置，然後按 Ctrl+M、Ctrl+M。
程式碼區塊只會摺疊到第一行，並且後面接著省略符號 (...)。 若要再次展開程式碼區塊，請按一下現在其內有加號的相同灰色方塊，或再次按 Ctrl+M、Ctrl+M。 這項功能稱為大綱，而且特別適用於摺疊較長的函式或整個類別。
檢視定義
Visual Studio 編輯器讓檢查類型、函式等定義變得十分輕鬆。其中一種方式是巡覽至包含定義的檔案，例如在參考程式設計項目的任何位置選擇 [移至定義]。 不會將焦點移離所處理檔案的較快速方式是使用查看定義。 讓我們查看下列範例中 render 方法的定義。
以滑鼠右鍵按一下 render，然後從操作功能表選擇 [查看定義]。 或者，您也可以按 Alt+F12。
快顯視窗隨即出現，並內含 render 方法的定義。 您可以在快顯視窗內捲動，或甚至查看已查看程式碼中另一種類型的定義。
選擇快顯視窗右上方含 "x" 的小型方塊，以關閉查看的定義視窗。
使用程式碼片段
Visual Studio 提供實用的「程式碼片段」，讓您可以用來快速且輕鬆地產生常用的程式碼區塊。 程式碼片段適用於不同的程式設計語言 (包括 JavaScript)。 請在程式碼檔案中新增 for 迴圈。
將游標放在您想要插入程式碼片段的位置，然後按一下右鍵並選擇 [程式碼片段]>[插入程式碼片段]。
[插入程式碼片段] 方塊隨即出現在編輯器中。 選擇 [一般]，然後按兩下清單中的 [for] 項目。
這會將 for 迴圈程式碼片段新增至您的程式碼：
for (var i = 0; i < length; i++) {
}
您可以選擇 [編輯]>[IntelliSense]>[插入程式碼片段]，然後選擇您語言的資料夾，以查看程式設計語言的可用程式碼片段。