TypeScript any

React/typescript 2022. 10. 13. 10:41
728x90

TypeScript에는 다른 프로그래밍 언어에는 존재하지 않는 타입들이 존재한다.

 

자바스크립트에서는 아래와 같은 결과를 반환한다.

let value = 10;
console.log(typeof value); // number
console.log(value.length); // undefined

 

타입스크립트에서는 아래와 같이 에러가 발생함을 표시해준다.

밑줄 표시된 부분에 마우스를 가져가면....

TS2339: Property 'length' does not exist on type 'number'.

라는 결과를 보여준다. number 타입은 length 프로퍼티가 존재하지 않는다.

 

문자열인 경우에는 Javascript 와 TypeScript 모두 에러를 반환하지 않는다.

let str = "10";
console.log(typeof str); // string
console.log(str.length); // 2

 

변수 타입을 any 로 지정하면 에러가 사라지는 결 확인할 수 있다.

any is a type that disables type checking and effectively allows all types to be used.

즉 모든 타입을 허용한다는 뜻이다.

 

let u: any = true;
= "string"// Type 'string' is not assignable to type 'boolean'.
Math.round(u); // Argument of type 'boolean' is not assignable to parameter of type 'number'.

any 타입으로 하면 boolean, string, number 모두를 허용하므로 원치 않는 결과가 발생할 수 있다.

 

Javascript 로 변환하여 결과를 출력하면 어떻게 되는지 확인해보자.

// Javascript 에서 아래와 같이 값을 할당하는데 에러를 출력하지 않는다.
let u = true;
= "string"// Error: string 타입은 boolean 타입이 아니라 할당 불가
console.log(Math.round(u)); // NaN

콘솔 로그로 확인해보면 NaN 이란 결과를 출력한다.

 

any 타입지정은 원하지 않는 결과를 초래할 수 있으니 사용하지 않는게 좋다.

TypeScript 에서 경고 출력하는 메시지를 확인하면서 코드를 올바르게 수정하자.

728x90

'React > typescript' 카테고리의 다른 글

타입스크립트(TypeScript) 개요  (0) 2022.10.09
블로그 이미지

Link2Me

,