ホームページ - EY-Office

2025-01-28

AIによるコードレビューいいですね

開発を手伝っている会社のワークフローが最近に変更になり、Pull Requestの前にAIによるコードレビューを行うようになりました。 1週間ほど、AIによるコードレビューを使ってみた感想は、レビューで指摘される項目は極めてまともでとても良い印象を受けました。

ソフトウェア開発でAIの利用というとコードの自動生成の部分が注目されていますが、自然言語での仕様伝達は難しいのではと思っています。
しかし、AIはたくさんのオープンソースのコードを学習しています。一般的にオープンソースのコードは質が高いので、集合知からできたAIのコードレビューの効果は高いと思われます。

AI-code-review-is-great Bing Image Creatorが生成した画像を使っています

AIコードレビューの環境

AIコードレビューの出来る環境は、①レビューを行ってくれるAIモデル、②人間が使う開発環境（エディター）などのフロントエンドの2つが必要です。

AIモデルは、今回はClaude-3.5-sonnetを使いましたが、他にはGPT-4oやDeepSeekなどでしょうか？詳しくはネット上にたくさんの記事があるので参考にして下さい。
仕事のコードをレビューする場合はレビューしたコードがAIモデル側で保存されるのか、学習されるのか？等は注意する必要があると思います。

フロントエンドは、CursorなどのAI用エディターや、ClineのようなVS Codeのプラグインなどがあります。このブログではClineで使った結果を書きますが、仕事ではCursorを使っています。CursorはVS CodeのフォークなのでVS Codeユーザーはまったく困りません。

料金は重要ですが複雑です。CursorにはProやBusinessなどの有料プランがあり、これを契約するとAIモデルに課金しなくても一定まで使えます。
また、CursorやClineからAIモデルを使う場合はAPI経由で利用するので、Claude-3.5-sonnetの場合はAPIの使用量に対する課金になるようです。

私はAIモデルの課金に付いては詳しくないですが、現在はCursorはFreeプランで使い、Claude-3.5-sonnetはAPIは、アカウントを作り取りあえず5ドル課金して使っています。無料で試せると書いてある記事もありましたが、私は仕事でも使うのでとりあえず少額を課金しました。
アカウントの作成や重要なAPIキーの作成に付いてはネット記事等を参考にして下さい。CursorやClineの設定画面にはAIモデルの選択・APIキーの登録機能があり、設定すると直ぐに使えます。

コードレビューの例

プログラミング教育で新人が書きそうなコードをレビューしてもらいました。コードは以下のように乱数を使い2つのジャンケンの手を発生してジャンケンの手と勝敗を表示するプログラムです。

const a = Math.floor(Math.random() * 3);
const b = Math.floor(Math.random() * 3);

switch(a) {
  case 0:
    console.log("A: グー");
    break;
  case 1:
    console.log("A: チョキ");
    break;
  case 2:
    console.log("A: パー");
    break;
}

switch(b) {
  case 0:
    console.log("B: グー");
    break;
  case 1:
    console.log("B: チョキ");
    break;
  case 2:
    console.log("B: パー");
    break;
}

if (a == b) {
  console.log("引き分け");
} else if (a == 0 && b == 1) {
  console.log("Aの勝ち");
} else if (a == 1 && b == 2) {
  console.log("Aの勝ち");
} else if (a == 2 && b == 0) {
  console.log("Aの勝ち");
} else {
  console.log("Bの勝ち");
}

これをCline + claude-3-5-sonnet-20241022を使ってレビューした結果は以下のようになりました。

コードレビュー結果:

良い点:

コードが基本的な機能を正しく実装している
switch文を使用して手の表示を整理している
条件分岐で勝敗判定のロジックが実装されている

改善点:

定数とマジックナンバーの扱い:

// 数値を定数として定義することで可読性が向上します
const ROCK = 0;
const SCISSORS = 1;
const PAPER = 2;

手の種類の配列化:

const hands = ['グー', 'チョキ', 'パー'];

関数化による再利用性の向上:

function getHand() {
    return Math.floor(Math.random() * 3);
}

function displayHand(player, hand) {
    console.log(`${player}: ${hands[hand]}`);
}

function judgeWinner(playerA, playerB) {
    if (playerA === playerB) return '引き分け';
    if ((playerA === ROCK && playerB === SCISSORS) ||
        (playerA === SCISSORS && playerB === PAPER) ||
        (playerA === PAPER && playerB === ROCK)) {
        return 'Aの勝ち';
    }
    return 'Bの勝ち';
}

勝敗判定のロジック改善:

現在の実装は個別の条件で判定していますが、じゃんけんのルールをより簡潔に表現できます
配列を使用して勝敗判定を行うことで、コードの量を減らせます

改善後のコード案:

const ROCK = 0;
const SCISSORS = 1;
const PAPER = 2;
const hands = ['グー', 'チョキ', 'パー'];

function getHand() {
    return Math.floor(Math.random() * 3);
}

function displayHand(player, hand) {
    console.log(`${player}: ${hands[hand]}`);
}

function judgeWinner(playerA, playerB) {
    if (playerA === playerB) return '引き分け';
    if ((playerA === ROCK && playerB === SCISSORS) ||
        (playerA === SCISSORS && playerB === PAPER) ||
        (playerA === PAPER && playerB === ROCK)) {
        return 'Aの勝ち';
    }
    return 'Bの勝ち';
}

// ゲームの実行
const playerA = getHand();
const playerB = getHand();

displayHand('A', playerA);
displayHand('B', playerB);
console.log(judgeWinner(playerA, playerB));