💻 Claude Code入門 📖 約22分で読めます

Claude Codeでリファクタリングを効率化する

安全なコード改善をAIと一緒に進める方法

クロガイド｜Claude＆Claude Codeを無料で学ぼう

AI基礎からプロンプト術、Claude Codeの使い方まで。知識レッスンとクイズ式トレーニングで、AIスキルを段階的にアップ。ユーザー登録不要、すべて無料で今すぐ始められます。

無料で学習を始めるクロガイドとは？

はじめに ― AIとリファクタリングする時代

リファクタリングは「動作を変えずにコードの内部構造を改善する」作業です。重要ですが時間がかかり、バグを混入するリスクもあります。Claude Codeを活用すれば、安全かつ高速にリファクタリングを進められます。

この記事では、リファクタリングの種類別にClaude Codeへの効果的な指示方法と、実際のBefore/After例を紹介します。

Claude Codeがリファクタリングに適している理由

全体把握: プロジェクト全体のコードを読み取り、影響範囲を分析できる
一括変更: 複数ファイルにまたがる変更を一度に実行できる
パターン認識: コードの重複やアンチパターンを検出できる
テスト連携: リファクタリング後にテストが通ることを確認できる

リファクタリングの種類と指示方法

1. リネーム（名前の改善）

変数名・関数名・クラス名をより意味のある名前に変更します。Claude Codeはプロジェクト内の全参照箇所を検出して一括変更できます。

Before

function proc(d, f) {
  const r = d.filter(x => x.s === 'active');
  const t = r.reduce((a, x) => a + x.p, 0);
  if (f) return t * 0.9;
  return t;
}

Claude Codeへの指示

> この関数の変数名・引数名を意味のある名前に変更して。
> 関数の目的は「アクティブな商品の合計金額を計算し、
> フラグが立っていれば10%割引する」こと。
> プロジェクト内のすべての呼び出し箇所も更新して。

After

function calculateActiveProductsTotal(products, applyDiscount) {
  const activeProducts = products.filter(product => product.status === 'active');
  const totalPrice = activeProducts.reduce((sum, product) => sum + product.price, 0);
  if (applyDiscount) return totalPrice * 0.9;
  return totalPrice;
}

2. 関数の抽出（Extract Function）

長い関数を小さな関数に分割し、各関数が単一の責任を持つようにします。

Before（1つの関数に詰め込まれた処理）

async function handleOrder(orderData) {
  // バリデーション（20行）
  if (!orderData.items || orderData.items.length === 0) {
    throw new Error('カートが空です');
  }
  if (!orderData.shippingAddress) {
    throw new Error('配送先が未入力です');
  }
  // ... さらに10行のバリデーション

  // 在庫確認（15行）
  for (const item of orderData.items) {
    const stock = await getStock(item.id);
    if (stock < item.quantity) {
      throw new Error(`${item.name}の在庫が不足しています`);
    }
  }

  // 金額計算（15行）
  let subtotal = 0;
  for (const item of orderData.items) {
    subtotal += item.price * item.quantity;
  }
  const tax = Math.round(subtotal * 0.1);
  const shipping = subtotal >= 5000 ? 0 : 500;
  const total = subtotal + tax + shipping;

  // 決済処理（10行）
  const payment = await processPayment(total);

  // DB保存（10行）
  const order = await saveOrder({ ...orderData, total, payment });

  // メール送信（5行）
  await sendConfirmationEmail(order);

  return order;
}

Claude Codeへの指示

> handleOrder関数が大きすぎるので分割して。
> 以下の責任ごとに関数を抽出して：
> - バリデーション
> - 在庫確認
> - 金額計算
> - 決済処理
> - 注文保存・通知
> 各関数にはJSDocコメントも付けて。
> 既存のテストが壊れないことを確認して。

After（責任ごとに分割）

async function handleOrder(orderData) {
  validateOrder(orderData);
  await checkInventory(orderData.items);
  const pricing = calculatePricing(orderData.items);
  const payment = await processPayment(pricing.total);
  const order = await saveOrder({ ...orderData, ...pricing, payment });
  await sendConfirmationEmail(order);
  return order;
}

/** 注文データのバリデーション */
function validateOrder(orderData) {
  if (!orderData.items?.length) throw new Error('カートが空です');
  if (!orderData.shippingAddress) throw new Error('配送先が未入力です');
}

/** 全商品の在庫確認 */
async function checkInventory(items) {
  for (const item of items) {
    const stock = await getStock(item.id);
    if (stock < item.quantity) {
      throw new Error(`${item.name}の在庫が不足しています`);
    }
  }
}

