📝

GitHub Copilot Labsが最強すぎる

2022/11/11に公開約5,300字

はじめに

修正や追加等はコメントまたはGitHubで編集リクエストをお待ちしております。

クソ便利すぎる機能を発見したので紹介します。

下記のプラグインをインストールしてください。

https://marketplace.visualstudio.com/items?itemName=GitHub.copilot

https://marketplace.visualstudio.com/items?itemName=GitHub.copilot-labs

本題

インストールが完了すると、サイドバーにGitHub Copilotのアイコンが表示されます。
下のBRUSHESをクリックすると、GitHub Copilot Labsの機能が使えるようになります。

早速使ってみる

ここに何の変哲もないクソコードがあります。

TypeScript
export const valueSwap = (x, y) => {
    let tmp;
    if (y < x) {
        tmp = y;
        y = x;
        x = tmp;
    }
    return [x, y];
};

このコードをGitHub Copilot Labsで修正してみます。

使い方は超簡単で、修正したい箇所を選択するだけです。

型を追加

ADD TYPES をクリックすると、型を追加してくれます。

TypeScript
export const valueSwap = (x: number, y: number): [number, number] => {
    if (y < x) {
        const tmp = y;
        y = x;
        x = tmp;
    }
    return [x, y];
};

デバック用のコードを追加

DEBUG をクリックすると、デバック用のコードを追加してくれます。

TypeScript
export const valueSwap = (x: number, y: number): [number, number] => {
    console.log('x: ', x);
    console.log('y: ', y);
    if (y < x) {
        console.log('Swapping values');
        const tmp = y;
        y = x;
        x = tmp;
    }
    console.log('x: ', x);
    console.log('y: ', y);
    return [x, y];
};

コメントを追加

LIST STEPS をクリックすると、コメントを追加してくれます。

TypeScript
/**
 * Swaps the values of two numbers if the second number is less than the first.
 * @param x The first number.
 * @param y The second number.
 * @returns A tuple containing the two numbers in ascending order.
 */
export const valueSwap = (x: number, y: number): [number, number] => {
    // Display the values of the parameters
    console.log('x: ', x);
    console.log('y: ', y);

    // If the second number is less than the first, swap the values
    if (y < x) {
        console.log('Swapping values');
        const tmp = y;
        y = x;
        x = tmp;
    }

    // Display the values of the parameters after the swap
    console.log('x: ', x);
    console.log('y: ', y);

    // Return the two values in ascending order
    return [x, y];
};

どうでしょうか?
あの型もないクソコードが、GitHub Copilot Labsによって生まれ変わりました。
あっ、でもデバックコードは消したいですね。

デバック用のコードを削除

CLEAN をクリックすると、デバック用のコードを削除してくれます。

TypeScript
/**
 * Swaps the values of two numbers if the second number is less than the first.
 * @param x The first number.
 * @param y The second number.
 * @returns A tuple containing the two numbers in ascending order.
 */
export const valueSwap = (x: number, y: number): [number, number] => {
    // If the second number is less than the first, swap the values
    if (y < x) {
        const tmp = y;
        y = x;
        x = tmp;
    }

    // Return the two values in ascending order
    return [x, y];
};

他のコードでもやってみましょう!

バグを修正

このコードにはバグがあります。

TypeScript
export const dayOfWeek = (
    props?: {
        yer?: number;
        mon?: number;
        day?: number;
    },
    timeDifference = 9,
) => {
    const nowTime = now(timeDifference);
    if (props) {
        return new Date(
            props.yer || nowTime.getFullYear(),
            props.mon ? props.mon : nowTime.getMonth(),
            props.day || nowTime.getDate(),
        ).getDay();
    } else {
        return nowTime.getDay();
    }
};

わかりますでしょうか?
うっかりやらかしガチなバグですが、GitHub Copilot Labsによって修正してみましょう。

TypeScript
export const dayOfWeek = (
    props?: {
        yer?: number;
        mon?: number;
        day?: number;
    },
    timeDifference = 9,
) => {
    const nowTime = now(timeDifference);
    if (props) {
        return new Date(
            props.yer || nowTime.getFullYear(),
            props.mon ? props.mon - 1 : nowTime.getMonth(),
            props.day || nowTime.getDate(),
        ).getDay();
    } else {
        return nowTime.getDay();
    }
};

バグが修正されました!
しっかりと月の値から1引いていることがわかります。

その他の機能

コードの切り分け

TypeScript
export const getDay = (props?: {
    yer: number;
    mon: number;
    day: number;
}) => {
    if (props) {
        return new Date(
            props.yer,
            props.mon ? props.mon - 1 : nowTime.getMonth(),
            props.day || nowTime.getDate(),
        ).getDay();
    } else {
        return nowTime.getDay();
    }
};
export const getNowTime = (timeDifference = 9) => {
    return now(timeDifference);
};
export const dayOfWeek = (props?: {
    yer?: number;
    mon?: number;
    day?: number;
}) => {
    const nowTime = getNowTime();
    return getDay(props ? props : nowTime);
};

コードの安全化

TypeScript
export const dayOfWeek = (
    props?: {
        yer?: number;
        mon?: number;
        day?: number;
    },
    timeDifference = 9,
) => {
    const nowTime = now(timeDifference);
    if (props) {
        const time = new Date(
            props.yer || nowTime.getFullYear(),
            props.mon ? props.mon - 1 : nowTime.getMonth(),
            props.day || nowTime.getDate(),
        );
        if (isNaN(time.getTime())) {
            throw new Error('Invalid Date');
        }
        return time.getDay();
    } else {
        return nowTime.getDay();
    }
};

不明な機能

READBLECUSTOM は何をする機能なのかわかりませんでした。

まとめ

かなり賢いので、コードを書くのが楽になります。
あえてバグを入れて修正できるか試したりすると、けっこう楽しいです。
私はコードにコメントを入れるのが苦手なのですが、GitHub Copilot Labsのおかげで、解決しそうです。

GitHubで編集を提案

Discussion

ログインするとコメントできます