리코딩 : 타입스크립트(TypeScript)

타입스크립트 - 덕 타이핑(duck typing)

BreezeBm 2021. 10. 19. 13:40

자바스크립트는 동적언어이다. 런타임에 타입이 결정되는 언어이다. 소스가 빌드괼 때 자료형을 결정하는 것이 아니라 실행시 결정이 된다. 그리고 자바스크립트는 따로 타입 지정이 없기 때문에 덕 타이핑 기반이다. 덕 타이핑은 객체가 어떤 타입에 부합하는 변수와 메서드를 가질 경우 객체를 해당 타입에 속하는 것으로 간주하는 방식이다.

만약 어떤 새가 오리처럼 걷고, 헤엄치고, 꽥꽥거리는 소리를 낸다면 나는 그새를 오리라고 부를 것이다.

 타입스크립트는 인터프리터로 실행되는 것도 아니고, 컴파일로 되는것도 아니다. 자바스크립트로 컴파일되며, 실행역시 타입스크립트가 아닌 자바스크립트로 이루어진다. 그렇기 때문에 자바스크립트의 덕 타이핑처럼 타입스크립트도 매개 변수 값이 요구사항을 만족한다면 타입이 무엇인지 신경쓰지 않는 동작을 그대로 모델링을 한다. 코드를 기록해보자

interface Human {
  name: string;
  age: number;
};

interface Robot {
  name: string;
  age: number;
  manufacture: string;
}

const human: Humna = {
  name: "LEE",
  age: 15,
}

const robot: Robot = {
  name: "æ_Robotos";
  age: 1,
  manufacture: "æXcom"
};

let me: Human;
me = robot; // 에러가 발생하지 않는다.

 

타입스크립트를 위 코드를 에러 없이 처리한다. Human을 덕타이핑으로 본다면 "어떤 타입이 string타입을 가지는 name 프로퍼티가 있고, number타입을 가지는 age라는 프로퍼티가 있다면 Human이라고 본다."로 볼 수있다. 타입스크립트는 robot에는 string을 타입으로 가지는 name도 있고, number를 타입으로 가지는 age가 있으니, 구조적으로 맞기 때문에 me에 할당이 가능하다고 처리한다. 

function showName(human: Human): void {
  console.log(`Hi!, ${human.name}`);
};

showName(robot); // 에러가 발생하지 않는다.

 함수를 호출했을 때, 매개변수로 robot을 주어도, robot안에 name이 있기 때문에 문제가 되지 않는다. 그래서 정확하게 Human인지를 확인하는 타입가드 코드를 추가해서 작성해야한다.

function showName(human: Human) {
  if('manufacture' in human) {
    throw new Error(/* ... */)
  }
  console.log(`Hi! ${human.name}`)
}

"in"을 사용해서 변수에 manufacture라는 프로퍼티가 있으면 에러를 반환하고, 아닌 경우는 그대로 값을 출력하게 된다. 타입가드에도 다양한 방법들이 있다. typeof / instanceof / in / ** is ***(사용자 정의 타입가드)와 같은 메서드들이 있다. 

 

공부할것들이 많닷! 공부.. 공부