[TypeScript] 타입스크립트의 타입 선언 : Object

타입스크립트와 Object type

타입스크립트에서 Object도 타입으로 선언할 수 있는데, 아래와 같이 타입을 선언할 수 있습니다.

 

// Object 타입 선언
let myObject1: { name: string } = { name: "jay" };
console.log(myObject1); // { name: 'jay' }

// type alias로 타입 선언도 가능하다
type MyObject = {
  name: string;
  age: number;
};

let myObject2: MyObject = {
  name: "john",
  age: 13,
};
console.log(myObject2); // { name: 'john', age: 13 }

 

타입스크립트의 literal type

타입스크립트에서 Object 타입은 특정 문자열이나 값만 오도록 설정할 수 있는데 이렇게 미리 선언한 것이 literal type입니다.

literal type은 | 연산자로 경우의 수를 늘릴 수 있으나, 값이 다르면 컴파일 오류를 발생시킨다는 특징이 있습니다.

 

 

name 속성을 literal type 으로 'hello'로 선언했기에 철자라도 틀리면 컴파일을 발생시켜줍니다.

 

// 타입스크립트와 literal type
type MyObject2 = {
  name: "hello";
  age: number;
};

let myObject3: MyObject2 = {
  // name: 'hello2', // 오류!
  name: "hello",
  age: 13,
};
console.log(myObject3); // { name: 'hello', age: 13 }

 

타입스크립트의 Intersection Type

내가 만든 Object을 확장하여 새로운 타입을 만들고 싶다면 어떻게 해야할까요?

만약 일일히 개발자가 똑같은 코드를 다시 작성해서 타입을 만든다면 매우 번거로울 것입니다.

이럴 때 사용할 수 있는 것이 Intersection Type이며 & 연산자를 통해 마치 클래스를 상속하듯 타입을 작성할 수 있습니다.

 

// intersection type
type MyObject3 = {
  name: string;
};

type newMyObject = MyObject3 & {
  age: 13;
};

let myObject4: newMyObject = { name: "hey", age: 13 };
console.log(myObject4); // { name: 'hey', age: 13 }