TypeScript에서 생성자 자체의 개인 클래스 필드를 정의하고 초기화하는 방법은 무엇입니까?
6954 단어 typescript
생성자 자체에서 개인 클래스 필드를 정의하고 초기화하려면 TypeScript에서 생성자 함수의 매개변수 대괄호에 있는
private
가시성 수정자 키워드를 사용하여 클래스 필드 이름을 작성해야 합니다.TL; DR
// a simple class
class Person {
// define and assign the values to class
// fields inside the class
// constructor parameters brackets
constructor(private name: string, private age: number) {
// we do not need any code
// in the constructor body 🔥
}
}
// make an instance of the `Person` class
const john = new Person("John Doe", 23);
// log the contents
console.log(john); // {name: "John Doe", age: 23} ✅
예를 들어
Person
및 name
라는 2개의 필드를 정의해야 하는 age
라는 클래스가 있다고 가정해 보겠습니다.클래스 필드를 정의한 다음 초기화하는 먼 방법은 클래스 본문 내부에 필드를 만든 다음
constructor
연산자를 사용하여 this
의 값을 클래스 필드에 할당하는 것입니다.다음과 같이 보일 수 있습니다.
// A very long process and more code 😩
// a simple class
class Person {
private name: string;
private age: number;
// assing the values to class
// fields using the class constructor
constructor(name: string, age: number) {
this.name = name;
this.age = age;
}
}
이제 프로세스와 코드를 더 짧게 만들기 위해 TypeScript는 생성자 매개변수 대괄호에서 동시에 클래스 필드를 정의하고 초기화할 수 있는 방법을 제공합니다.
다음과 같이 생성자 함수의 매개변수 대괄호에
private
가시성 수정자 키워드를 사용하여 클래스 필드 이름을 작성할 수 있습니다.// A very short process and less code 😃
// a simple class
class Person {
// define and assign the values to class
// fields inside the class
// constructor parameters brackets
constructor(private name: string, private age: number) {
// we do not need any code
// in the constructor body 🔥
}
}
보시다시피 생성자 본체 내부에 코드를 사용하지 않았습니다.
이제
Person
클래스의 인스턴스를 만들고 John Doe
값을 첫 번째 인수로, 23
값을 생성자 함수에 전달하고 개체의 내용을 콘솔에 기록해 보겠습니다.다음과 같이 할 수 있습니다.
// A very short process and less code 😃
// a simple class
class Person {
// define and assign the values to class
// fields inside the class
// constructor parameters brackets
constructor(private name: string, private age: number) {
// we do not need any code
// in the constructor body 🔥
}
}
// make an instance of the `Person` class
const john = new Person("John Doe", 23);
// log the contents
console.log(john); // {name: "John Doe", age: 23} ✅
위의 코드에서 볼 수 있듯이 개체의 적절한 키에 할당된 값으로 올바른 출력을 얻었습니다. 이는 클래스 필드가 정의되고 초기화되었음을 증명합니다.
TypeScript의 생성자 자체에서 개인 클래스 필드를 성공적으로 정의하고 초기화했습니다. 예이 🥳!
codesandbox에 있는 위의 코드를 참조하십시오.
그게 다야 😃!
이 정보가 유용하다고 생각되면 자유롭게 공유하세요 😃.
Reference
이 문제에 관하여(TypeScript에서 생성자 자체의 개인 클래스 필드를 정의하고 초기화하는 방법은 무엇입니까?), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/melvin2016/how-to-define-and-initialize-private-class-fields-in-the-constructor-itself-in-typescript-1f56텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)