자바스크립트로 프로그래밍 입문 16. 변수2-지역변수, 전역변수, 스코프

아래 코드를 실행하면 어떤 값이 나올 지 생각해 봅시다.

var a=1;

function printA(){
  console.log(a);
}

printA();

변수 a를 선언하여 1을 대입하였고, printA함수는 a를 출력하므로 1이 출력됩니다.

하지만 아래와 같이 변수 선언을 함수 안에서 했다면, 함수 밖에서는 해당 변수를 호출할 수 없습니다.

function printB(){
  var b=2;
  console.log(b);
}

printB();
console.log(b);

위 함수를 실행하면 printB에 의해서 2가 출력되지만, 함수 밖의 console.log(b)는 'b is not defined'라는 에러를 냅니다.

b는 함수 안에서 선언되었으므로, 함수 밖에서 b를 호출하려고 하니 b가 뭔지 모르겠다 라고 하는 에러입니다.

만약 변수가 함수 안에도 있고 밖에도 있으면 어떨까요?

var c=3;

function printC(){
  var c=4;
  console.log(c);
}

printC();
console.log(c);

printC()는 함수 안의 c의 값인 4를 출력하고, console.log(c);는 함수 밖의 c의 값인 3을 출력합니다.

이것은 함수 밖의 c와 함수 안의 c의 스코프(scope)가 다르기 때문입니다. scope는 범위라는 뜻으로, 여기에서는 변수의 적용 범위라는 뜻으로 생각하면 되겠습니다. 함수 안에서 생성된 변수는 지역 변수(local variable)이라고 하고 적용범위가 함수 안으로만 한정이 됩니다. 함수 밖에서 생성된 변수 전역 변수(global variable)이라고 하며 어디서든 호출할 수 있습니다. 변수 이름이 전역 변수에도 해당하고 지역 변수에도 해당하는 경우, 지역 변수가 우선 호출됩니다.

var d=5;

function someFunc1(){
  var e=6;
  // 어떤 일을 하는 코드
}

function someFunc2(){
  var f=7;
  // 어떤 일을 하는 코드
}

위와 같은 코드가 있을 때, d는 전역변수로 someFunc1안이나, someFunc2안에서도 호출될 수 있습니다. 하지만 e는 someFunc1 함수의 스코프에 있기 때문에, 자신의 스코프 밖인 함수 밖이나 someFunc2에서는 호출될 수 없습니다. 마찬가지로 f도 같은 이유로 함수밖이나 someFunc1에서 호출될 수 없습니다.