- Multi-cursor Editing
- IntelliSense
- Line Actions
- Rename Refactoring
- Formatting
- Code Folding
- Errors and Warnings
- Snippets
- Emmet
- JavaScript Type Checking
※Windows 10、Visual Studio CodeのVersion1.38で確認
Welcomeページの「Interacitve playground」または「Help」→「Interactive playground」で表示される対話型プレイグラウンドではVisual Studio Codeの代表的な機能を試すことができる。
Multi-cursor Editing
マルチカーソルを使うことで複数個所を一気に編集できる。
Ctrl+Shift+Alt+↑/→/↓/←: 矩形選択Shift+Alt: マウスで矩形選択Ctrl+Alt+↑/↓: 上/下にマルチカーソルを追加Alt+Click: マウスでマルチカーソルを追加Ctrl+Shift+L: カーソルがある文字列を全て選択（下の例ではbackground-color）
その他のマルチカーソルのキーボードショートカットはCtrl+K Ctrl+Rで表示されるリファレンスの「Multi-cursor and selection」で確認可能。
IntelliSense
JavaScriptとTypeScriptについてはプレインストールされているが、他の言語については各言語の拡張機能をインストールする必要があるとのこと。
基本的には入力に応じて表示されるが、明示的に表示したい場合は下記。
Ctrl+Space: IntelliSenseの表示
Line Actions
行に対する操作としては下記がある。
Shift+Alt+↑/↓: カーソルがある行を上/下にコピーAlt+↑/↓: カーソルがある行を上/下に移動Ctrl+Shift+K: カーソルがある行を削除Ctrl+/: 選択中の行のコメントアウト/アンコメント
Rename Refactoring
関数名や変数名のリネームはF2または右クリックのコンテクストメニューから可能。リネームはプロジェクト内の全ファイルに対して実行されるとのこと。
F2: シンボルのリネーム
Formatting
ソースコードのフォーマット（コード整形）は下記または右クリックのコンテクストメニューから可能。追加のFormatterは拡張機能からインストールできる。
Shift+Alt+F: ファイル全体のフォーマットCtrl+K Ctrl+F: 選択範囲のフォーマット
Code Folding
ソースコード折り畳み操作としては下記がある。
Ctrl+Shift+[/]: カーソルがある範囲に対してフォールド/アンフォールドCtrl+K Ctrl+0: 全てをフォールドCtrl+K Ctrl+J: 全てをアンフォールド
Errors and Warnings
波線が表示されているエラー、警告はF8で移動できる。
F8: 次のエラー、警告を表示Shift+F8: 前のエラー、警告を表示
Snippets
例えばtryと入力して表示されるtrycatchを選択してTabを押すとスニペットが展開される。
try { } catch (error) { }
各言語のスニペットは拡張機能でインストールする必要があるとのこと。
また、ユーザー定義のスニペットはCtrl+Shift+PのコマンドパレットからConfigure User Snippetsで編集できる。
Emmet
Emmetとは既定形式の入力補完機能によりHTML、XML、XSL等を素早く編集できるテキストエディタ用プラグインのこと。
例えば下記を入力した後で「Edit」→「Emmet: Expand Abbreviation」を選択すると、
ul>li.item$*5
下記に展開できる。
<ul> <li class="item1"></li> <li class="item2"></li> <li class="item3"></li> <li class="item4"></li> <li class="item5"></li> </ul>
なお、Tabキーで展開できるようにするにはemmet.triggerExpansionOnTab設定を有効にする必要がある。
参考：Emmetのチートシート
JavaScript Type Checking
ファイルの先頭に下記コメントを追加することでTypeScriptのタイプチェッカーをJavaScriptコードに対して実行できる。
// @ts-check
ワークスペース全体に適用する場合は`javascript.implicitProjectConfig.checkJs": true設定を有効にすればよいが、詳しくはJavaScript in Visual Studio Codeを参照。
以上のように対話型プレイグラウンドでは代表的な機能を試すことができる。キーボードショートカットは忘れることがあると思うのでその場合は下記でキーボードショートカットを表示できる。
Ctrl+K Ctrl+R: キーボードショットリファレンス
