JavaScript 프로토타입 함수에서 \'this\' 참조를 보존하는 방법은 무엇입니까?

JavaScript 프로토타입 함수에서 'this' 참조를 유지하는 방법

JavaScript에서 프로토타입 함수에서 'this'에 대한 참조를 유지하는 것은 다음과 같습니다. 범위가 변경되면 어려움을 겪습니다. 이 문제를 해결하려면 다음 해결 방법을 고려하십시오.

바인드 방법 사용

바인드 방법을 사용하면 'this' 참조를 유지하는 새 함수를 생성할 수 있습니다. 원래 개체. 사용법:

function.bind(object, argument1, argument2, ...);

예:

MyClass.prototype.myfunc = function() {
  this.element.click(this.myfunc.bind(this));
};

이렇게 하면 클릭 이벤트가 트리거될 때 'this'가 MyClass 인스턴스를 참조하도록 보장됩니다.

'this'에 대한 참조 생성

프로토타입 함수 내에서 'this'에 대한 참조를 생성할 수도 있습니다:

MyClass.prototype.myfunc = function() {
  var myThis = this;
  ...
};

이렇게 하면 'this.myValue'에 액세스할 수 있습니다. 중첩된 함수 내에서. 그러나 각 프로토타입 함수에 대해 이러한 참조를 생성해야 할 수도 있으며 이는 번거로울 수 있습니다.

화살표 함수 사용

화살표 함수는 프로토타입 함수의 'this' 값을 상속합니다. 코드를 단순화할 수 있는 주변 컨텍스트:

MyClass.prototype.doSomething = () => {
  // operate on the element
};

전역 변수 피하기

'this' 참조를 보유하기 위해 전역 변수를 사용하지 마십시오. 이는 전역 네임스페이스를 오염시키므로 여러 개의 MyClass 객체가 존재할 경우 충돌이 발생할 수 있습니다.

jQuery Each의 예

jQuery의 Each 메소드를 사용하려면 바인드 메소드를 사용하여 ' this' 참조:

MyClass.prototype.doSomething = function() {
  this.elements.each(this.doSomething.bind(this));
};

결론

프로토타입 패턴을 사용하는 것은 일반적으로 좋은 습관으로 간주되지만, 올바른 'this' 참조를 유지하는 방법을 이해하는 것은 패턴을 보존하는 데 필수적입니다. 객체 상태와 행동. 바인딩 방법 및 기타 기술은 이러한 문제에 대한 효과적인 솔루션을 제공할 수 있습니다.

위 내용은 JavaScript 프로토타입 함수에서 \'this\' 참조를 보존하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!