勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

JavaScriptでデバッグ時にconsole.log以外のメソッドを利用する方法

  JavaScript

JavaScriptでデバッグ時は基本的にconsole.logを使って配列やオブジェクトの中身を見てどうこうする、という対応を取っていたがconsoleオブジェクトにはlog以外にも便利なメソッドがあるらしい。以下に実運用上使えそうなメソッドと出力例をメモ。

 

リファレンス

https://developer.mozilla.org/ja/docs/Web/API/console

 

使えそうなメソッド

ソースコード

const log = 'log';
const obj = {
    name : '鈴木',
    age : 20
}

console.log(log);
console.info(log);
console.warn(log);
console.error(log);
console.table(obj);

console.time();
for( let i = 0; i < 1000000000; i++ ){

}
console.timeEnd();

出力例

上記ソースコードだと以下が出力される。

解説

「info / worn / error」はログレベル分けみたいなもの。

「table」は配列やオブジェクトをtableタグっぽく表示してくれる。

「time / timeEnd」は実行速度を測定できる。

 

所感

log以外のメソッドを使ったソースコードってあんまり見たことない気がする。せっかく知れたので今後は適宜使用していきたいところ。

 - JavaScript

  関連記事

バニラJavaScriptで同サーバ内のCSVを読み込み、配列として取り扱う方法
バニラJavaScriptで同サーバ内のCSVを読み込み、配列として取り扱う方法

サーバ内のCSVファイルを読み込み、そのデータをサイト上で取り扱いたい。通常だと ...

Video.jsでテーマを指定して動画プレイヤーのデザインを変更する方法
Video.jsでテーマを指定して動画プレイヤーのデザインを変更する方法

Video.jsで動画プレイヤーのデザインを変更したい。調べたところWordPr ...

AjaxのJSONP使用でPHPで作った配列をJSに返す方法
AjaxのJSONP使用でPHPで作った配列をJSに返す方法

AというサイトからBというサイトにAjax通信し、Bの方ではMySQLに接続して ...

summernote(WYSIWYGエディタ)の設置方法と日本語化対応
summernote(WYSIWYGエディタ)の設置方法と日本語化対応

あるシステムにWYSIWYGエディタを実装したかった。以前にメモしたCKEdit ...

JavaScriptにて時間や長さの単位を変換及び計算できる「mathjs」ライブラリの利用方法
JavaScriptにて時間や長さの単位を変換及び計算できる「mathjs」ライブラリの利用方法

JavaScriptにて時間の単位を「分->時」に、長さの単位を「mm-& ...