개발/개발 이모저모

[typescript vs javascript] 어떤 언어를 써야할까? 이 글로 종결하자!

키드 뮤지션 2022. 4. 6. 17:50

 

똘이는 javascript를 사용하는 유저이다. 인터넷을 검색해보니 typescript라는 검색어가 계속 눈에 들어온다. 그리고 주변 개발자들도 typescript를 사용한다는 소리를 듣곤 한다. 그리고 의문이 생겼다. typescript 왜사용해야되?

지금 누군가는 이렇게 똘이처럼 javascript를 쓸지 typescript를 쓸지 고민하는 이들이 있을 것이다. 하지만 언제까지 고민만 할것인가? 이제 결정해야만 한다. 여러분의 시간은 소중하니깐?

해당글은 typescript와 javascript중 어떤 걸 사용해야 할지 고민하기 위한 사람들을 위한 글이다. 해당글로 typescript 또는 javascript를 쓸지 종결시킬수 있기를 바라며 글을 쓴다. 기억하자. 여러분의 시간은 소중하다.

javascript와 typescript의 차이

javascript와 typescript의 가장 핵심적인 차이는 type이 있느냐 없느냐이다.
type이 머냐고? 다음 예제를 보자.

javascript (plus.js)

var a=1
var b=2

var c = a+b


typescript (plus.ts)

var a:number =1
var b:number =2

var c:number

c =a+b


javascript는 선언할때 자료형을 구지 명시하지 않아도 된다. 하지만 typescript는 변수 옆에 number라고 자료형을 명시해야만 한다. 이걸 바로 type이라고 한다.
그런데 type이 있음에 따라서 머가 더 좋아지는 것일까?

typescript 장점1:런타임 에러 vs 컴파일 에러

javascript (plus.js)

function plus(a,b){
    var c = a+b			//1.runtime err 발생

    return c
}

var a =1
var b ="aa"				

console.log("a+b=" +plus(a,b))


typescript (plus.ts)

function plus(a:number,b:number):number{
    var c:number = a+b

    return c
}

var a:number =1
var b:number ="aa"         // 2. compile err 발생

console.log("a+b=" +plus(a,b))


a와 b의 값을 더한 c의 값을 출력하는 코드이다. 그리고 number와 string을 더하는 오류가 있는 코드이다.
javascript의 경우는 runtime에서 에러가 발생한다. 즉, 프로그래밍이 잘 돌다가 '1번 지점'에서 에러가 발생하며 죽는다.
typescript의 경우는 compile과정에서 에서 에러가 발생한다. 즉, 프로그램이 돌기도 전에 에러를 출력한다.
물론 위의 코드는 누가봐도 쉬운 코드이기에 바로 에러를 찾아서 고칠수 있다. 하지만 코드의 규모가 커지게 되면 이야기는 달라진다. javascript는 프로그램 잘돌다가 이유없이 죽는 경우가 많다. 하지만 typescript는 프로그램이 돌다가 죽는 불상사를 미리 예방할수 있다. 그 이유는 type을 명시함으로써 컴파일 단에서 미리 선언될수 없는 변수를 차단하기 때문이다.

typescript 장점2: IDE와 결합성

typescript는 javascript보다 IDE와의 결합성이 훨씬 좋다. typescript는 ctrl + click으로 웬만한 class와 fuction을 쉽게 역추적 할수 있다. 물론 javascript도 IDE에서 해당 기능을 제공한다. 하지만 때론 javascript에선 쉽게 역추적 되지 않는 경우가 많다. 그럴땐 find를 통해서 찾아야만한다. 물론 그렇게 불편하지는 않다. 하지만 클릭 한번, 타자 한번이 쌓여서 시간을 잡아먹는다.

typescript 장점3:가독성


javascript (plus.js)

function plus(a,b){
    var c = a+b			

    return c
}


typescript (plus.ts)

function plus(a:number,b:number):number{
    var c:number = a+b

    return c
}

