[caption id=“attachment_267” align=“alignleft”]
‘console’が宣言されていません(IE8)[/caption]
最近のブラウザはほぼすべてデバッグ用の検証機能が付いていて、インクルードされた外部ファイルや適応されたスタイルなどを見れるうえに、JavaScriptやjQueryなどで動的に変更されたHTMLまでもリアルタイムに見ながら動作確認が行えるのでサイト制作がかなり楽になって来ています。
特にJavaScriptでは、consoleオブジェクトが追加されたことで、今までalert()メソッドで処理をいちいち止めながら動作確認していたところを、デバッグ用の出力をすべて裏のブラウザコンソール側に集約させてフロントエンドの処理を止めずに検証できるようになったのはすごく便利です。
このconsoleオブジェクトですが、今までJavaScriptの開発でalert()メソッドを使って来た人には共感してもらえると思うのですが、かなり使い勝手が良いです。すべて裏側で処理されて出力が表に出ないし、プログラムの流れも止まらない、ブラウザの実装にもよりますが配列やオブジェクトの中身まで簡単に一覧化表示できます。私的にもはやJavaScriptのコーディングには必須のオブジェクトになっています。
ただ、使い勝手が良過ぎるところに「落とし穴」もありまして、デバッグコードをそのままJavaScript内に残したままサイトをパブリッシュしてしまう…なんて事も多いです（…私だけ？）。
そしてそのデバッグ用のconsoleオブジェクトがたった一つ残っているだけで、consoleオブジェクトを持っていない古いブラウザでエラーが起こってしまうのです（当たり前ですが…）。
特にIE8のブラウザはやっかいでして、consoleオブジェクトを持つIE9で動作検証している時などが「落とし穴」にはまります。
というのも、IE9で追加された開発者モード（[F12]で起動します）は便利で、IE7やIE8のエミュレーション機能も持っているのですが、本来IE8では実装されていないconsoleオブジェクトに対するエラーをスルーしてしまいます。元々のブラウザであるIE9がconsoleオブジェクトに対応していて、エミュレーション時に内部的にその辺のスイッチングをしないからなのでしょうが、これがデバッグ用のconsoleオブジェクトがJavaScript内に残っていても正常処理されてしまうため、「IE8でも正常に動くJavaScript」としてそのままパブリッシュしてしまうケースがありえます（実際、私がそうでした）。
──で、リリース後に純粋なIE8ユーザーからエラー報告が出るわけです。
でも、自分のIE9のエミュレーション機能ではバグらない…「あれ？なんで？」となるわけですね。
純粋なIE8のエラー内容（"「console」オブジェクトが定義されていない"旨）を伝えてもらえればすぐに気がつけるのですが、ユーザーさんはエラーの詳細なんて確認してくれるのが稀なので、「ここが動かない」「ここでエラーになる」というような断片的な報告が来ます。実際はconsoleオブジェクトの記述があることによって、それ以下に記述してある「一部の機能が動かなくなっている」のですが、こういう場合、原因がなかなか特定できずにかなり困惑することになります。
まぁ、consoleオブジェクトに限らず、デバッグ用の記述をリリースするソースコードに残すな！…というのがセオリーなのですが、後で切り戻すかも、機能追加とかあった時にまたデバッグするかも、とか考えてあえて残してしまうということもあるのではないでしょうか？
そんな時のために、consoleオブジェクトに対応していないブラウザでもエラーにならない実装をしておくと安心です。
さらに、consoleオブジェクトの使い勝手も殺さないように独自関数化していつでも呼べるようにしておきます。
[code lang=“js”] function debug(string, enable_flag){ if(enable_flag){ if(typeof console != ‘undefined’){ console.info(string); }else{ alert(string); } } return true; } [/code] そして、呼び出したい場所で、
[code lang=“js”] debug(“表示したい文字など”, true); [/code] と記述すれば、consoleオブジェクトが有効なブラウザならconsole.info()メソッドが実行され、無効なブラウザならalert()メソッドが実行されてダイアログが表示されます。もしデバッグ機能を一時的に無効化したい場合は第2引数に"false"を指定してあげれば、なにも処理されません。
...