본문 바로가기

Front-End

이펙티브 타입스크립트 5장 - any 다루기

이번 포스팅에서는 typescript가 타입 시스템을 정적이면서 동적으로 쓸 수 있게 해주는 any 타입에 대해 알아볼 것이다. any의 장점은 살리면서 단점을 줄이는 방법을 살펴보자.

 

아이템 38. any 타입은 가능한 한 좁은 범위에서만 사용하기

function f1() {
	const x : any = expressReturningFoo();
    processBar(x);
    return x
}

// 이게 낫다
function f2() {
	const x = expressReturningFoo();
    processBar(x as any);
    return x
}

아래처럼 짜야되는 이유는 x 타입을 any라고 명시해주면, f1()의 리턴값들도 타입체크가 안되어버린다. 그렇게 되면, 프로젝트 전역으로 퍼져버리기 때문에 좋지않은 코딩 스타일이다.

 

아이템 39. any를 구체적으로 변형해서 사용하기

  • any를 사용할 때 정말 모든값을 허용할지 면밀히 검토하기
  • any보다 조금은 더 명확하게 명시하기
function getLengthBad(array:any) { return array.length };

function getLength(array:any[]) { return array.length };

아이템 41. any의 진화를 이해하기

  • any, any[] 타입은 진화할 수 있기 때문에 이렇나 코드를 인지하고 있어야 함
    const result = []; // any[]
    result.push('a'); // string []
    result.push(1); // (string|number) []​
  • 그렇기 때문에 any를 진화시키는 방식보다는 명시적 타입 구문을 사용하는 것이 안전

아이템 42. 모르는 타입의 값에는 any 대신 unknown을 사용하기

  • unknown은 any 대신 사용할 수 있는 안전한 타입이다. 어떠한 값이 있지만 그 타입을 알지 못하는 경우라면 unknown을 사용하면 된다.
  •