勉強したことのメモ

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にて正規表現を用いずに文字列の一括置換を行う方法

文字列の一括置換を行う際、PHPだとstr_replaceで問題無く対応できるが ...

国土地理院のAPIを使用して無料でジオコーディング(住所→経度緯度)を行う方法

GoogleMapAPIでジオコーディングをするには、支払い情報を登録したアカウ ...

formのpasswordとtextをjQueryで切り替える方法

formでtype="password"を指定していると内容を入力した際に「●● ...

Leafletで「leaflet-search」プラグインを導入してマーカーの検索機能を追加する方法

LeafletとOpenStreetMapでマップ上にマーカーを複数設置した上で ...

Leafletにタグフィルター機能を実装できる「leaflet-tag-filter-button」プラグインの利用方法

以前にLeafletでマーカーをグループ化し、チェックボックスの状態により表示非 ...