자바스크립트의 신기한 기능들

이 글에서는 제가 자바스크립트를 공부하면서 다른 언어에서는 볼 수 없었던, 그래서 신기하지만 까먹지 않게 메모하고 싶은 기능들을 정리해보려고 합니다.

1. 호이스팅 (Hoisting)

JS에는 변수나 함수를 선언할 때 (추가로 뭐가 있는지 안 찾아봄) 선언문을 가장 위로 끌어올려주는 (Hoist) 기능이 있습니다.

가령 이런 코드가 가능하다는 것이죠.

그렇지만 우리가 예상했던 것과는 다르게 호이스팅을 해도 "Hello"가 출력되진 않고 undefined가 출력됩니다. 그 이유는 변수의 선언 (책마다 표현하는 방식이 다르긴 하지만 전 declaration과 initialization or assignment로 구분하겠습니다)만을 호이스팅하기 때문입니다. 따라서 내부적으로는 코드가 다음과 같이 선언되게 된다고 생각하면 되겠죠.

var x;
console.log(x);  // -> undefined
x = "Hello";

개인적으로 우리의 직관에서 벗어나는, 즉 인간의 무의식의 위험성을 간과한 코드를 별로 좋아하지 않습니다. 사람은 언제나 실수할 수 있기 때문에 저런 코드를 작성하는 것은 상당히 위험한 결과를 초래할 수 있다고 생각하기 때문입니다. 저는 변수를 사용하기 전에는 직관적이고 올바른 초기화 과정을 거쳐주어야 한다고 생각하기 때문에 차라리 let를 더 선호하는 편입니다. 왜냐하면 let을 사용할 땐 호이스팅을 바라고 변수 선언문을 뒤쪽에 작성하면 참조 에러가 발생하기 때문이죠.

추가로 호이스팅은 함수에서도 일어납니다. 함수 A의 내부에서 함수 B를 사용해도 함수 B가 적혀있기만 하다면 함수 B가 A의 뒤에 위치해 있어도 상관 없습니다.

2. 그룹 연산자 ( )

그룹 연산자는 보통 책에서 연산자 챕터에서 같이 나옵니다. 그리고 설명을 표현식에서 우선순위와 연관지어서 설명을 주로 하는 것 같습니다. 저도 이 내용이 그룹 연산자에 대한 핵심 내용이라고 생각은 합니다만 살짝 놀랐던 것은 그룹 연산자는 연산자이기 때문에 (...)의 ...을 평가한다는 점입니다. 그래서 제가 봤던 내용은 그룹 연산자와 함수 리터럴을 같이 사용해서 그 함수를 바로 실행시켜버리는 작업을 하게 만드는 것이었는데 기존의 경험과는 거리감이 있었기 때문에 이게 뭐지 싶었습니다. 이게 모두 JS는 함수를 객체로 취급하기 때문이겠죠.