TypeScript에서 읽기 전용 사용 시 주의 사항

읽기 전용 속성의 기본

Type Script에서는 객체의 속성을 읽기 전용으로 만들 수 있습니다.

const person: { readonly name: string  } = { name: 'Mike' }

person.name = 21;
// → Cannot assign to 'name' because it is a read-only property.

---

⚠️① 읽기 전용은 컴파일 타임에만 가능

컴파일된 자바스크립트 코드에서는 읽기 전용 선언이 제거되어 런타임 시 오류로 감지되지 않습니다.

⚠️② 읽기 전용은 재귀적이지 않습니다.

const person: {
  readonly name: string;
  readonly academicBackground: {
    primarySchool: string
  }
} = {
  name: 'Mike',
  academicBackground: {
    primarySchool: 'School A'
  }
}

person.academicBackground.primarySchool = 'School B'
// You can change `person.academicBackground.primarySchool`

읽기 전용으로 만들고 싶다면 PrimarySchool에도 읽기 전용으로 설정해야 합니다.

const person: {
  readonly name: string;
  readonly academicBackground: {
    readonly primarySchool: string
  }
} = {
  name: 'Mike',
  academicBackground: {
    primarySchool: 'School A'
  }
}

person.academicBackground.primarySchool = 'School B'
// → Cannot assign to 'primarySchool' because it is a read-only property.

---

읽기 전용

속성 수가 늘어나면 각 속성에 읽기 전용을 추가하는 것이 번거롭고 코드 양도 늘어납니다.
읽기 전용을 사용하여 리팩터링할 수 있습니다.

const obj: {
  readonly a : string;
  readonly b: string;
  readonly c: string;
  readonly d: string;
} = {
  a: 'a',
  b: 'b',
  c: 'c',
  d: 'd'
}

// ↓

const obj: Readonly<{
  a : string;
  b: string;
  c: string;
  d: string;
}> = {
  a: 'a',
  b: 'b',
  c: 'c',
  d: 'd'
}

행복한 코딩☀️

위 내용은 TypeScript에서 읽기 전용 사용 시 주의 사항의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!