더북(TheBook)

언뜻 보기에는 코드에서 “매직 넘버”를 피하는 작업에만 const를 사용한 것처럼 보일 수 있다. 예를 들어 코드에서 사용자가 어떤 동작을 했을 때 작업 중 메세지를 표시하기 전에 일반적인 지연에 사용할 수 있다.

const BUSY_DISPLAY_DELAY = 300; // milliseconds

const는 그보다 유용하다. 우리는 변수의 값을 자주 변경하지만 값을 변경하지 않는 경우도 많으며, 변수를 사용하여 변하지 않는 정보를 보관하기도 한다.

실제 예를 살펴보자. 코드 2-2는 특정 클래스가 있는지 여부에 따라 div에 텍스트를 추가하는 간단한 루프다. 변수를 상당히 간단하게 사용한 것을 볼 수 있다.

코드 2-2 ES5 버전의 div 업데이트 루프–element-loop-es5.js

var list, n, element, text;
list = document.querySelectorAll("div.foo");
for (n = 0; n < list.length; ++n) {
    element = list[n];
    text = element.classList.contains("bar") ? " [bar]" : "[not bar]";
    element.appendChild(document.createTextNode(text));
}

이 코드에는 4개의 변수가 있다. 자세히 보면 그중 하나가 다른 세 개와 다르다는 것을 알 수 있다. 무엇이 다른지 알아볼 수 있는가?

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.