답변.

문맥:

Static 속성과 메소드는 ES6부터 JavaScript 클래스에 도입되었으나, 이러한 요소들에 대한 엄격한 타입 지정을 가능하게 한 것은 TypeScript입니다. 동적 JavaScript에서는 static 클래스 요소가 비정적 요소와 타입이 다르지 않지만, TypeScript는 static 멤버를 고려하여 타입 안전성과 클래스 구조를 추가할 수 있습니다.

문제:

Static 속성과 메소드는 클래스 자체에 속하고, 클래스의 인스턴스가 아닙니다. 그러나 많은 개발자들은 this 또는 생성자를 통해 인스턴스의 타입 지정과 클래스 자체를 객체로서의 타입 지정을 혼동합니다. 이는 때때로 메소드 내에서 static 필드에 접근하거나 상속할 때 오류를 초래합니다.

해결책:

TypeScript에서는 static 클래스 멤버가 비정적 멤버와 별개로 타입이 지정됩니다:

비정적 멤버는 클래스 본문을 통해 정의됩니다.
static 멤버는 static 키워드를 사용하여 정의됩니다.
클래스 자체의 타입은 typeof 구문을 통해 설명할 수 있어 주어진 구조의 객체로 안전하게 전달되고 사용할 수 있습니다.

코드 예시:

class User {
  static count: number = 0;

  name: string;
  constructor(name: string) {
    this.name = name;
    User.count++;
  }

  static getCount(): number {
    return User.count;
  }
}

function createUserClass(): typeof User {
  return User;
}

주요 특징:

static 멤버는 인스턴스가 아닌 클래스 생성자에 존재하므로 클래스 자체를 통해서만 접근 가능합니다.
클래스 자체를 전달하거나 타입 지정할 때는 typeof User를 사용하고, 인스턴스의 경우 User를 사용합니다.
static 메소드에는 자체적인 제한이 있습니다 (if 호출하지 않으면 this에 접근할 수 없음).

함정 질문.

static 메소드가 클래스의 비정적 속성에 직접 접근할 수 있나요?

아니요, static 메소드는 this를 통해 비정적 속성에 접근할 수 없습니다. this는 스스로 클래스를 가리킵니다 (생성자). 비정적 속성에 접근하기 위해서는 객체 인스턴스를 사용해야 합니다.

class Demo {
  static demoStatic() {
    // this.value; // 오류 — value는 static이 아님
  }
}

클래스의 인스턴스를 통해 static 속성에 접근할 수 있나요?

아니요, static 속성은 클래스 이름을 통해서만 접근 가능하며 인스턴스를 통해서는 접근할 수 없습니다:

const u = new User('Max');
console.log(u.count); // 오류
console.log(User.count); // OK

클래스를 상속할 때 static 메소드를 재정의하고 상속할 수 있나요?

네, static 메소드는 상속하고 재정의할 수 있으며, 이것은 예상대로 작동합니다:

class Animal {
  static who() { return 'Animal'; }
}
class Dog extends Animal {
  static who() { return 'Dog'; }
}
console.log(Dog.who()); // 'Dog'

일반적인 오류와 안티패턴

static과 비정적 클래스 멤버 간의 혼동
인스턴스를 통해 static 필드에 접근하려는 시도
static 메소드 내에서 this 사용 시 발생하는 오류

실생활 예시

부정적인 사례

개발자가 생성된 인스턴스의 카운터를 일반 인스턴스 속성으로 저장하고 static으로 저장하지 않습니다. 각 객체가 생성될 때 필드가 증가하지만, 모든 클래스 객체에 대하여 동기화되지 않습니다.

장점:

static에 대한 지식 없이 쉽게 구현 가능

단점:

불변성 위반, 카운터가 객체 수를 반영하지 않음, 대량 생성 시 오류 가능성

긍정적인 사례

모든 객체를 고려하기 위해 static count를 사용하여 생성자에서 적절히 증가시키고, 카운터를 얻기 위한 static 메소드를 사용합니다.