/** 小計・税・送料・合計の計算 */
function calculatePricing(items) {
  const subtotal = items.reduce((sum, item) => sum + item.price * item.quantity, 0);
  const tax = Math.round(subtotal * 0.1);
  const shipping = subtotal >= 5000 ? 0 : 500;
  return { subtotal, tax, shipping, total: subtotal + tax + shipping };
}

3. 重複コードの排除（DRY原則）

プロジェクト内で類似したコードが複数箇所にある場合、共通化します。

重複排除の指示例

> プロジェクト内でAPIリクエストのエラーハンドリングが
> 各ファイルにコピペされている。共通のユーティリティ関数に
> 抽出して、全ファイルをその関数を使うように書き換えて。
>
> 具体的には以下のパターンが重複している：
> - try/catchでのHTTPエラー処理
> - リトライロジック（3回まで）
> - エラーログの出力形式

Claude Codeの強み: Claude Codeはプロジェクト全体をスキャンして重複パターンを検出できるため、「重複しているコードを見つけて」と依頼するだけでも効果的です。

4. 条件分岐の簡略化

ネストの深い条件分岐やswitch文を、より読みやすい形に改善します。

Before

function getStatusMessage(status, role, isExpired) {
  if (status === 'active') {
    if (role === 'admin') {
      if (isExpired) {
        return '管理者権限が期限切れです';
      } else {
        return '管理者としてアクティブです';
      }
    } else {
      if (isExpired) {
        return 'アカウントが期限切れです';
      } else {
        return 'アクティブです';
      }
    }
  } else if (status === 'suspended') {
    return 'アカウントが停止されています';
  } else {
    return '不明なステータスです';
  }
}

Claude Codeへの指示

> この関数のネストが深すぎる。早期リターンとルックアップ
> テーブルを使ってフラット化して。可読性を最優先で。

After

const STATUS_MESSAGES = {
  suspended: 'アカウントが停止されています',
  active: {
    admin: { expired: '管理者権限が期限切れです', valid: '管理者としてアクティブです' },
    user:  { expired: 'アカウントが期限切れです', valid: 'アクティブです' }
  }
};

function getStatusMessage(status, role, isExpired) {
  if (status === 'suspended') return STATUS_MESSAGES.suspended;
  if (status !== 'active') return '不明なステータスです';

  const roleKey = role === 'admin' ? 'admin' : 'user';
  const expiryKey = isExpired ? 'expired' : 'valid';
  return STATUS_MESSAGES.active[roleKey][expiryKey];
}

安全なリファクタリングの進め方

リファクタリングで最も重要なのは、動作を壊さないことです。Claude Codeと安全にリファクタリングを進めるためのワークフローを紹介します。

安全なリファクタリングの5ステップ

テスト確認: 「まず既存のテストをすべて実行して、全部通ることを確認して」
影響分析: 「この関数/クラスを変更した場合の影響範囲を分析して」
段階的変更: 「一度にすべて変えるのではなく、1つずつ変更して、その都度テストを実行して」
テスト再実行: 「変更後にテストを実行して、何も壊れていないことを確認して」
コミット: 「リファクタリングの種類ごとにコミットを分けて」

段階的リファクタリングの会話例

> UserService.tsをリファクタリングしたい。
> ただし安全に進めたいので、以下の手順で：
> 1. まず現在のテストを実行して状態確認
> 2. 変更箇所の影響範囲を分析して報告
> 3. 小さな変更を1つずつ適用
> 4. 各変更後にテスト実行
> まずステップ1をやって。

Claude Code:
テストを実行します...

$ npm test -- --testPathPattern=UserService

Tests: 12 passed, 0 failed
すべてのテストが通っています。

次に影響範囲を分析します。UserService.tsは
以下の8ファイルから参照されています：
[分析結果表示]

ステップ3に進みましょうか？

リファクタリングのアンチパターン

アンチパターン	問題点	正しいアプローチ
一度に大量変更	問題発生時に原因特定が困難	小さな変更を1つずつ適用
テストなしで変更	動作が壊れたことに気づけない	テストを先に書く or 確認する
機能追加と同時	変更の目的が混在する	リファクタリングと機能追加は別コミット
設計変更と混同	スコープが際限なく広がる	まず構造改善、設計変更は別タスクに

Claude Codeにコードレビューを依頼する

リファクタリング前に、Claude Codeにコードの品質をレビューしてもらい、改善点を特定することもできます。

コードレビュー依頼の例

> src/services/ ディレクトリ内のコードをレビューして。
> 以下の観点で改善点を一覧にして：
> - 命名の改善余地
> - 複雑すぎる関数（行数20行以上）
> - 重複コード
> - エラーハンドリングの不備
> - TypeScriptの型定義の改善余地
> 重要度（高/中/低）も付けて。