[TIL 2021.10.04] ts

Kyu·2021년 10월 4일
0

TIL

목록 보기
267/322

Today I Learned
타입스크립트

자바스크립트는 많은 사람들이 쓰는 언어지만 다른 언어들도 그런거처럼 몇몇 단점이 있다.

예를 들면 아래와 같은 조건들이 아무 에러없이 잘 실행된다.

if ("" == 0) {
  // It is! But why??
}
if (1 < x < 3) {
  // True for *any* value of x!
}

또 자바스크립트는 존재하지 않는 속성에 대한 에러도 없다.

const obj = { width: 10, height: 15 };
// Why is this NaN? Spelling is hard!
const area = obj.width * obj.heigth;

대게의 언어들은 에러를 발생시키지만 자바스크립트는 그렇지 않다.

작은 프로그램을 짤때는 이런 작은 요소들이 관리가 되겠지만 큰 프로젝트의 경우 문제가 커질 것이다.

타입스크립트는 이런 자바스크립트의 단점을 보완한 정적 타입 체커이다.

타입스크립트는 프로그램이 실행되기전에 이런 타입과 관련된 에러를 검
출한다.

마지막 예제를 가지고 예를 들면 아래와 같은 에러가 검출된다.

const obj = { width: 10, height: 15 };
const area = obj.width * obj.heigth;
Property 'heigth' does not exist on type '{ width: number; height: number; }'. Did you mean 'height'?

타입스크립트는 자바스크립트 코드에서 syntax 에러는 잡지 않는다. 왜냐하면 타입스크립트는 자바스크립트의 상위 확장 이기때문이다. 그래서 작동하는 어떤 자바스크립트 코드라도 타입스크립트 파일에 넣으면 동작한다.

console.log(4 / []);

위 예제는 구문적으로(syntactically) 옳기때문에 Infinity 라고 나온다. 하지만 타입스크립트에서는 에러가 난다. 타입스크립트에서는 타입이 any, number, bigint, enum 중에 하나여야하기 때문이다.

타입스크립트 파일에 자바스크립트 코드를 그대로 가져와서 실행하면 타입에러가 있어도 그대로 실행된다. 이는 자바스크립트와 타입스크립트의 미묘한 차이에 의한 프로그램 동작중지를 막고 사용자가 크게 신경쓰지 않고 두 언어의 쉬운 전환을 위한 것이다.

https://www.typescriptlang.org/docs/handbook/typescript-from-scratch.html

profile
TIL 남기는 공간입니다

0개의 댓글