이벤트 응답 function_javascript 기술에 매개변수를 전달하는 네 가지 방법 요약

이벤트 핸들러에 매개변수를 전달하는 방법은 무엇입니까? 처음 Javascript를 접했을 때 클로저에 대한 깊은 이해가 없었기 때문에 이 문제로 종종 어려움을 겪었습니다.

토론방에서 이런 문제가 자주 발생합니다.

코드 복사 코드는 다음과 같습니다.

나를 클릭하세요

매개변수 v1 및 v2를 핸들러에 전달하는 방법은 무엇입니까? 기본 이벤트 객체는 핸들러의 첫 번째 매개변수로 전달됩니다. 링크를 클릭하면 가장 먼저 나타나는 것은 이벤트 객체이고 두 번째 것은 정의되지 않습니다.
옵션 1, 예약되지 않은 이벤트 객체가 첫 번째 매개변수로 전달됩니다

코드 복사 코드는 다음과 같습니다.

함수 핸들러(arg1,arg2){
경보(arg1);
경보(arg2);
}
E.on(document.getElementById('aa) '),' click',function(){
handler(arg1,arg2);
});

옵션 2, 이벤트 객체를 첫 번째 매개변수로 유지

코드 복사 코드는 다음과 같습니다.

함수 핸들러(e,arg1,arg2){
경고(e);
경고(arg1);
경고(arg2);
}
E.on(document.getElementById('aa'),'click',function(e) {
handler(e ,arg1,arg2);
});

옵션 3, getCallback을 Function.prototype에 추가하고 이벤트 객체를 유지하지 않음

코드 복사 코드는 다음과 같습니다.

Function.prototype.getCallback = function(){
var _this = this, args = 인수;
반환 함수(e) {
        return _this.apply(this || window, args);
    };
}
E.on(document .getElementById('aa'),'click',handler .getCallback(v1,v2));

옵션 4, getCallback을 Function.prototype에 추가하고 이벤트 객체를 유지하고 다음과 같이 전달합니다. 첫 번째 매개변수

코드 복사 코드는 다음과 같습니다.

Function.prototype.getCallback = function(){
var _this = this, args = [];
for(var i=0,l=arguments.length;i args[i 1] = 인수 [i];
}
return function(e) {
args[0] = e;
return _this.apply(this || window, args);
};
}
E.on(document.getElementById('aa'), 'click',handler.getCallback(v1,v2));