front-end / / 2023. 11. 27. 06:45

[typescript] 타입스크립트를 쓰는 이유

이 내용은 코드앙마의 타입스크립트 강좌를 정리해놓은 자료이다.

코드앙마 타입스크립트


우리가 사용하는 브라우저들은 타입스크립트를 이해하지 못한다. 자바스크립트로 변환해서 실행해야 한다. 그러면 어떤 장점이 있어 타입스크립트를 사용하는걸까?

add 함수를 하나 만들어보자.

function add(num1, num2) {
    console.log(num1 + num2);
}

이를 사용하는 함수를 하나 호출해보자.

add(); // 오류가 나지 않음
add(1); // 오류가 나지 않음
add(2, 3); // 5로 리턴
add(3, 4, 5);  // 12로 예상하지만 7로 리턴
add('hello', 'world');  // hello world로 리턴

위의 함수를 사용하는 개발자는 어디서 문제가 발생했는지 일일이 다 확인해야 한다.

하나의 예제를 더 보자.

function showItems(arr) {
    arr.forEach((item) => {
        console.log(item);
    })
}

위의 함수는 배열을 받아서 루프를 돌면서 실행하는 함수다.

showItems([1,2,3]); // 배열을 넘기면 잘 실행된다
showItems(1,2,3); // 배열이 아니면 오류가 발생한다.

이렇듯 Javascript는 런타임에 타입을 결정하고 오류를 발견한다. 개발자가 실수하게 되면 사용자가 그 오류를 그대로 보게 된다.

타입스크립트는 컴파일 타임에 오류를 발견하게 되어 사전에 오류를 미리 찾을 수 있다.

방금 만든 예제를 타입스크립트로 만들어보자.

https://www.typescriptlang.org/ 여기에서 타입스크립트를 작성해보자.

위에서 만든 예제를 붙여보자.

오류가 발생했음을 바로 알 수 있다.

마우스를 올리면 바로 오류를 확인할 수 있다.

아래와 같이 수정할 수 있다.

function add(num1:number, num2: number) {
    console.log(num1 + num2);
}

//add();
// add(1);
add(2, 3);
// add(3, 4, 5);
// add('hello', 'world');
반응형
  • 네이버 블로그 공유
  • 네이버 밴드 공유
  • 페이스북 공유
  • 카카오스토리 공유