TypeScript에서 클래스의 인스턴스를 만들지 않고 액세스할 수 있는 필드를 만드는 방법은 무엇입니까?

Originally posted here!

클래스의 인스턴스를 만들지 않고 액세스할 수 있는 클래스의 필드를 만들려면 필드를 TypeScript에서 클래스의 멤버static로 정의해야 합니다. static 멤버를 만들려면 키워드static 뒤에 멤버 이름과 필드/멤버에 할당해야 하는 값을 작성해야 합니다.

TL;DR

// a simple class with 2 fields,
// a constructor and a `static` field
class Person {
  name: string;
  age: number;

  // this is the static field in class
  static className = "Person";

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}

// access the `static` member `className`
// without creating an instance of the `Person` class
console.log(Person.className); // Person ✅

예를 들어, Person와 name라는 2개의 fields이 있는 age라는 클래스가 있고, 이와 같은 constructor이 있다고 가정해 보겠습니다.

// a simple class with 2 fields
// and a constructor
class Person {
  name: string;
  age: number;

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}

이제 2개의 필드name 및 age는 클래스의 인스턴스를 생성할 때만 액세스할 수 있습니다.

그러나 클래스 자체에 연결하고 Person 클래스의 인스턴스를 생성하지 않고 해당 필드/구성원에 액세스할 수 있어야 합니다. 그렇게 하려면 클래스 내에서 static 키워드를 사용한 다음 필드 이름을 작성한 다음 여기에 값을 할당해야 합니다.
static라는 className 필드를 만들고 여기에 Person의 값을 할당해 보겠습니다.

다음과 같이 할 수 있습니다.

// a simple class with 2 fields,
// a constructor and a `static` field
class Person {
  name: string;
  age: number;

  // this is the static field in class
  static className = "Person";

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}

이제 static 필드를 만들었으므로 클래스의 인스턴스를 만들지 않고 className 정적 필드에 액세스해 보겠습니다.

다음과 같이 할 수 있습니다.

// a simple class with 2 fields,
// a constructor and a `static` field
class Person {
  name: string;
  age: number;

  // this is the static field in class
  static className = "Person";

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}

// access the `static` member `className`
// without creating an instance of the `Person` class
console.log(Person.className); // Person ✅

보시다시피 className 클래스의 Person 정적 필드에 액세스할 수 있었고 Person의 출력이 콘솔에 기록되었습니다.

클래스 인스턴스를 만들지 않고 액세스할 수 있는 클래스 멤버를 성공적으로 만들었습니다. 예이 🥳!

codesandbox에 있는 위의 코드를 참조하십시오.

그게 다야 😃!

이 정보가 유용하다고 생각되면 자유롭게 공유하세요 😃.