型5: AI の出力を読み解く
クラス: 初心者
所要時間: 約25分
前提知識: 型1〜4 完了済み
1. 解説
Claude Code の出力タイプ
AI の返答は大きく4種類ある。それぞれの読み方・使い方を刻め。
① 説明テキスト
この関数は配列を受け取り、各要素を2倍にして返します。
フィルタリングは行わず、元の配列の長さと同じ配列を返します。→ 内容を理解して、意図通りか確認せよ
② コードブロック
```javascript
function doubleAll(arr) {
return arr.map(x => x * 2);
}
```→ そのままコピーして使える。ただし必ず内容を確認せよ
③ ファイル操作の実行ログ
● Read: src/utils.js
● Edit: src/utils.js (lines 12-15 modified)
● Bash: npm test→ AI が何のファイルに何をしたか、ステップごとに追える
④ 確認・提案
この変更を加えてよいですか?
- src/app.js の42行目を修正します
- 新しく src/helpers.js を作成します→ y / n で承認・却下できる
ツール使用の読み方
Claude Code は内部でツールを使う。表示されるログから何が起きたか追跡できる。
● Glob: src/**/*.js ← .jsファイルを全検索
● Read: src/app.js ← ファイルを読み取り
● Grep: "TODO" ← 文字列を検索
● Edit: src/app.js ← ファイルを編集
● Bash: node src/app.js ← コマンドを実行出力の信頼性と検証
AI の出力は必ず検証せよ。
確認すべき3つのポイント:
1. コードが期待する動作をするか実際に実行して確認
2. ファイルの変更内容を diff や Read で確認
3. 「〜すべきです」という提案は採用前に理解する2. 実践
Step 1: ファイル操作ログを観察する
bash
mkdir -p ~/claude-practice/lesson5
cd ~/claude-practice/lesson5
cat > app.js << 'EOF'
const users = [
{ id: 1, name: "Alice", age: 25 },
{ id: 2, name: "Bob", age: 17 },
{ id: 3, name: "Carol", age: 30 },
];
function getAdults(users) {
return users.filter(u => u.age >= 18)
}
console.log(getAdults(users));
EOF
claude以下を入力して、ログを観察:
app.js を読んで、getAdults 関数に JSDoc コメントを追加してください。AI の出力で ● Read: と ● Edit: が表示されることを確認せよ。
Step 2: 変更内容を自分で確認
bash
# AI が変更したファイルを確認
cat app.js変更前後の差分:
bash
git diff # gitリポジトリの場合
# または変更箇所を目視確認Step 3: コードブロックの内容を検証
Claude Code に依頼:
users 配列を年齢順に並び替える sortByAge 関数を追加してください。出力されたコードを読んで:
- 意図通りの実装か?
- エッジケース(空配列、同じ年齢)は考慮されているか?
実際に実行して確認:
bash
node -e "
const {sortByAge} = require('./app');
// 追加された場合
"Step 4: 提案を精査する
app.js 全体を改善するための提案を5つ挙げてください。
ただし、今すぐ実装はしないでください。提案を読んで、自分の判断で「採用する・しない」を選べ。
3. 確認課題(Assignment)
課題 5-1: ツールログの読解
以下を実行して、AI が使ったツールの種類と順序を記録せよ。
このプロジェクトの全 .js ファイルを読んで、
使われている変数名をアルファベット順にリストアップしてください。達成条件: ● Read: ● Glob: などのログを3種類以上確認できること
課題 5-2: 出力の検証
Claude Code に関数を1つ追加させた後、以下を実行して動作確認:
bash
node -e "
const app = require('./app.js');
console.log('テスト結果:', JSON.stringify(app.getAdults(
[{id:1, name:'test', age:17}, {id:2, name:'test2', age:18}]
)));
"達成条件: 期待通りの結果(age:18 のユーザーだけ返る)が確認できること
課題 5-3: 変更の取り消し
AI に何か変更させた後:
先ほどの変更を取り消して、元の状態に戻してください。達成条件: ファイルが変更前の状態に戻ること
