JavaScript 插件设置优化

JavaScript Plugin Settings Optimizations

本文关键字:优化 设置 插件 JavaScript      更新时间:2023-09-26

我已经完成了一个JavaScript插件,现在专注于优化,但遇到了文件大小问题。我已经多次检查并修剪了所有内容(变量名称、引用等),并优化了我的所有方法。

重量全部在用户设置中。此插件仅适用于仅通过设置进行大量用户自定义...所以包括许多设置。此外,"皮肤"是可用的,只是默认设置对象的变体,如下所示:

//SETUP MAIN PLUGIN DEFAULTS OBJECT
var default:{ 'setting1' : value1, 'setting2' : value2 },
// INIT METHOD
init:function(options){
   var defaults=Plugin.defaults;
        //SETUP SKINS SETTINGS OBJECTS
    switch(options.skin){
           case 2: 
               var defaults={ 'setting1' : value1, 'setting2' : value2};
           break;
           //ETC...
        };
Boxaroo.settings=$.extend({},defaults,options||{});
}

基本上,用户可以传入皮肤编号作为他们的第一个设置 - 加载一组特定的插件默认值 - 可以使用在皮肤编号设置后传入的其他设置覆盖它们。

一切正常,但这意味着我需要为每个案例/皮肤重复用户设置名称......由于有 6 个皮肤,"set1"将重复 6 次(尽管值可能不同)。我很好奇是否有任何方法可以压缩声明这 6 个对象?

不确定是否完全理解,但为什么不像这样声明默认值:

var defaults=Plugin.defaults;
switch(options.skin){
       case 2: 
           defaults.setting1 = value1;
           ...
       break;
       //ETC...
    };

或者再次使用 jQuery extend:

var defaults=Plugin.defaults;
switch(options.skin){
       case 2: 
           $.extend(defaults, {setting1 : value1, ...};
       break;
       //ETC...
    };

您可以使用对象构造函数

function Skin(data) {//use array to keep code short
    this.setting1 = data[0];
    this.setting2 = data[1];
};    
//SETUP MAIN PLUGIN DEFAULTS OBJECT
var default:new Skin([value1,value2]),//if skin object is equal to default
// INIT METHOD
init:function(options){
var defaults=Plugin.defaults;
    //SETUP SKINS SETTINGS OBJECTS
switch(options.skin){
       case 2: 
           var defaults=new Skin([value1,value2]);
       break;
       //ETC...
    };
Boxaroo.settings=$.extend({},defaults,options||{});
}    

或者,如果您在更换皮肤时不需要执行任何其他操作,则可以使用一系列皮肤来删除开关外壳

function Skin(data) {
    this.setting1 = data[0];
    this.setting2 = data[1];
};  
//SETUP MAIN PLUGIN DEFAULTS OBJECT
var default:new Skin([value1,value2]),
var skins:[
        new Skin(["setting1 skin1","setting2 skin1"]),
        new Skin(["setting1 skin2","setting2 skin2"]),
        new Skin(["setting1 skin3","setting2 skin3"])
      ],
// INIT METHOD
init:function(options){
   var defaults=Plugin.defaults;
    //SETUP SKINS SETTINGS OBJECTS
    var defaults=skins[options.skin];
Boxaroo.settings=$.extend({},defaults,options||{});
}    

http://jsfiddle.net/7ffg5/