typescript는 자료형을 명시함으로써 어떤형의 데이터가 들어가고 어떤 형의 data가 return 되는지 쉽게 알수 있다. javascript의 경우에는 따로 설명이 되어 있지 않거나 네이밍이 이상할 경우, 직접 들어가서 코드를 읽는 방법수 밖에 없다. 또한 javascript의 input 나 return 값이 object일 경우는 코드를 읽기가 더 힘들어진다. 하지만 typescript는 interface로 type을 새로 선언함으로써 어떤 데이터가 들어가고 어떤 데이터가 return 되는지 좀더 쉽게 파악이 가능하다. 즉, 가독성이 좋아진다. 물론 네이밍을 잘하면 javascript에서도 충분히 가독성이 좋을순 있으나... 모든 프로그래머들이 네이밍을 잘하진 않는다. 그리고 그게 여러분의 동료일수도 있다.

그래서 typescript가 더 좋다는 겁니까? 그건아니다. javascript도 typescript보다 더 좋은점도 있다.

javascript 장점1: 유연성


javascript

var a="string"

var b=2
a=1

var c = a+b
console.log("a+b=", c)


typescript

var a:string="string"

var b:number=2
a=1

var c:number = a+b
console.log("a+b=", c)

위 코드를 보면 알수 있듯이 javascript는 a라는 변수를 자료형을 바꿔가면 사용하는게 가능하다. typescript는 불가능하다. 또한 number나 string이 기본 자료형이 아닌 object같이 복합자료형일 경우엔 typescript는 선언해줘야할게 정말많다. 그래서 코드작성을 유연하게 하지 못할때가 정말 많다. javascript라면 3줄이면 될것을 typescript는 10줄 또는 그이상을 작성해야 할때도 있다.

생산성

유연하지 못하다는 것은 곧 생산성과도 연결된다. 위에 말했듯이 javascript에서는 3줄이면 될것을 typescript에서는 10줄의 코드를 써야할때도 있다. 결국 코드작성에 더 많은 시간이 걸린다. 요즘처럼 빠르게 실험하고 빠르게 움직여야 하는 시대에선 생산성은 정말 중요하다.

typescript와 javascript의 차이에 대해서 이야기 해보았다. 요약하면 다음과 같다.

  javascript typescript
장점 코드 작성이 유연하다.
빠른 코딩이 가능하다.

컴파일 시 에러를 잡을수 있다.
IDE와 결합성이 좋다.
코드 가독성이 좋다.
단점 프로그램이 알수 없는 에러로 죽곤한다.
코드 가독성이 비교적 떨어진다.
IDE와 결합성이 비교적 떨어진다.
코드 작성에 제약이 많다.
코드 작성에 시간이 많이 걸린다.
여러가지 설정이 좀 많다.

 

 

 

typescript VS javascript 어떤걸 써야할까?

이건 주관적일수밖에 없다. 하지만 필자의 관점이 궁금하다면 읽어도 좋다.
필자는 개인적으로 typescript를 쓰는게 더 좋다고 생각한다. 그이유는 javascript의 장점인 '유연성'과 '빠른 코딩'은 typescript로 어느정도 해결이 가능하다고 믿기 때문이다. typescript에서는 any라는 자료형을 사용함으로써 javascript의 유연성을 가질수 있다. 여기서 any는 어떤 자료형이든지 허용하는 자료형이다. 그래서 typescript는 경우에 따라 유연하게 사용할수도 있고 제약적으로 사용할수도 있다. 뿐만 아니라, 컴파일로 많은 에러를 사전예방할수 있고, 가독성이 좋다. 그래서 중간에 합류한 팀원이 빠르게 코드를 이해할수 있다. 그래서 장기적으로 typescript가 javascript의 생산성을 커버 칠수 있다고 믿는다.

물론 javascript도 잘사용하면 전혀 부족한 언어가 아니다. 팀단위로 best practice를 만들어서 가독성을 향상시킬수 있고, 테스트 코드를 통해서 미리 에러를 예방할수도 있다. (그래서 사실 언어보다는 사용하는 사람들과 팀이 더중요하다.)

결론

결국 언어가 중요한게 아니다. 어떤 언어든지 간에 사용하는 사람들이 더 중요하다. 좋은 도구라고 사람이 구리면 도구도 구려진다. 필자도 javascript typescript다 써봤지만 결국 사람이 문제를 일으키더라....
코드 못읽겠다고 typescript로 바꾸자는 개발자도 있더라....알고 보니 다른 코드도 잘 못읽더라....