デバッグ・ログ出力の各種メソッド
// ── 基本のログ出力 ──────────────────────────────────────
console.log('通常のメッセージ'); // 白色
console.info('情報メッセージ'); // 青いアイコン
console.warn('警告メッセージ'); // 黄色で目立つ
console.error('エラーメッセージ'); // 赤色で目立つ
// ── オブジェクトの確認 ────────────────────────────────
const user = { name: '田中', age: 25, scores: [85, 92] };
console.log(user); // オブジェクトを展開して表示
console.log('%o', user); // 詳細なオブジェクト表示
// ── table: 配列・オブジェクトを表形式で表示 ───────────
const users = [
{ name: '田中', score: 85, grade: 'B' },
{ name: '鈴木', score: 92, grade: 'A' },
];
console.table(users); // ← スプレッドシートのような表形式で表示
// ── time/timeEnd: 処理時間を計測 ─────────────────────
console.time('重い処理'); // 計測開始
const result = heavyCalc();
console.timeEnd('重い処理'); // '重い処理: 123.45ms' と表示
// ── group: ログをグループ化(折りたたみ可能)─────────
console.group('ユーザー情報'); // グループ開始
console.log('名前:', user.name);
console.log('年齢:', user.age);
console.groupEnd(); // グループ終了
// ── count: 何回呼ばれたか数える ──────────────────────
console.count('fetchUser'); // 'fetchUser: 1'
console.count('fetchUser'); // 'fetchUser: 2'console.tableはオブジェクト配列のデバッグに非常に便利。console.time/timeEndで処理時間を計測できる。