5.Scope(스코프), 코드의 범위란?

자바스크립트는 크게 두가지 Scope 개념이 있다.

1. 블록 레벨 스코프(block-level scope)
2. 함수 레벨 스코프(function-level scope)

코드로 작성하게 된다면

{
    console.log("{} 내부가 하나의 지역(범위)이다.")    
}

{스코프}를 object와 착각하면 안된다!
{}는 = 연산자와 같이 사용할 때만 object가 되는 것이다.
그 외에는 지역을 나타낸다!

스코프, 어떻게 사용해야 하는가?

우리는 이전에 변수를 선언하는 방법을 알아보았다.
어째서 var를 사용하지 말라고 적어놨는지, 그 이유가 여기서 나온다.

자바스크립트는 기본적으로 함수 레벨 스코프를 지원하는데 그것이 var다.
ECMAScript 6 통칭 ES6 표준이 나온 이후 let,const 가 추가되는데, 이를 사용하면 블록레벨 지역 변수를 사용할 수 있다.

블록 레벨에 변수 선언 (지역변수) == let,const
함수 레벨에 변수 선언 (전역변수) == var

간단한 예시로 알아보자

블록 레벨

1.스코프에서 밖으로는 X

아래 코드를 실행해보자

{
  const a = 1;
}
console.log(a);

a를 찾을 수 없다는 에러가 발생한다.

console.log 명령어가 {} 바깥에 있기 때문이다.

2.스코프 안에서는 O

{
  const a = 1;
  console.log(a);
}

콘솔 로그를 스코프 안에 작성해주니 콘솔에 잘 나온다.

3.밖에서 스코프 안으로는 O

const a = 1;
{
  console.log(a);
}

4.같은 이름의 변수가 있다면?

const a = 1;
{
  const a = 2;
  console.log(a);
}

지역변수 안에 선언된 변수를 우선 하여 참고한다.

블록 레벨의 기본적인 개념은 여기까지다.
let, const를 사용해 지역 변수를 작성한다면 {}를 벗어난 코드에 영향을 주지 않는다.

함수 레벨

우리 자바스크립트의 문제아 var
let,const는 지역{} 까지 올라가다가 더이상 영향을 주지 않는다면
var는 함수 까지 올라가다가 더이상 영향을 주지 않는다.

지역을 벗어나도 console 명령어에 a가 유효한 값을 나타내고 있는게 보이는가?

a 라는 이름의 함수 를 작성하니 var로 선언한 b는 함수 안에서는 참조가 되지만, a를 벗어난 순간 더이상 참조할 수 없다.

즉 var를 함수 안에 선언하지 않으면 window에 선언되는데
이를 전역 변수(어디서든 참조할 수 있는) 라고 한다. (현재 b는 a() 안에 있으므로 지역변수다)
그러므로 var는 의도치 않은 재할당에 의해 코드를 예측하기 어렵게 만드므로 사용을 자제한다!

함수는 다음 포스트에