JavaScript 프로토타입 기반 코드를 구성할 때 \'this\' 값을 어떻게 유지합니까?

객체 지향 JavaScript의 코드 구성과 "this" 값

JavaScript 프로토타입 기반 코드를 구성할 때 공통적인 문제는 다음과 같습니다. 객체 참조와 상속을 보존합니다. next(), prev() 및 binControls()와 같은 다양한 기능을 가진 Carousel 클래스가 있다고 가정해 보겠습니다. 코드 구성을 강화하려면 이러한 기능을 다음과 같이 제어 속성 아래에 그룹화하려고 합니다.

Carousel.prototype.controls = {
   next: function () { ... } , 
   prev: function() { ... },
   bindControls: function () { .. }
};

그러나 이 접근 방식은 개체 속성 및 메서드에 액세스하는 데 중요한 "this" 값을 방해합니다. 원래 컨텍스트에서 "this" 값을 유지하려면 다음 해결 방법을 채택할 수 있습니다.

Controls 생성자 내에서 제어 가능한 개체에 대한 참조를 유지하는 Controls 클래스를 만듭니다. next()와 같은 작업을 처리하는 컨트롤의 메서드는 참조를 사용하여 제어 가능한 개체에서 적절한 메서드를 호출합니다.

var Controls = function (controllable_object) {
    this.ref = controllable_object;
};
Controls.prototype.next = function () {
    this.ref.foo();
}
// ..

var Carousel = function () {
    this.controls = new Controls(this);
};
// ..

이를 통해 상속이 보장되고 다음을 통해 컨트롤 구현을 재정의할 수 있습니다. 의존성 주입과 같은 메커니즘.

위 내용은 JavaScript 프로토타입 기반 코드를 구성할 때 \'this\' 값을 어떻게 유지합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!