[javascript] ES6 클래스에서 정적 상수를 선언 하시겠습니까?

JAVASCRIPT / 글쓴이

코드에서 상수 class를 찾는 것이 합리적이기 때문에에 상수를 구현하고 싶습니다 .

지금까지 정적 메소드를 사용하여 다음 해결 방법을 구현했습니다.

class MyClass {
    static constant1() { return 33; }
    static constant2() { return 2; }
    // ...
}

나는 프로토 타입으로 바이올린을 칠 가능성이 있다는 것을 알고 있지만 많은 사람들이 이것을 반대하는 것이 좋습니다.

ES6 클래스에서 상수를 구현하는 더 좋은 방법이 있습니까?

답변

수행 할 수있는 몇 가지 작업은 다음과 같습니다.

내보내기 const으로부터 모듈 . 사용 사례에 따라 다음을 수행 할 수 있습니다.

export const constant1 = 33;

필요한 경우 모듈에서 가져옵니다. 또는 정적 메소드 아이디어를 기반으로 static get 접근 자를 선언 할 수 있습니다 .

const constant1 = 33,
      constant2 = 2;
class Example {

  static get constant1() {
    return constant1;
  }

  static get constant2() {
    return constant2;
  }
}

그렇게하면 괄호가 필요하지 않습니다.

const one = Example.constant1;

바벨 REPL 예

그런 다음 말했듯이 a class는 함수의 구문 설탕이므로 쓰기 불가능한 속성을 다음과 같이 추가 할 수 있습니다.

class Example {
}
Object.defineProperty(Example, 'constant1', {
    value: 33,
    writable : false,
    enumerable : true,
    configurable : false
});
Example.constant1; // 33
Example.constant1 = 15; // TypeError

다음과 같이 할 수 있다면 좋을 것입니다.

class Example {
    static const constant1 = 33;
}

그러나 불행히도이 클래스 속성 구문 은 ES7 제안에만 있으며 심지어 const속성 에 추가 할 수는 없습니다 .

답변

class Whatever {
    static get MyConst() { return 10; }
}

let a = Whatever.MyConst;

나를 위해 일하는 것 같습니다.

답변

나는 사용하고있다 babel 하고 있으며 다음 구문이 나를 위해 일하고있다 :

class MyClass {
    static constant1 = 33;
    static constant2 = {
       case1: 1,
       case2: 2,
    };
    // ...
}

MyClass.constant1 === 33
MyClass.constant2.case1 === 1

사전 설정이 필요하다는 것을 고려하십시오 "stage-0".
설치하려면 : 

npm install --save-dev babel-preset-stage-0

// in .babelrc
{
    "presets": ["stage-0"]
}

최신 정보:

현재 사용 stage-3

답변

이 문서 에서는 다음과 같이 설명 합니다.

프로토 타입 데이터 속성 (메소드 이외의) 클래스 속성 또는 인스턴스 속성을 정의하기위한 (의도적으로) 직접적인 선언적 방법은 없습니다

이것은 의도적으로 이와 같다는 것을 의미합니다.

생성자에서 변수를 정의 할 수 있습니까?

constructor(){
    this.key = value
}

답변

사용하는 것도 가능하다 Object.freeze불변하게 할 수 클래스 (ES6) / 생성자 함수 (ES5) 객체 :

class MyConstants {}
MyConstants.staticValue = 3;
MyConstants.staticMethod = function() {
  return 4;
}
Object.freeze(MyConstants);
// after the freeze, any attempts of altering the MyConstants class will have no result
// (either trying to alter, add or delete a property)
MyConstants.staticValue === 3; // true
MyConstants.staticValue = 55; // will have no effect
MyConstants.staticValue === 3; // true

MyConstants.otherStaticValue = "other" // will have no effect
MyConstants.otherStaticValue === undefined // true

delete MyConstants.staticMethod // false
typeof(MyConstants.staticMethod) === "function" // true

클래스를 변경하려고하면 소프트 실패가 발생합니다 (오류가 발생하지 않으며 단순히 효과가 없습니다).

답변

어쩌면 모든 상수를 얼어 붙은 물체에 넣었습니까?

class MyClass {

    constructor() {
        this.constants = Object.freeze({
            constant1: 33,
            constant2: 2,
        });
    }

    static get constant1() {
        return this.constants.constant1;
    }

    doThisAndThat() {
        //...
        let value = this.constants.constant2;
        //...
    }
}

답변

마찬가지로 https://stackoverflow.com/users/2784136/rodrigo-botti는 말했다, 당신이 찾고있는 생각합니다 Object.freeze(). 불변의 스태틱이있는 클래스의 예는 다음과 같습니다.

class User {
  constructor(username, age) {
    if (age < User.minimumAge) {
      throw new Error('You are too young to be here!');
    }
    this.username = username;
    this.age = age;
    this.state = 'active';
  }
}

User.minimumAge = 16;
User.validStates = ['active', 'inactive', 'archived'];

deepFreeze(User);

function deepFreeze(value) {
  if (typeof value === 'object' && value !== null) {
    Object.freeze(value);
    Object.getOwnPropertyNames(value).forEach(property => {
      deepFreeze(value[property]);
    });
  }
  return value;
}