🔡 변수

---

변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름을 말한다.

간단히 말해 변수는 프로그램밍 언어에서 값을 저장하고 참조하는 메커니즘으로, 값의 위치를 가리키는 상징적인 이름이다.

🗣️ 변수 선언하기

변수를 사용하려면 반드시 선언이 필요하다.

변수를 선언할 때는 var, let, const 키워드를 사용한다.

1️⃣ var : 자바스크립트 ES6 이전까지의 선언법

var likelion = '9th';
likelion = '9기' // 재할당 가능
var likelion = 9; // 재선언 가능

2️⃣ let : 자바스크립트 ES6 이후 재할당이 가능한 선언법

let likelion = '9th';
likelion = 9; // 재할당 가능
let likelion = 'fighting'; // 변수의 재선언 불가 : Uncaught SyntaxError

3️⃣ const : 자바스크립트 ES6 이후 재할당이 불가능한 상수 선언법

const likelion = '9th';
likelion = 10; // 재할당 불가
const likelion = 'fighting'; // 변수의 재선언 불가 : Uncaught SyntaxError

• var 이후로 let, const가 나온 이유는❓

  var 키워드는 다음과 같은 특징들로 인해 주의가 필요하다

  1️⃣ 변수의 중복 선언을 허용한다.

  var x = 1;
  var y = 1;
  
  // 초기화문이 있는 변수 선언문은 자바스크립트 엔진에 의해 var 키워드가 없는 것처럼 동작한다.
  var x = 100;
  
  // 초기화문이 없는 변수 선언문은 무시된다.
  var y;
  
  console.log(x); // 100
  console.log(y); // 1

  2️⃣ 함수의 코드 블록만을 지역 스코프로 인정한다.

  var i = 10;
  
  // for 문에서 선언한 i 는 전역 변수다. 이미 선연된 전역 변수 i 가 있으므로 중복 선언된다.
  for (var i = 0; i < 5; i++) {
  	console.log(i); // 0 1 2 3 4
  }
  
  // 의도치 않게 i 변수의 값이 변경된다.
  console.log(i); // 5

  함수 레벨 스코프는 전역 변수를 남발할 가능성을 높이고, 의도치 않게 전역 변수가 중복 선언되는 경우가 발생한다.

  3️⃣ 변수 호이스팅에 의해 변수 선언문이 스코프 선두로 끌어 올려진 것처럼 동작한다.

  // 이 시점에 변수 호이스팅에 의해 이미 foo 변수가 선언된다(1. 선언 단계)
  // 변수 foo는 undfined로 초기화된다(2. 초기화 단계)
  console.log(foo); // undefined
  
  // 변수에 값을 할당(3. 할당 단계)
  foo = 123;
  
  console.log(foo); // 123
  
  // 변수 선언은 런타임 이전에 자바스크립트 엔진에 의해 암묵적으로 실행된다.
  var foo;

  변수 선언문 이전에 변수를 참조하는 것은 변수 호이스팅에 의해 에러를 발생시키진 않지만, 프로그램 흐름에 맞지 않을뿐더러 가독성을 떨어뜨리고 오류를 발생시킬 여지를 남긴다.

  ✨ 따라서 이러한 문제들을 방지하기 위해 새로운 변수 선언법인 let, const가 등장했다.

---

📌 var와 let, const 키워드는 다음과 같이 사용할 것을 권장한다.

• ES6를 사용한다면 var 키워드는 사용하지 않는다.
• 재할당이 필요한 경우에 한정해 let 키워드를 사용한다. 이때 변수의 스코프는 최대한 좁게 만든다.
• 변경이 발생하지 않고 읽기 전용으로 사용하는(재할당이 필요 없는 상수) 원시 값과 객체에는 const 키워드를 사용한다. const 키워드는 재할당을 금지하므로 var, let 키워드보다 안전하다.