ライブラリへの抽象化

ステートフルJavaScript4.2.1

by FiNGAHOLiC

HTML

<script src="https://getfirebug.com/firebug-lite-debug.js"></script>
<div id="view"></div>

CSS

#view{
    width:100px;
    height:100px;
    background:#000;
}
#view.over{
    background:#cc0000;
}

JavaScript

(function($, exports){
    var mod = function(){};
    mod.fn = mod.prototype;
    mod.fn.proxy = function(func){
        return $.proxy(func, this);
    };
    mod.fn.load = function(func){
        this.proxy(func)();
    };
    mod.fn.include = function(ob){
        $.extend(this, ob);
    };
    exports.Controller = mod;
}(jQuery, window));

(function($, Controller){
    var mod = new Controller;
    mod.toggleClass = function(e){
        this.view.toggleClass('over', e.data);
    };
    mod.load(function(){
        this.view = $('#view');
        this.view.mouseover(this.proxy(this.toggleClass));
        this.view.mouseout(this.proxy(this.toggleClass));
    });
}(jQuery, Controller));