기본 지원 없이 ES6에서 클래스 변수를 어떻게 정의할 수 있나요?

ES6 클래스 변수 대안

ES5에서는 클래스 변수가 일반적으로 FrameWork.Class() 패턴을 사용하여 정의되었습니다. 그러나 ES6에서는 클래스 선언이 기본적으로 클래스 변수를 지원하지 않습니다.

왜 생략하나요?

ES6에서 클래스 변수가 없는 것은 의도적인 것입니다. TC39는 클래스 선언과 멤버 정의를 분리하는 것을 목표로 했습니다. 클래스 정의는 클래스의 기능을 정의해야 하는 반면, 멤버(변수와 메서드 모두)는 다른 곳에서 정의해야 합니다.

생성자 대안

클래스 변수를 정의하는 한 가지 옵션은 생성자 내에서 변수를 할당하는 것입니다.

constructor() {
    this.MY_VAR = true;
}

그러나 특히 클래스 매개변수가 많은 경우 생성자가 복잡해질 수 있습니다.

ES7 제안

제안된 ES7 기능인 "속성 초기화 프로그램"은 클래스 선언 및 표현식에서 인스턴스 변수를 정의하기 위한 보다 간결한 구문을 제공합니다.

class MyClass {
    foo = bar;
}

클래스 구성 핸들러

또 다른 접근 방식은 초기화 중에 클래스에 변수를 연결하는 클래스 구성 핸들러를 만드는 것입니다. 예를 들어 WeakMap을 사용하면:

const classConfig = new WeakMap();
class ConfiguredClass {
    constructor() {
        const config = classConfig.get(this.constructor);
        if (config) {
            for (const [key, value] of Object.entries(config)) {
                this[key] = value;
            }
        }
    }
}

class MyConfiguredClass extends ConfiguredClass {}
classConfig.set(MyConfiguredClass, {
    variable: 'string',
    variable2: true
});

Babel 및 TypeScript 지원

Babel과 TypeScript는 모두 클래스 변수 정의를 위한 구문을 제공합니다.

// Babel
class MyClass {
    varName = value;
}

// TypeScript
class MyClass {
    varName: string = value;
}

위 내용은 기본 지원 없이 ES6에서 클래스 변수를 어떻게 정의할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!