Node.js는 함수 바인딩 기술을 사용하여 이벤트 핸들러의 범위를 변경합니다.
- WBOY원래의
- 2016-05-16 17:57:511367검색
첫 번째이자 가장 일반적인 방법은 이벤트 핸들러와 동일한 이름의 HTML 속성을 지정하여 html 태그에 직접 이벤트를 등록하는 것입니다.
코드 복사 코드는 다음과 같습니다.
function eventHandler() {
alert("현재 범위는 입력 요소 자체입니다.");
}
두 번째 방법은 이벤트 핸들러 속성. 이런 식으로 먼저 요소 객체를 얻습니다.
코드를 복사합니다. 코드는 다음과 같습니다. :
위의 세 가지 방법을 통해 입력 요소에 대한 클릭 이벤트 핸들러를 등록할 때의 한 가지 단점은 이 핸들러(this)의 범위가 항상 입력 개체 내에 있다는 것입니다. 객체지향 프로그래밍에서는 특정 범위에서 이를 명시적으로 지정해야 합니다. 이 범위를 변경하려면 js의 바인딩 기능 기술을 사용해야 합니다.
소위 "바운드 함수"는 특정 환경에서 지정된 매개변수로 다른 함수를 호출할 수 있는 함수를 생성하는 것입니다. 함수를 변수로 전달하면서 함수를 유지하는 데 사용할 수 있습니다. 함수의 범위(또한 이것의 실행 환경). 바인딩 함수의 정의 형태는 다음과 같습니다.
코드 복사 코드는 다음과 같습니다.
function bin( fn,scope) {
return fn.apply(scope||this,arguments)
}
이 바인딩 함수는 첫 번째 매개변수 두 개를 허용합니다. 함수를 실행해야 하며, 두 번째는 특정 실행 환경으로, 주어진 범위에서 주어진 함수를 호출하고 모든 매개변수를 함께 전달하는 함수를 반환합니다. 바인딩 기능 기술과 DOM2 수준 이벤트 핸들러를 사용하면 특정 범위에서 실행되는 요소에 대한 이벤트 핸들러를 등록할 수 있습니다. 구체적인 처리 방법은 다음과 같습니다. return fn.apply(scope||this,arguments)
}
먼저 앞서 정의한 등록 이벤트 방법을 다음과 같이 수정하세요.
코드를 복사하세요 코드는 다음과 같습니다:
function addHandler(obj, type, handler,scope) {
function fn(event) {
var evt = event ? 🎜>evt.target = event.target || event.srcElement;
return handler.apply(scope || this,arguments)
obj.eventHash || //필수사항입니다. 이벤트 핸들러를 등록하는 객체는 이벤트를 저장하는 해시 객체를 정의하고, 이벤트 유형
(obj.eventHash [type] = obj.eventHash [ 유형] || obj.addEventListener(type , fn, false)
} else if (obj.attachEvent) {
obj.attachEvent("on" type, fn)
} else {
obj[" on" 유형] = fn;
}
}
수정된 등록 이벤트 메소드를 사용하면 요소의 이벤트 핸들러가 지정된 환경에서 실행되도록 할 수 있습니다.
function fn(event) {
var evt = event ? 🎜>evt.target = event.target || event.srcElement;
return handler.apply(scope || this,arguments)
obj.eventHash || //필수사항입니다. 이벤트 핸들러를 등록하는 객체는 이벤트를 저장하는 해시 객체를 정의하고, 이벤트 유형
(obj.eventHash [type] = obj.eventHash [ 유형] || obj.addEventListener(type , fn, false)
} else if (obj.attachEvent) {
obj.attachEvent("on" type, fn)
} else {
obj[" on" 유형] = fn;
}
}
수정된 등록 이벤트 메소드를 사용하면 요소의 이벤트 핸들러가 지정된 환경에서 실행되도록 할 수 있습니다.
코드 복사 코드는 다음과 같습니다.