＜JavaScript＞console.logを使った関数の意義

console.logを使った関数の意義

コンソールに表示する機能であるconsole.log。

私が読んでいる書籍では、練習問題で頻繁にconsole.logが出てくる。

関数の練習に入っていたり、オブジェクトの練習で出てきたり。

console.logはプログラム中の変数の値を確認するものと認識していたので、ここで使うの？どういうこと？と脳内「？？？」だらけ。
（おそらく慣れている人は疑問に思わないことなのだと思う。）

例えば、オブジェクトのコード記載の時、

const person = {
 name:"John",
 age:17,
 greet:function(){console.log("こんにちは");}
}

こんな感じにconsole.logが出てくると、

”console.logは、「こんにちは」という言葉に何か特別な役割を与えるのではないか”

と勘違いしてしまうのだ。

ただ実際は、

”コンソールに「こんにちは」を表示しますよ”　

の関数が作ってあるだけのこと。

実務などをしたことがなく、まだ見るがまま学習する入門レベルの私にとっては、混乱する落とし穴だった。

---

console.logまとめ

最後にconsole.logの役割をまとめる。

・基本的な役割

情報をコンソールに出力するもの。デバッグや動作確認に利用。

・主な用途

　1.数値や値の内容を表示

const a = 10;
console.log(a); //コンソールに10と表示　

　2.関数やオブジェクトの状態を確認
　　複雑なオブジェクトや関数の返り値などを表示。

const person = { name: "John", age: 17 };
console.log(person); // オブジェクトの内容を表示

　3.計算結果や処理の結果を表示

let a = 5;
let b = 3;
console.log(a + b); // コンソールに「8」と表示

　4.コードの実行状況を確認
　　処理がどこまで進んでいるか、又は特定の条件が満たされているかを
　　調べるために使用

console.log("実行されました");

・特徴

　1.コンソールに表示するだけ
　　出力内容は画面に表示されるが、プログラムの実行には影響しない　　　
　　つまり、console.log() を削除しても処理結果は変わらない。
　　開発者ツールでしか見られない。通常のHTMLなどの画面には表示され
　　ない。
　
    2.戻り値を返さない
　　戻り値は常にundefind

let result = console.log("Hello"); // "Hello" を表示
console.log(result); // undefined

　3.デバッグ用ツール
　　主にプログラムの動作確認やデバッグのために使われるので、本番環境
　　（実際にユーザーが使う場面）では表示されないようにするのが一般的。
　
    4.パフォーマンスの悪化リスク
　　大量のログを出力することにより、ブラウザの動作が遅くなることがある。