Github Copilot Chatの使い方 ​

Copilot Chatとは ​

Copilot (https://github.com/features/copilot/) は、コーディングプロセス中にAI学習に基づいたコーディングの提案を行う、Githubが提供するAIコーディング支援ツールです。多くの場合、コメントや関数名だけで十分であり、Copilotが完全なコードを生成してくれます。

詳細については、How to use Github Copilot and Shortcutsをご覧ください。

Copilot ChatはCopilotに関連しており、Copilotと同じサブスクリプションを共有していますが、同じものではありません。Copilot ChatはVSCodeで使用できるチャットボットです。Copilotとチャットするために使用することができ、Copilotはチャットの内容に基づいてコードの提案を行います。例えば、Copilot Chatに技術的な質問をしたり、コードの作成を支援してもらうためにCopilot Chatに頼むことができます。

Copilot ChatがCopilotと異なる点は、Copilot Chatがチャットボットであるということです。つまり、コードを提示する必要はなく、単にチャットするだけで回答やコードの提案を受けることができます。

プラグインのインストール ​

Copilot Chatを使用するには、プラグインをインストールする必要があります。VSCodeのプラグインメニューでCopilot Chatを検索して、プラグインを見つけてください。プラグインの名前はGithub Copilot Chatで、対応するプラグインマーケットプレイスのアドレスはhttps://marketplace.visualstudio.com/items?itemName=GitHub.copilot-chatです。インストールしてください。

使用方法 ​

VSCodeの左側のサイドバーでChatメニューをクリックして、チャットウィンドウを開きます。その後、Copilot Chatとチャットすることができます。

What's the operator in JavaScript to perform a bit xor?のようなプログラミングに関する質問をCopilot Chatにすることができます。それはIn JavaScript, the bitwise XOR operator is represented by the caret symbol (^)と答え、コードの例とその説明を提供します。プログラミングの知識をクエリする際に非常に便利です。

コードを書く ​

プログラミングの知識以外にも、Copilot Chatにコードの書き方を尋ねることもできます。たとえば、「JavaScriptで2つの数値の合計を計算する関数を書いてください」と尋ねると、以下のような関数のコード例が表示されます：

確かに、以下は2つの数値の合計を計算するシンプルなJavaScriptの関数です：

function sum(a, b) {
    return a + b;
}

この関数は、引数として2つの数値を指定して呼び出すことができます。例えば、sum(5, 3)と呼び出すと、8が返されます。

コード例の上にマウスを置くと、いくつかのアクションボタンが表示されます。コードをコピーしたり、エディタの現在のカーソル位置にコードを挿入したり、新しいファイルにコードを保存したり、コードをターミナルで実行したりすることができます（実行可能なシェルコマンドの場合）。

最も便利なボタンは「挿入」ボタンです。新しく作成されたコードを既存のファイルに挿入したり、このボタンを使用して選択したコードの一部を置き換えたりすることができます。詳細については後ほど詳しく説明します。

もしコード例に満足しない場合は、再度Copilot Chatに話しかけることができます。「入力データの型をチェックし、どちらかが数値でない場合は0を返すようにしてください」といった要求をすると、新しいコード例が表示されます：

以下は、入力データ型をチェックする関数の改訂版です：

function sum(a, b) {
    if (typeof a !== 'number' || typeof b !== 'number') {
        return 0;
    }
    return a + b;
}

このバージョンでは、関数はaまたはbが数値でないかどうかをチェックします。どちらかが数値でない場合、関数は0を返します。それ以外の場合は、aとbの合計を返します。

コードの修正 ​

コードを修正したい場合は、コードを選択してから、VSCodeの左サイドバーにある「Chat」メニューをクリックしてチャットウィンドウを開きます。その後、Copilot Chatとチャットすることができます。選択したコードはコンテキストとしてCopilot Chatに送信され、Copilot Chatはコンテキストとあなたの発言に基づいてコードの提案をします。

例えば、次のようなバグのあるコードがあります：

function sumArr(arr) {
    let sum = 0;
    for (let i in arr) {
        sum += i;
    }
    return sum;
}

この関数は、数値の配列を入力として受け取り、配列内の数値の合計を返します。しかし、このコードにはバグがあり、配列のキーではなく値を読み取ってしまうため、配列のインデックスの合計を返してしまいます。

バグを修正したいので、コードを選択してチャットウィンドウを開き、Please fix the bugと言います。Copilot Chatは、バグを修正するためのコードの例を提供してくれます：

function sumArr(arr) {
    let sum = 0;
    for (let i of arr) {
        sum += i;
    }
    return sum;
}

元のコードでは、for...inループが使用されており、これはオブジェクトの列挙可能なプロパティ、つまり配列のインデックスを反復処理します。バグを修正するためには、代わりにfor...ofループを使用する必要があります。for...ofループは、反復可能なオブジェクトの値、つまり配列の要素を反復処理します。

Copilot Chatがバグを修正してくれましたし、コードの説明もしてくれました。

さらに、同じことをもっと簡単な方法で行うこともできます。コードを選択して`/fix`を入力するか、「`/fix the problems in my code`」をクリックするだけで、Copilot Chatがコードを修正してくれます。

### コードの変換

時には、値のリストを配列やマップなど別の形式に変換する必要があります。例えば、エクセルのテーブルからキーと値のペアのマップをコピーする場合です。

name age John 20 Mary 21 Rose 22 Robert 18 Jane 19

テキストを選択してチャットウィンドウを開き、次のように言ってください。「テキストを配列（JSON）に変換してください。配列の要素は名前と年齢を含む別の配列です。例：[['John', 20]]。結果だけを表示してください。コードや説明は不要です。」すると、Copilot Chatはテキストを配列に変換するコード例を提供します。

以下は、テキストを配列に変換した結果です：

[ ["John", 20], ["Mary", 21], ["Rose", 22], ["Robert", 18], ["Jane", 19] ]

注意：リクエストをできるだけ詳細に説明すると、Copilot Chatが正しい結果を提供できます。例えば、出力が必要ない場合、Copilot Chatはテキストを配列に変換するコード例を提供しますが、それが望んでいるものではありません。

もちろん、Copilot Chatにテキストを他のデータ構造に変換するように依頼することもできます。例えば、マップやオブジェクトのリストなどです。

## 結論

Copilot Chatを使用すると、次のようなことができます。

- テキストをデータ構造に変換する
- コードに型を追加する
- コードを別のプログラミング言語に変換する
- i18nファイルを別の言語に翻訳する
- コードにエラーハンドリングを追加する
- 小さなバグを修正する
- コードをリファクタリングして読みやすくする
- ...

唯一の制限はあなたの想像力と忍耐力です。Copilot Chatは時にはリクエストを理解できないことがあり、間違った結果を返すこともありますが、正しい結果を得るまでリクエストを改善し続けることができます。練習を重ねることで、Copilot Chatは非常に便利なツールであることがわかるでしょう。