Firebugを使って変数の中身を簡単に確認する方法

jQuery Javascript
  • 結論
console.log(変数名);
  • おまけ

最近、JavaScriptの勉強を始めました。


JSを勉強していて困ったのが変数の確認方法。

PHPならvar_dump()という変数情報を表示してくれる便利な関数があるのですが、JSの場合はこのような関数が見つからず、ずっとalert()を使って変数の確認を行っていました。
ただ、alert()の場合、毎回ダイアログボックスが表示されてしまうため、ちょっとした確認もかなり時間がかかってしまいます。

何か良い方法ないかなーと思っていたところ、

console.log(変数名);

というものを発見しました。

これを使うとFirebugのコンソール画面で簡単に変数の情報が表示されます。

  • サンプル：
var test = {"a":1, "b":2, "c":3};
alert(test);
console.log(test);

このようなコードがあった場合に、

alert()だと

[object Object]

しか表示されませんが、

console.log()を用いると、Firebugのコンソール画面に

window > Object
a   1
b   2
c   3

と変数の中身が表示されます。

これは便利。
今後はalert()の出番が少なくなりそうです。