JavaScript/consoleオブジェクト

JavaScript/consoleオブジェクト

for(var a in console){
    console.log(a);
}

メソッド

単にログ系

log, debug, info, warn, errorの5個。単にコンソールに表示するだけ。メソッドによって表示の際の表示が少し違う。

console.log("hoge");

assert。条件付きの表示。第一引数がfalse評価の場合にエラーっぽく表示される。

console.assert(true, "aa");
console.assert(false, "bb");

インスペクション

dirメソッドはオブジェクトの中身を全部インスペクトして表示してくれる。さらにconsole上で再帰的に潜っていけるので開発中のオブジェクトの挙動を追うのに非常に便利。

console.dir(window);

dirxmlはDOM用のdirと思っていいだろう。DOMの内容を「HTMLタブ」の内容のようにツリー展開してconsoleに表示してくれる。

console.dirxml(document.getElementsByTagName('body'));

表示のグループ化

groupメソッドを使うとconsoleの表示をグループ化して開閉表示した後に開閉することができる。 表示したいオブジェクト(大体においてStringだと思う)を引数にとるとそれ以降のconsoleへの表示がインデントして表示される。

console.group("ぐるーぷ1");

グループ化を終了しインデントを1個引き上げるには、groupEndメソッドを呼び出せばいい

console.groupEnd();

呼び出すと、直近に開始したグループを終了する。

グループは標準で開いた状態で表示されるが最初から閉じたままにしておくにはgroupCollapsedメソッドを使う

console.groupCollapsed("ぐるーぷ1");

パフォーマンスチェック

timeメソッドとtimeEndメソッドはパフォーマンスをチェックするためのストップウォッチ的な使い方ができる

console.time("hoge");
console.log("速度測定中");
console.timeEnd("hoge");

timeメソッドに文字列の引数を与えて実行するとその文字列でtimeEndした時までの経過時間がわかる。

もっと高度で細かいパフォーマンスを知りたい場合はprofileメソッドを使う。

その他

consoleを全部消す

console.clear();

現在時刻

現在時刻を表示する。引数に文字列をとれるのだがなんだか意味がよくわからん。単なるラベルか?

console.timeStamp("hoge");

データを表っぽく表示

console.table(
[
    [1, 2, 3, 4, 5],
    [6, 7, 8, 9, 10] 
]);
 
console.table(
[
    {"aaa" : "えええ", "bbb" : "びびび"},
    {"aaa" : "エエエ", "bbb" : "ビビビ"}
]);

参考サイト

javascript/console_object.txt · 最終更新: 2015-08-28 15:59 by ore