TS 컴파일러, object 타입

HARIBO·2021년 12월 11일
0

TS컴파일러

  • 일반적인 컴파일러
    1. 소스 코드를 AST(Abstract Syntax Tree)로 파싱한다.
    2. AST를 바이트코드로 컴파일한다.
  • TS컴파일러
    1. 소스코드를 타입스크립트 AST로 파싱한다
    2. 타입 검사기가 AST를 확인한다.
    3. 타입스크립트 AST를 JS코드로 변환한다.

TS타입

  • JS는 런타임 시 타입을 확인하지만, TS는 컴파일 시 타입을 확인한다.
  • TS는 대부분의 상황에서 자동으로 형변환이 되지 않는다.
  • 개발자는 어노테이션으로(Value: type)타입을 명시할 수도 있고, 어노테이션을 생략해, TS가 타입을 추론하도록 할 수 있다.

TS의 object

  • object타입은 값에 대한 정보를 거의 알려주지 않는다
let obj1: object = {
  a: 1,
};
obj1.a; //'object'형식에 'a'속성이 없습니다
  • object선언, 할당하기
//중괄호 안에서 타입 명시하기
let obj2: { a: number } = {
  a: 1,
};
obj2.a; //(property) a:number


//TS가 타입을 추론하게 하기
let obj3 = {
  a: 1,
};
obj3.a;  //(property) a:number
  • object의 프로퍼티 타입 지정하기
    • "?", 인덱스 시그니처를 사용할 수 있다.
    • 한번 할당하면 변경할 수 없는 읽기전용 필드
//a 속성은 생략 가능
//인덱스 시그니처 예시 : 이 객체에서 모든 number타입 키는 string타입의 값을 가진다.
//key의 이름은 임의로 지정 가능하며, number, string에 할당할 수 있는 타입이어야 한다.
let obj4: { a?: number; [key: number]: string };
obj4 = { a: 10, 1: "one" };
obj4 = { 1: 12 };  //"number"형식은 "string"형식에 할당할 수 없습니다.

//읽기전용 필드
let obj5: { readonly num: number } = {
  num: 100,
};
obj5.num = 200;  //읽기 전용 속성이므로 'num'에 할당할 수 없습니다.
  • 'Object'와 {}의 차이점(둘 다 타입으로 사용하면 안된다. null과 undefined를 제외한 모든 것을 포함하기 때문)
    • {} : 객체 프로토타입 메소드의 반환타입을 정할 수 있다
    • 0bject : 객체 프로토타입의 반환 타입과 일치하는지 확인한다
const obj6: {} = {toString(){return 1}}
const obj7: Object = {toString(){return 1}}  //'() => number' 형식은 '() => string' 형식에 할당할 수 없습니다.
  • 객체 리터럴({a: type})을 사용하거나, 객체 자체가 필요할 때는 object를 사용하자

    출처
    보리스 체르니, 타입스크립트 프로그래밍(2021)

0개의 댓글