layui.js框架的启发

最近做前台设计的MM，应用了layui.js框架，是一个可以按模块加载的js框架，可以实现UI上的一些效果，比如"手风琴折叠"面板。我看了下源码，抽出了其框架，应用到公司的项目中，代码示例如下：

/** search.page-v1.0.0  by wbq/*/
!function (w) {
    "use strict";
    var c = {
        showMessageElement: "#tipMessage",
        waitElement: "#mainload",
    },
     o = function () {

         this.v = "1.0.0";
         this.PostData = {};
         this.KeywordList = [];
         this.filterUrl = "";
         this.listurl = "";
    
     };

    o.prototype.buildPostData = function () {
        var that = this;
        $('[nf-value]').each(function (index, item) {
            if (item.type === "checkbox") {
                that.PostData[item.id] = item.checked;
            }
            else if (item.type === "radio") {
                if (item.checked) {
                    that.PostData[item.name] = item.value;
                }
            } else {
                if (item.id)
                    that.PostData[item.id] = item.value;
            }
        });
        return that.PostData;
    },
    o.prototype.config = function (e) {
        e = e || {};
        for (var t in e) c[t] = e[t];
        return this;
    },
    o.prototype.post = function (url, postData, callback) {
        if (!postData) {
            postData = this.buildPostData();
        }
        var that = this;
        $.ajax({
            url: url,
            type: "POST",
            data: postData,
            cache: false,
            beforeSend: function (XMLHttpRequest) {
                if (c.waitElement)
                    $(c.waitElement).show();
            },
            success: function (result) {
                if (callback != null && typeof callback == 'function')
                    callback(result);
            },
            complete: function () {
                if (c.waitElement)
                    $(c.waitElement).hide();
            },
            error: function (xhr, status, exp) {

                that.ShowMessage(exp);
            }
        });
    },
    o.prototype.get = function (postData, uri, callback) {
        var that = this;
        $.ajax({
            url: uri,
            type: "get",
            cache: false,
            data: postData,
            success: function (result) {
                if (callback != null && typeof callback == 'function')
                    callback(result);
            },
            error: function (xhr, status, exp) {

                that.ShowMessage(exp);
            }
        });
    },

    o.prototype.CheckAll = function () {
        $("input[name='ckImport']").each(function (i) {
            if ($(this).prop("checked")) {
                $(this).prop("checked", false);
            }
            else {
                $(this).prop("checked", true);
            }
        });
    },
    o.prototype.Search = function (keyword) {
    
    };
    w.pageRequest = new o;
  
    w.chooseLetter = function (obj) {
    

    };
    w.chooseKeyword = function (obj) {
   
    };
  
}(window);

此js结构比较简单明了，核心原理：通过立即执行函数，为window对象定义了一个属性pageRequest，它指向名为o的function实例，接下来，我们的注意力就集中到了o的上面。var  o=function(){}这是函数表达式的写法。在函数内部，定义了一些属性。然后在o.prototype,即函数的原型上面定义了一组方法，它们在所有的实例上可以共享。我们还可以在window对象上定义其它方法。比如chooseLetter和chooseKeyword。