2

Every time I invoke Client2.config.select2() everything is getting redefined.

Is there a way to prevent the re-definition of such an function/object? I.e. if I wanted to have another variable which saves some elements within this object, running Client2.config.select2() would override it.

Is there a well-known pattern to do this?

Client2.config.select2 = function() {

    var coreIDs    =  ['clientID', 'cptyID' , 'sym'];

    var nonCoreIDs =  ['groupBy','groupBy_impact_1','groupBy_impact_2',
        'groupBy_impact_3','groupBy_impact_4'];

    //non dynamic filters 
    var autoCompleteSettings =  function () {
        return {
            allowClear : true,
            minimumInputLength : 2,
            multiple : true,
            placeholder: "Select ",
            closeOnSelect : false,
            openOnEnter : true,
            ajax: {
                url : "../my?page=search",
                dataType : 'json',
                data : function(term, page) {
                    return {
                        q : term
                    };
                },
                results : function(data, page) {
                    return {
                        results : data
                    };
                }
            }
        };
    };

    var multipleSettings = function () {
        return {
            placeholder : "Select ",
            allowClear : true,
            closeOnSelect : false,
            maximumSelectionSize: 6
        };
    };

    return {
        getAutoCompleteSelectSettings: function() {
            return new autoCompleteSettings();
        },
        getMultipleSelectSettings: function() {
            return new multipleSettings();
        },
        getCoreSelect2IDs: function () {
            return coreIDs;
        },
        getNonCoreSelect2IDs: function () {
            return nonCoreIDs;
        },
        getSelect2IDs : function() {
            return coreIDs.concat(nonCoreIDs);
        }
    }
};
4

3 回答 3

3

您应该使用模块模式: http: //www.adequatelygood.com/JavaScript-Module-Pattern-In-Depth.html

这方面的一个例子是:

(function (CkSpace, $, undefined) {
    CkSpace.GetLoanValues = function () { //public member
       //Do Stuff
    }
    var myNumber = 1; //private member

} (window.CkSpace = window.CkSpace || {}, jQuery));
于 2013-09-25T12:34:07.390 回答
2

您可以使用闭包来做到这一点。

本质上,您将设置Client2.config.select2等于立即函数,在立即函数内部定义变量(分配一次),并使用闭包访问返回的函数内部的那些曾经定义的变量。

Client2.config.select2 =  (function() {                              /* 1 */

    var coreIDs    =  ['clientID', 'cptyID' , 'sym'];                /* 2 */

    var nonCoreIDs =  ['groupBy','groupBy_impact_1','groupBy_impact_2',
        'groupBy_impact_3','groupBy_impact_4'];

    //non dynamic filters 
    var autoCompleteSettings =  function () {
        return {
            allowClear : true,
            minimumInputLength : 2,
            multiple : true,
            placeholder: "Select ",
            closeOnSelect : false,
            openOnEnter : true,
            ajax: {
                url : "../my?page=search",
                dataType : 'json',
                data : function(term, page) {
                    return {
                        q : term
                    };
                },
                results : function(data, page) {
                    return {
                        results : data
                    };
                }
            }
        };    
    };    

    var multipleSettings = function () {
        return {
            placeholder : "Select ",
            allowClear : true,
            closeOnSelect : false,
            maximumSelectionSize: 6
        };
    };

    return function (){                                              /* 3 */
        return {
            getAutoCompleteSelectSettings: function() {
                return new autoCompleteSettings();
            },
            getMultipleSelectSettings: function() {
                return new multipleSettings();
            },
            getCoreSelect2IDs: function () {
                return coreIDs;
            },
            getNonCoreSelect2IDs: function () {
                return nonCoreIDs;
            },
            getSelect2IDs : function() {
                return coreIDs.concat(nonCoreIDs);
            }
        }
    }
})();

在 (1) 中,您会看到我们正在像这样包装函数:

(function(){ 
    /* ... */ 
})();

如果您不知道,这称为立即函数,因为它在到达时立即执行。这意味着这个函数运行一次。

在 (2) 中,我们在立即函数的范围内定义了您想要定义的所有变量。同样,使用闭包,您将能够在下面的返回函数中访问这些变量。

在 (3) 中,我们让即时函数返回一个函数,该函数返回您想要返回的对象。例如,当您访问时,getAutoCompleteSelectSettings您将从立即函数内部返回 autoCompleteSettings

基本上你可以这样想。在立即函数运行后,我们定义了这样的赋值(因为这是立即函数返回的内容):

Client2.config.select2 = function (){
    return {
        getAutoCompleteSelectSettings: function() {
            return new autoCompleteSettings();
        },
        getMultipleSelectSettings: function() {
            return new multipleSettings();
        },
        getCoreSelect2IDs: function () {
            return coreIDs;
        },
        getNonCoreSelect2IDs: function () {
            return nonCoreIDs;
        },
        getSelect2IDs : function() {
            return coreIDs.concat(nonCoreIDs);
        }
    }
}

我们在这里访问的每个对象和变量都可以通过立即函数中的引用来访问。

于 2013-09-25T12:59:51.560 回答
0

你试过const关键字吗?

于 2013-09-25T12:34:18.003 回答