JavaScriptにおけるConsoleオブジェクトの扱い方


ccc

東京都内でサラリーマンをしているAI・育児ブロガー、CCCです。 AI(人工知能)と子育てに関する記事を執筆しています。 WebシステムをベースとしたAIを活用することで生活をより便利にする方法を紹介し、育児について衣食住における役立つグッズや情報を配信しています。


JavaScriptにおけるConsoleオブジェクトの扱い方を教えてください。


ccc

JavaScript はクライアント側で実行されるオブジェクト指向型のスクリプト言語です。主にブラウザ上で実行され、ユーザのアクションに応じて動的にWebページの内容を書き換えたり、フォームに入力された内容をチェックしたりといったことがクライアント側で実現できます。また、Ajaxという仕組みを利用することで、Webサーバーとブラウザとの間で非同期通信を行えるので、ページを切り替えることなくページの内容を書き換えることができます。Web系AIとJavaScriptの親和性はピカイチで、AIをWebブラウザから使うためのライブラリが公開されています。


ccc

今回はJavaScriptの使い方として、JavaScriptにおけるConsoleオブジェクトの扱い方をサンプルを用いて解説します。

コンソールにログを出力

コンソールにログを出力するメソッドは次のような種類があります。

console.log("hello"); //通常のログとして出力
console.warn("hello"); //警告メッセージとして出力
console.error("hello"); //エラーメッセージとして出力

複数の値を同時に出力

log()などのメソッドは複数の値を同時に出力できます。

let temp="Hello";
let temp2="World";
console.log(temp, temp2);
//Hello World

ログ出力をグループ化

group()はログ出力をグループ化するメソッドです。

console.group("fruits");
 console.log("apple");
 console.log("lemon");
 console.log("orange");
console.groupEnd();

処理時間を計測

time()は処理時間をカウントするメソッドです。引数には任意のラベル名をつけることができます。

console.time("for");

let cnt=0;
for(let i=0; i<100000; i++){
cnt+i;
}

console.timeEnd("for");
//for: 1.18994140625 ms

コンソールをクリアする

clear()はコンソールをクリアするメソッドです。

console.clear();