TypeScript Guidebook
  • TypeScript 가이드북
  • 소개
    • TypeScript를 사용하는 이유
  • 환경 구성 / CLI
    • 컴파일 설정
    • 린팅
    • IDE / 에디터
    • Google TypeScript Style
    • TSDX
  • 타입
    • primitive 타입
    • any 타입
    • array 타입
    • tuple 타입
    • enum 타입
    • function / union / void 타입
    • object 타입
    • null / undefined 타입
    • never 타입
    • 사용자 정의 타입
    • 타입 어설션
  • TS vs ES6
    • 블록 영역 변수, 상수 선언
    • 템플릿 리터럴
    • 화살표 함수
    • 전개 연산자 / 매개변수
    • 비구조화 할당
  • 클래스
    • 속성 with 접근 제어자
    • 메서드 with 접근 제어자
    • 상속
    • 게터 / 세터
    • 스태틱 속성, 메서드
    • 추상 클래스
    • 싱글턴
    • 읽기전용 속성
  • 네임스페이스와 모듈
    • 네임스페이스
    • 네임스페이스 멀티 파일
    • 네임스페이스 중첩
    • 모듈
    • 모듈 번들링
  • 인터페이스
    • 인터페이스와 클래스
    • 인터페이스와 매개변수
    • 인터페이스와 객체 리터럴
    • 인터페이스 옵션 속성
    • 인터페이스 읽기 전용 속성
    • 인덱스 시그니처 속성
    • 인터페이스와 함수타입
    • 인터페이스 확장
  • 제네릭
    • 제네릭과 클래스
    • 제네릭과 함수
    • 멀티 타입 설정
    • 타입 변수 상속
  • 데코레이터
    • 데코레이터 / 팩토리
    • 데코레이터 구성
    • 클래스 데코레이터
    • 메서드 데코레이터
    • 접근 제어자 데코레이터
    • 속성 데코레이터
    • 매개변수 데코레이터
Powered by GitBook
On this page
  • 읽기 전용
  • 실습
  • 참고
  1. 클래스

읽기전용 속성

읽기 전용

readonly 키워드를 사용해 클래스 속성 이름 앞에 추가하면 읽기 전용 속성이 되어 속성을 다른 값으로 쓸 수 없습니다. 다른 값을 설정하려고 시도하면 컴파일 과정에서 다음과 같은 오류 메시지를 출력합니다.

class OnlyOne {

  private static instance:OnlyOne;

  // 읽기 전용 속성 설정
  public readonly name:string;

  private constructor(name:string) {
    this.name = name;
  }

  public static getInstance(name:string):OnlyOne {
    if (!OnlyOne.instance) {
      OnlyOne.instance = new OnlyOne(name);
    }
    return OnlyOne.instance;
  }

}


/* 인스턴스 생성 ------------------------------------------------ */

let special_one = OnlyOne.getInstance('스페셜 원');

console.log(special_one.name);

// [오류]
// [ts] 상수 또는 읽기 전용 속성이므로 'name'에 할당할 수 없습니다.
// (property) OnlyOne.name: string
special_one.name = '노멀 원';

컴파일된 JavaScript(ES5) 코드를 살펴보면 읽기 전용 속성으로 처리되지 않는 것을 확인할 수 있습니다. JavaScript는 읽기전용(readonly) 속성을 지원하지 않기 때문입니다.

컴파일 코드:

JavaScript
var OnlyOne = /** @class */ (function () {
  function OnlyOne(name) {
    this.name = name;
  }
  OnlyOne.getInstance = function (name) {
    if (!OnlyOne.instance) {
      OnlyOne.instance = new OnlyOne(name);
    }
    return OnlyOne.instance;
  };
  return OnlyOne;
}());


/* 인스턴스 생성 ------------------------------------------------ */

var special_one = OnlyOne.getInstance('스페셜 원');

console.log(special_one.name); // '스페셜 원'

special_one.name = '노멀 원';

console.log(special_one.name); // '노멀 원'

실습

참고

Previous싱글턴Next네임스페이스와 모듈

Last updated 6 years ago

Handbook - Classestypescriptlang
TypeScript - 읽기 전용 속성
Logo