[TypeScript] Type 추론

// 타입 추론 : TypeScript의 중요한 기능 중 하나로, 개발자가 타입을 명시적으로 지정하지 않아도,

// 타입 안정성을 유지할 수 있도록 도와줌

let numbers = [1,2,3,4,5];

let string = ["a","b","c"];

// { name: string; age: number }로 추론

let person = {

    name: "Alice",

    age: 25

};

person.name = "Bob"; // 정상

person.age = 30; // 정상

person.age = "thirty"; // 오류: 'string' 형식은 'number' 형식에 할당할 수 없습니다.

 

// 객체 리터럴 방식의 추론

let person = {

    name: "Alice",

    age: 25

}; // { name: string; age: number }로 추론

person.name = "Bob"; // 정상

person.age = 30; // 정상

person.age = "thirty"; // 오류: 'string' 형식은 'number' 형식에 할당할 수 없습니다.

// 함수 반환 타입의 추론

function add(a: number, b: number) {

    return a + b; // number로 추론

}

const result = add(5, 3); // result는 number로 추론

 

 

Type을 문맥상으로 컴파일러 단에서 타입을 자동으로 추론을 해주는데 왜 Type anotion 해야하는가? 

다음과 같은 케이스를 보면

const subtract = (a: number, b: number) => { // subtract의 타입은 (a, b) => void
a - b;
}

두 수의 차를 구하는 함수에서 return이 보이지 않는다 -> 개발자의 실수라 하였을 때 

-> 저 코드를 실행하여도 오류가 생기지 않는다. -> 어? 반환값이 없어? -> 이거 void 함수잖아 

->void형 함수로 추론을 하기 때문에 -> 이는 개발자의 의도와는 거리가 멀어진다.

-> 규칙과 규율이 정해져 있는 환경이 장점인 typeScript의 장점을 활용하지 못하게 된다.

 

위와 같은 케이스를 몇 가지 좀 더  살펴보자

 

// Case 1.

const json = '{"a": 1, "b": 2}';

const object = JSON.parse(json); // any 타입으로 인식 -> 타입 어노테이션 필요

console.log(object); // {a: 1, b: 2}

object.asdadsfgsdasdasdasd // 타입스크립트는 object를 any 타입으로 인식해서 이러한 에러를 찾지 못함

// Case 2.

const colors = ['red', 'blue', 'green'];

let foundColor; // 암묵적으로 any 타입을 가짐 -> 타입 어노테이션 필요

for (let i = 0; i < colors.length; i++) {

    if (colors[i] === 'blue') foundColor = true;

}

// Case 3.

let numbers = [-10, -5, 10];

let numberAboveZero = false; // boolean 타입으로 타입 추론 -> 타입 어노테이션 필요 boolean | number

for (let i = 0; i < colors.length; i++) {

    if (numbers[i] > 0) numberAboveZero = numbers[i]; // error

}

 

case 1번은 

object.asdadsfgsdasdasdasd 가 작성되어도 오류가 발생되지 않는다.

const object : { a: number; b : number } = JSON.parse(json);  이런 식으로 TypeAnotation을 활용해주면 오류가 발생하지 않는다.

 

case 2번은 

let foundColor; // 암묵적으로 any 타입을 가짐 -> 타입 어노테이션 필요

암묵적으로 any 타입을 가지게 되었기 때문에

let foundColor : boolean;을 해주어 조금 더 안전한 Protected힌 환경에서 코드를 이어갈 수 있다. 

 

case 3번은 

let numberAboveZero = false; 을 통해 numberAboveZero 는 boolean 타입으로 추론되었다. 

그러나 아래 반복문에서 

 

for (let i = 0; i < colors.length; i++) {

    if (numbers[i] > 0) numberAboveZero = numbers[i]; // error

}

boolean type을 가진 곳에 number[i]에 해당하는 수를 대입하려 하였기 때문에 이는 에러를 발생시킨다.

이를 해소하고자 한다면 union 타입을 활용할 수 있다.

 

let numberAboveZero : boolean | number = false; 를 이용하면 오류가 발생하지 않는다.