javascript - 关于js不同写法重用的问题，求助！！！！！

问题描述

问 题

<div class="box"></div>
<div class="box2"></div>

写法1：

var module = (function(){
    var
        configMap = {},
        stateMap  = {},
        
        clearLocalStorage,
        saveLocalStorage,
        loadLocalStorage,
        bind,
        setJqueryMap,
        initModule
        ;
    
    clearLocalStorage = function(){
    };
    
    saveLocalStorage = function(){
    };
    
    loadLocalStorage = function(){
    };
    
    bind = function(){
        
    };
    
    setJqueryMap = function(){
    
    };
    
    initModule = function(){
    
    };
    
    return { initModule : initModule };
})();

module.initModule($('.box'));
module.initModule($('.box2'));

写法2：

   function AverageClass(){
    
   }
   AverageClass.prototype = {
       constructor : AverageClass,
       
       init : function(){},
       
       something : function(){
       
       }
   
   }; 
    
 var ager =  new AverageClass();
 var ager2 =  new AverageClass();
  
 ager.init($('.box'));
 ager2.init($('.box2'));
 
 

如上两种写法，在操作多个元素的时候，第二种不会有冲突，因为每次都是不同的实例，但是第一种就会冲突，请问有什么好的方法解救第一种写法吗？(也就是让第一种写法里面的模块调用每次也变成不同的实例),大家好，我是楼主，第一种写法我修改了一下，请问创造者模式还是凑效吗？

解决方案

第一种方式可以改用建造者模式
第二种方法是普通的创建类的实例

var module = {
    buildModule: function(el) {        
        var configMap = {};
        var stateMap  = {};
        
        var clearLocalStorage = function() {
        };
        
        var saveLocalStorage = function() {
        };
        
        var loadLocalStorage = function() {
        };
    
        var initModule = function() {
            module.el = el; // 实例属性的例子，不会和其它实例冲突
        };
        
        var module = {
            // 想导出的方法
            clearLocalStorage: clearLocalStorage,
            saveLocalStorage: saveLocalStorage,
            loadLocalStorage: loadLocalStorage,
        };
        
        initModule(); // 如果不需要在别处调用，也可不要 initModule 函数，把代码直接放在这里
        
        return module;
    }
};

var module1 = module.buildModule($('.box'));
var module2 = module.buildModule($('.box2'));

这篇关于javascript - 关于js不同写法重用的问题，求助！！！！！的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！