JavaScript - バグをなくせ(デバッグとカスタムコンソールの作成)

Head First JavaScript
頭とからだで覚えるJavaScriptの基本
(オライリージャパン)
Michael Morrison (著) 豊福 剛 (翻訳)

開発環境

• OS X Mavericks - Apple(OS)
• Emacs (CUI)、BBEdit - Bare Bones Software, Inc. (GUI) (Text Editor)
• Safari、Firefox + Firebug (Webプラウザ、プラグイン)
• JavaScript (プログラミング言語)
• jQuery (JavaScript Library)

Head First JavaScript ―頭とからだで覚えるJavaScriptの基本( Michael Morrison (著), 豊福 剛 (翻訳)、オライリージャパン)の11章(バグをなくせ)、JavaScriptマグネット(p.519)を解いてみる。

その他参考書籍

• JavaScript 第6版
• JavaScriptリファレンス 第6版
• JavaScriptクックブック
• jQueryクックブック

JavaScriptマグネット(p.519)

コード(BBEdit)

sample.js

var DebugConsole = function () {
        var console_elem = document.createElement('div'),
            div = document.getElementById('d0');
        this.shaded = false;
        
        console_elem.id = 'debug';
        console_elem.style.fontFamily = 'monospace';
        console_elem.style.color = '#333333';
        div.appendChild(console_elem);
        console_elem.appendChild(document.createElement('hr'));
    },
    dc = new DebugConsole(),
    i;

DebugConsole.prototype.displayMsg = function (msg) {
    var msg_element = document.createElement('div'),
        console_elem = document.getElementById('debug');
    msg_element.appendChild(document.createTextNode(msg));
    msg_element.style.backgroundColor = this.shaded ? '#EEEEEE' : '#FFFFFF';
    console_elem.appendChild(msg_element);
    this.shaded = ! this.shaded;
};
for (i = 0; i < 5; i += 1) {
    dc.displayMsg("エラー" + (i + 1));
}