ES6 클래스에서 함수를 확장하는 방법: \'this\' 및 클로저 기술 탐색

ES6 클래스로 함수 확장: 'this' 및 클로저 트릭 이해

ES6에서 특수 객체를 확장하면 함수에서 상속이 가능해집니다. 함수로 호출됩니다. 그러나 이러한 호출에 대한 논리를 구현하려면 'this' 참조를 신중하게 고려해야 합니다.

기본적으로 클래스 인스턴스에서 메서드가 호출되면 'this'는 인스턴스 자체를 가리킵니다. 그러나 함수가 직접 호출될 때 'this'는 전역 개체(예: 창)를 참조합니다. 이 문제를 해결하기 위한 두 가지 옵션이 있습니다:

1. 생성자의 데이터 하드코딩:

'super' 호출은 코드 문자열을 예상하여 함수 생성자를 호출할 수 있습니다. 인스턴스 데이터에 액세스하려면 다음과 같이 하드코딩하면 됩니다.

class Smth extends Function {
  constructor(x) {
    super("return " + JSON.stringify(x) + ";");
  }
}

2. 클로저 및 클로저 래퍼:

보다 유연한 솔루션을 위해 인스턴스 데이터를 반환된 함수에 할당하는 클로저를 생성해야 합니다.

class Smth extends Function {
  constructor(x) {
    function smth() { return x; }
    Object.setPrototypeOf(smth, Smth.prototype);
    return smth;
  }
}

이 기능을 추상화하려면 'ExtensibleFunction' 클래스를 도입할 수 있습니다:

class ExtensibleFunction extends Function {
  constructor(f) {
    return Object.setPrototypeOf(f, new.target.prototype);
  }
}

하위 클래스는 ExtensibleFunction에서 상속할 수 있습니다:

class Smth extends ExtensibleFunction {
  constructor(x) {
    super(function() { return x; });
  }
}

화살표 함수나 명명된 함수를 사용하면 대체 접근 방식을 제공할 수도 있습니다. 상속 행위입니다.

위 내용은 ES6 클래스에서 함수를 확장하는 방법: 'this' 및 클로저 기술 탐색의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!