TypeScript 읽기 전용 유형의 작동 방식

TypeScript에는 문제를 해결하기 위해 TypeScript에서 특별히 만든 유형인 여러 가지 유틸리티 유형이 있습니다. 이 기사에서는 Readonly 유형을 살펴보겠습니다.

TypeScript 읽기 전용 유형

이름에서 알 수 있듯이 TypeScript의 Readonly 유형은 특정 유형이 읽기 전용임을 나타냅니다.

예를 들어 보겠습니다. 아래에서 우리는 누구도 myObject의 어떤 부분도 업데이트하지 않기를 바랍니다. 다음과 같이 읽기 전용 개체로 만들 수 있습니다.

type User = {
    firstName: string,
    lastName: string
}

let firstUser:Readonly<User> = {
    firstName: "John",
    lastName: "Doe"
}

firstUser의 속성을 변경하려고 하면 다음 오류가 발생합니다.

Cannot assign to 'firstName' because it is a read-only property.

읽기 전용 변수는 TypeScript에서 작동하지 않습니다.

위에서 User 유형을 정의할 때 사용자 정의 인터페이스, 즉 객체가 준수해야 하는 인터페이스를 생성합니다. 읽기 전용은 우리가 사용한 것과 같은 인터페이스 또는 사용자 정의 유형에서만 작동합니다. 따라서 여전히 읽기 전용 변수를 편집할 수 있습니다.

let myVariable:Readonly<string> = "Hello World";
myVariable = "Goodbye World";
console.log(myVariable); // console logs "Goodbye World"

위의 코드는 유효하며 TypeScript에서 작동합니다. 읽기 전용 변수가 필요한 경우 다음과 같이 const를 대신 사용할 수 있습니다.

const myVariable:string = "Hello World";
// Throws error: Cannot assign to 'myVariable' because it is a constant.
myVariable = "Goodbye World";