Visual Studio Codeでの基本的な編集方法を学ぶ。

関連リンク

Documentation for Visual Studio Code

Script

テキストの編集やコーディングに使える、VS Codeの便利な操作方法です。

ファイル内の同じテキストを選択したり、カーソルを複数の場所に置いたり、テキストを上下入れ替えることができます。

同じテキストを追加選択する

Mac｜⌘command + D Windows｜Ctrl + D

これは本当に便利です。ベースとなるテキストを選択してから「⌘command + D」を押すたびに、同じテキストが追加で選択されていきます。複数のテキストをまとめて選択して、そのまま編集できます。

ファイル内の同じテキストをすべて選択する

Mac｜⇧shift + ⌘command + L Windows｜Shift + Ctrl + L

さらに、ベースとなるテキストを選択した状態で、同じテキストをすべて選択できます。

カーソルを複数の場所に置く（マルチカーソル）

Mac｜⌥option + クリック Mac｜⌥option + ⌘command + 矢印キー↑↓

Windows｜Alt + クリック Windows｜Alt + Ctrl + 矢印キー↑↓

カーソルを複数の場所に置くことができます。

いくつかの場所に、まとめて同じテキストを追加する時などに使えます。

行単位でテキストを移動する

Mac｜⌥option + 矢印キー↑↓ Windows｜Alt + 矢印キー↑↓

コピペや削除をすることなく、テキストを瞬時に上下入れ替えることができます。

行単位でテキストを複製する

Mac｜⇧shift + ⌥option + 矢印キー↑↓ Windows｜Shift + Alt + 矢印キー↑↓

コピペすることなく、テキストをさくさく複製できます。

さらに実践的な内容へ

まだ他にも便利なショートカットがありますが、これだけでもコードエディタのすばらしさが分かってもらえたかと思います。

さらにもう少しだけ、実践的な内容に踏み込んでいきます。

2つのファイルの差分を確認

2つのファイルの差分を確認することができます。たとえば修正前と修正後のファイルとで、どこが変わったかを確認するときに使います。エクスプローラービューで2つのファイルを、「⇧shiftキー」か「⌘commandキー」を押しながら選択して、右クリックか「⌃Control + クリック」して「選択項目の比較」を選びます。

2つのファイルの差分箇所はこのように表示されます。

検索と置換、正規表現

Mac｜⌘command + F Mac｜⌘command + ⌥option + F

Windows｜Ctrl + F Windows｜Ctrl + Alt + F

「⌘command + F」もしくは「⌘command + ⌥option」で、検索エリアが表示されます。ここからテキストの「検索」と「置換」ができます。

サイドバーの検索ビューで、複数ファイルからまとめて検索や置換もできます。検索はいいのですが、ここから置換を行う場合は、意図していないものが置き換わってしまわないか気をつけましょう。置換する前にバックアップをとっておくと安心です。

検索エリアの「正規表現を使用する」をオンにすると、通常の検索方法では実現できないような「AかつB」や「AかつBで、Cを含まないもの」などで、検索結果を絞り込むことができます。正規表現は、簡単な算数のようなもので、Googleで検索するときにも使えます。