[TypeScript] Function Introduction

안녕하세요 동기 여러분! 오늘은 자바스크립트의 버그를 하나 알아보고 앞으로 배울 타입스크립트가 얼마나 대단한지 깨닫는 시간을 가져보도록 합시닼ㅋㅋ

 

Unexpected result

아래의 코드를 보도록 합시다.

function howManyLetters(words) {
    console.log(words.length);
}

howManyLetters(10);

• howManyLetters라는 함수를 선언하는데 매개 변수는 words입니다.
• console.log(words.length);로 매개 변수 words의 길이를 출력하도록 설정을 마쳤습니다.
• ※ .length는 string(문자) 프로퍼티라서 문자에게만 사용이 가능합니다!!!
• 함수를 불러오는데 독립 변수는 숫자 10으로 설정을 했습니다.

 

★ 잠깐 매개 변수, 독립 변수가 뭐였지? 자세한 내용은 여기

 

본론으로 돌아와서 howManyLetters 코드를 실행하면 아래와 같은 예상치 못한 결과가 나옵니다.

분명히 .length 프로퍼티는 문자에만 사용이 가능한데 에러는 안뜨고 언디파인드를 띄우네요!!!

 

---

 

'.length는 문자 프로퍼티니까 undefined가 뜨는 게 맞지 않아?'라고 의문이 들 수 있기 때문에 파이썬에서 똑같은 코드를 실행해보았습니다. 

타입 숫자(integer)은 len()가 없다고 정확하게 뜹니다!!!

그렇습니다. 이렇게 떠야 정상인 것이죠. 고로 자바스크립트에서 결과 값으로 undefined가 뜨는 것은 버그인 것입니다.

 

---

 

그럼 파이썬 처럼 오류가 뜨게 하려면 자바스크립트에서는 어떻게 해야할까?

좀 복잡합니다. if문을 사용해서 코드를 작성해야합니다ㅠㅠ

function howManyLetters(words) {
  if (typeof words !== 'string') { 
    throw new Error('독립변수는 문자로 넣으십시오!!!');
    }
    
    console.log(words.length);
}

howManyLetters(10);

이렇게 코드를 작성하고 실행하면 아래와 같이 에러가 뜹니다!

---

 

타입스크립트는 얼마나 대단한가 (파이썬은 이미 가지고 있는 기능이라구!!!)

위의 예시와 같이 자바스크립트에서 제대로된(?) 에러를 띄우려면 코드를 복잡하게 바꿔줘야하는 불편함이 있습니다.

하지만 타입스크립트에서는 이러한 문제점들을 바로 진단하고 정확한 에러를 띄워주기 때문에 아주 대단한 친구라 말할 수 있겠습니다.

 

그럼 다음 시간부터 그 대단한 친구가 어떤 에러를 띄우는지 알아보도록 합시다.

 

---

 

오늘의 느낌

대구하면 막창이 유명하기 때문에 경상도 출신인 필자는 보통 막창구이나 곱창전골을 많이 먹어봤다. (곱창전골도 타지와 스타일이 완전다르다 -> 선산곱창전골 스타일을 많이 먹었다)

 

예전에 서울 홍대 근처에 놀러갔다가 곱창, 대창, 막창 구이집에 갔는데 신세계 였다. 곱창을 구워 먹는다는건 상상도 못했고 대창은 처음 보는 내장 구이라서 놀랐다.

 

서울가면 곱창, 대창, 막창 구이 먹고싶댜....