jQuery事件綁定到單個處理程序

我遇到過單個處理程序有助於簡化項目的情況。這是否對性能有任何影響？特別是當鼠標移動事件被調用時，條件太多會對性能產生影響？jQuery事件綁定到單個處理程序

var myHandler = function(e){ 
    if (e.type == 'mousemove'){ 

    } else if (e.type == 'mouseover'){ 

    } else if (e.type == 'mouseout'){ 

    } else if (e.type == 'mousedown'){ 

    } else if (e.type == 'mouseup'){ 

    }   
}; 

$('#Element').bind('mouseover mouseout mousedown mouseup mousemove', myHandler);

來源

2011-12-28 user1106995

如果您確實需要處理所有這些事件，你爲了通過頻率的if-else語句，該事件被觸發（因爲你已經有了）有顯着的性能損失，即至多4個短串比較。下面的代碼試圖基準固定大小的10,000,000字符串比較的性能：

$(function(){ 
Function.prototype.benchmark = function(name, times, args){ 

var iteration; 
var start = new Date(); 
for (iteration=0; iteration<times; iteration++) { 
     var result = this.apply(this, args); 
} 

var end = new Date(); 

alert(name + " : " + (end-start)); 
} 
function test(args){ 
    return args[0] == "thisistest"; 
} 
function overhead(args){ 
} 
test.benchmark("string comparison", 10000000,["thisistesT"]); 
//run same without the string comparison 
overhead.benchmark("overhead", 10000000,["thisistesT"]); 
});

由於瀏覽器是不是我的電腦上唯一的應用程序的結果執行之間有所不同，但是，我很少有下的結果在Chrome中爲100ms（請記住，這是爲了10,000,000次迭代）。

無論如何，雖然你的表現不會受到多個事件綁定到單個函數的影響，但我真的懷疑這會簡化你的項目。有許多if-else語句通常被認爲是不好的做法和設計缺陷。

如果你這樣做，這樣你可以在一個功能的常見範圍讓他們共享處理器之間的狀態，你最好有類似：

$(function(){ 
    var elementSelector = "#Element"; 
    var i = 0; //shared 
    var events = { 
    mouseover : function(){alert("mouseOver " + elementSelector + i++);}, 
    mouseout : function(){alert("mouseOut " + elementSelector + i++);} 
    // define the rest of the event handlers... 
    }; 

    var $target = $(elementSelector); 
    for(var k in events){ 
    $target.bind(k, events[k]); 
    } 
});

來源

2011-12-28 05:32:17

還要說明有關業績（加代碼可讀性），switch明顯快於else ifs。

var myHandler = function(e){ 
    switch(e.type){ 
     case 'mousemove': 

      break; 
     case 'mouseover': 

      break; 
     case 'mouseout': 

      break; 
     case 'mousedown': 

      break; 
     case 'mouseup': 

      break; 
    } 
};

更多detials可以tajke看看Performance of if-else, switch or map based conditioning

來源

2016-06-16 21:43:42 tomalec

jQuery事件綁定到單個處理程序

回答

相關問題