デバッグ出力を表示する

JavaScript:
デバッグ出力を表示する

How to: (方法)

JavaScriptにおいては、console.log()がもっとも一般的なデバッグ手段だ。簡単に使えて、わかりやすい。

let number = 2;
console.log('The number is:', number);
// 出力: The number is: 2

function multiply(a, b) {
    console.log(`Entering multiply: a=${a}, b=${b}`);
    let result = a * b;
    console.log(`Result of ${a} * ${b} is ${result}`);
    return result;
}

multiply(3, 4);
// 出力: Entering multiply: a=3, b=4
// 出力: Result of 3 * 4 is 12

Deep Dive (深掘り)

歴史的に見ると、初期のプログラマはプリントステートメントを使ったり、ランプやパンチカードを読むことでデバッグを行なっていた。JavaScriptではconsole.log()以外にもconsole.error(), console.warn(), console.info()といった方法があり、状況に合わせて使い分けることができる。

ブラウザの開発者ツール内のコンソールでは、これらの出力に異なる色やアイコンが使われ、エラーや警告などを瞬時に識別できるようになっている。実際の開発で大量のデバッグ出力が必要なくなった場合は、console.clear()を使用してコンソールの出力をクリアできる。また、条件付きでデバッグ出力を表示させたい場合はconsole.assert()が便利だ。

console.error('This is an error message');
console.warn('This is a warning');

console.log()は便利だが、極力プロダクションコードからは削除するのが無難。デバッグのための出力がユーザーに見えることは、専門家でない人には混乱を招く可能性があるからだ。

See Also (参照)

これらのリンクでは、JavaScriptのコンソールAPIに関する詳細な情報や、デバッグのテクニックについて学ぶことができる。