[TYPESCRIPT] 추론적 타입과 명시적 타입

추론적 타입 vs 명시적 타입

C나 C++ 같은 언어에서는 모든 것의 타입을 지정해줘야만 한다.

예를 들어 새로운 변수를 생성한다면

그 변수의 타입을 꼭 명시해줘서 "그 변수는 number고 항상 number일 것이다" 하고 컴파일러에게 알려줘야만 한다.

 

그에 반해 타입스크립트는 

• 데이터와 변수의 타입을 명확하게 정의할 수도 있고 : 명시적 타입 (Explicit Types)
• 자바스크립트처럼 변수만 생성하고 넘어가도 된다 : 추론적 타입 (Implicit Types)

 

타입스크립트는 알아서 타입을 추론해주기 때문.

 

 

소스 코드로 명시적 타입과 추론적 타입을 비교하자면 아래와 같다.

 

// 추론적 (Implicit Types)
let a = "hello";
// a는 "hello"라는 문자열을 가지는 것으로 보아 string이다

// 명시적 (Explicit Types)
let b: boolean = false;
// b는 boolean이다

a는 자바스크립트와 같이 생성만 진행했지만

"hello"를 통해 '데이터 타입으로 string을 갖는구나' 하는 추론이 가능하며

b는 :boolean 을 통해 '데이터 타입으로 boolean을 가질거야' 하고 명확한 타입 선언을 해준 것이다.

 

 

 

배열에서의 명시적 타입과 추론적 타입

아래는 배열 c가 number인 요소만 받겠다고 선언한 예시이다.

let c: number[] = [1, 2, 3];
// 숫자로 이루어진 배열 c

// c.push("1");
// ? Argument of type 'string' is not assignable to parameter of type 'number'.ts(2345)
// 문자열을 c의 요소로 넣을 수 없기 때문에 컴파일에러 발생
// 자바스크립트에서는 문제 없이 수행 가능 : c = [1, 2, 3, "1"]

c.push(1);
// c = [1, 2, 3, 1];

c: number[] 라는 타입 지정으로 인해

c.push("1"); 은 자바스크립트에서는 문제 없는 코드이지만, 타입스크립트에서는 실행할 수 없는 코드가 된다.

오로지 c.push(5); c.push(100); 과 같이 새로운 요소로 숫자만을 추가하며 문자열을 요소로 받는 실수를 방지한다.

 

 

참고로 c는 [1, 2, 3] 만으로도 '요소로 숫자만 받을건가보다' 하는 타입 추론이 이미 발생하기 때문에

let c = [1, 2, 3]; 으로만 초기화 해주어도 c.push("1"); 에 컴파일에러가 발생한다.

let c = [1, 2, "3"]; 으로 요소에 문자열을 포함해 초기화 해준다면 c.push("1"); 도 수행 가능해진다.

let c = [1, 2, 3];
// c.push("1"); 
// ? Argument of type 'string' is not assignable to parameter of type 'number'.ts(2345)

let cc = [1, 2, "3"];
cc.push("1");
// cc = [1, 2, "3", "1"];

 

 

객체에서의 추론적 타입

아래는 객체 player에 타입 추론이 일어나는 예시이다.

const player = {
  name: "lesry"
}

// player.name = 1;
// ? Type 'number' is not assignable to type 'string'.ts(2322)
// string이 아닌 number가 name의 value값으로 선언됐기 때문에 컴파일에러

player.name = "sryung";
// player = {name: "sryung"}

최초 player의 key인 name에 "lesry" 라는 문자열이 value로 선언된 것을 참고하여

'앞으로는 string만 name의 value로 오겠구나!' 하는 타입 추론이 이루어진다.

그 영향으로 player.name = 1 은 컴파일 에러가 발생함을 확인할 수 있다.

 

객체에 명시적 타입을 추론하는 방식에 대해서는 나중에 더 자세히 다룰 예정이다.

 

 

---

참고

노마드코더 - TypeScript로 블록체인 만들기

코딩애플 - 타입스크립트 쓰는 이유 & 필수 문법 10분 정리