[B급 프로그래머] 다음 자바스크립트 코드에서 오류는?

요즘 어쩌다보니 React.js 공부를 (반강제적으로?) 하게 되어서 자바스크립트를 다시 복습하고 있는데 Can You Find The Bug in This Code?라는 글이 재미있어 독자 여러분들께 소개하고자 한다. 다음 코드에서 이상한 부분을 찾을 수 있겠는가?

직접 입력한 다음에 실행해봐도 되지만, 여러분들의 수고를 들기 위해 개발자 도구의 콘솔에 출력된 결과를 보여드리면 다음과 같다.

Uncaught TypeError: (intermediate value)(...) is not a function

hello와 world!가 각각 찍혀야 하는데 이상한 오류 메시지만 나온다. 도대체 무슨 일이 생긴 것일까? 잠시 생각해봤는데 감이 오지를 않아서 본문 내용도 읽어보고 추가 자료도 검색한 결과 자바스크립트는 보면 볼수록 난감한 물건(응?)이라는 생각이 들고 말았다. 혹시 문제를 풀지 못한 독자분들을 위해 힌트 1번 나간다.

힌트 1번: 7.9 Automatic Semicolon Insertion

ECMA 표준 규약에서 뭔가 중요한 힌트를 주고 있는데, 자동화된 부분이 반대로 개발자를 힘들게 만드는 사례로 봐도 무방하다.

여전히 문제를 풀지 못한 독자분들을 위해 힌트 2번 나간다.

이렇게 놓고 보니 뭔가 의도하지 않은 부분이 보이는가? 주범은 세미콜론(;)이다. 앞서 언급한 7.9 섹션을 보면 알겠지만 함수 호출과 관련해서는 자동으로 세미콜론을 넣어주지 않기 때문에 예상치 못한 문제가 발생하게 된 것이다. 이제 어디를 수정하면 될지 알겠는가? 정답을 보자.

오늘의 교훈: 자동화된 기능을 너무 믿지 말고 세미콜론을 붙이자.

EOB