05-2 let과 constant로 변수 선언 하기

앞서 잠깐 설명했던 let과 constant에 대해 설명하도록 하겠다

변수 적용 범위

자바스크립트에서 변수를 선언, 사용할 때 적용되는 범위
(= 변수가 어디까지 유효한지) 를 Scope라고 한다.

로컬 변수 / 지역 변수

• 한 함수 안에서만 사용할 수 있는 변수
  - 함수 안에서만 선언하고, 사용해야 한다.

  var myVar = 100;
  		test();
  
  		document.write("myVar is " + myVar);
  function test( ) {
  var myVar = 50;
  }

  

test 함수 안에서 myVar를 지역변수로 선언했지만,
test 함수를 벗어나는 순간 지역 변수 값은 무효가 되기 때문에
전역 변수 값인 100이 출력됨

※ 함수 안에서 선언해도, var를 붙이지 않으면 전역 변수로 선언됨

글로벌 변수 / 전역 변수

• 어느 함수에서나 모두 사용할 수 있는 변수
  - 한번 선언하고 나면, 계속해서 값을 유지한다.

var myVar = 100;
test();
document.write("myVar is " + myVar);

function test() { 			
	myVar = 50;
}

test 안에서 전역 변수를 선언했기 때문에
마지막 전역 변수 값인 50이 출력됨

var를 이용한 변수의 특징

※ 호이스팅 : 상황에 따라 변수의 선언과 할당을 분리해서 선언 부분을 스코프 가장 위쪽으로 끌어올린다.
→ 변수를 선언하기 전에 변수를 사용해도 오류가 생기지 않는다.
하지만, 할당된 값은 적용되지 않는다.

var x = 100;

test();

function test() { 			
	document.write("x is " + x + ", y is " + y);
  var y = 200;
}

let과 const를 이용한 변수의 특징

ES6부턴 let과 const가 추가되었고, let 사용을 권장한다.
var과 let,constant의 가장 큰 차이는 scope의 범위이다.
var : 함수 영역의 스코프
let, const : 블록 영역({}) 의 스코프

let

1. { } 안에서만 유효하고, 블록을 벗어나면 사용할 수 없다.

function calcSum(n) {
  let sum = 0;  // 블록 변수

 for(let i = 1; i < n + 1; i++) {
    sum += i;
  }
  console.log(sum);  // 블록 변수 사용
}
>
>calcSum(10);

sum과 i는 블록을 벗어나면 사용할 수 없다.

2. 재할당은 가능하지만 재선언은 할 수 없다.

unction calcSum(n) {
  let sum = 0;
  for(let i = 1; i < n + 1; i++) {
    sum += i;
  }  
  let sum;  // 변수 재선언
  console.log(sum);
}
calcSum(10);

3. 호이스팅이 없는 변수이다.
   var과 달리, 선언하기 전에 사용할 경우 오류가 발생한다.

const

1. { } 안에서만 유효하고, 블록을 벗어나면 사용할 수 없다.

2. 재할당은 가능하지만, 재선언은 할 수 없다.

3. 상수 값을 선언할 때 사용한다. (프로그램 내에서 변하지 않는 값)

자바스크립트 변수를 이용할 땐

• 전역 변수는 최소한으로 사용한다
• var 변수는 함수의 시작 부분에서 선언한다
• for문에서 카운터 변수를 사용할 때는 블록 변수를 사용하는 것이 좋다
• ES6을 사용한다면, 예약어 var보다 let 사용을 권장한다