[노트내용정리] 변수

📌 변수란?

• 변수 (variable) : 데이터를 담는 공간. 
• 데이터를 담아주기만 할 뿐,  담겨져 있는 실체는 변하지 않는다.
• 변수는 화살표로 값을 가르킨다고 생각하자! (변수 → 값)
• 변수는 선언 ➡️ 초기화 ➡️ 할당 단계를 거친다.
  * 변수 선언: 변수를 생성(등록) 하는 것. 
  * 변수 초기화: 변수저장을 위해 공간을 확보하는 것. 기본으로는 undefined가 할당. 
  * 값 할당: 할당연산자( = )를 통해 값을 할당하는 것. undefined로 초기화된 변수에 실제 값을 할당한다.
  

 

📌 변수의 생성

1. 변수를 만드는 키워드 ( var, let, const )

	변수  재선언	값(데이터)의 재할당	스코프(울타리) 영역	선언 & 초기화 & 할당
var	⭕	⭕	함수 레벨 스코프	선언과 초기화가 동시에 실행된다.
let	⭕	❌	블록 레벨 스코프	선언과 초기화가 분리되어 실행된다.
const (상수)	❌	❌	블록 레벨 스코프	선언과 초기화와 할당이 동시에 실행된다.

 

var a;   // 선언 -> 초기화
console.log(a); // undefined. 

// 할당
a = 1;
console.log(a); // 1

// 선언과 할당을 동시에
var a = 1;

( * var 되도록 사용하지 않는 것을 권장함. 재선언, 재할당 모두 가능하고, 블록레벨스코프로 블록을 벗어나도 함수내에만 있으면 실행되기 때문에 의도치 않은 부분에서 실행될 가능성이 있음.)

 

 

함수 레벨 스코프(Function-level scope) - var

• 함수 내에서 선언된 지역변수는 함수 내에서만 유효하다.
• 함수 외부에서는 참조 불가.

블록 레벨 스코프(Function-level scope) - let, const

• 코드 블록 내에서 선언된 지역변수는 코드 블록 내에서만 유효하다. 
• 코드 블록 외부에서는 참조 불가하다.
• 코드 블록 내에서 선언한 변수는 지역변수이다.

 

let

• 값이 언제든지 변경될 수 있는 변수를 선언할 때 사용. (재할당이 가능하기 때문에)
• 선언된 블록 레벨 스코프 (코드 블록) 내부에서만 유효하고, 코드블록 외부에서는 접근할 수 없다.
• 선언과 초기화 단계가 분리되어 실행된다.

console.log(b) // Uncaught ReferenceError: b is not defined
               // (선언과 초기화 단계 사이에 변수를 참조했기 때문에 에러발생)
let b; // 선언 -> 초기화
console.log(b) // undefined


let a = 1
function scope() {
 let a = 2
 console.log(a)
}

scope()   //2. 코드블록 내에서만 유효함.

 

const

• 값이 한 번 할당되면 변경될 수 없는 상수를 선언할 때 사용. (재할당이 불가능하기 때문에)
• let과 같이 선언된 블록 레벨 스코프 (코드 블록) 내부에서만 유효하고, 코드블록 외부에서는 접근할 수 없다.
• 선언과 초기화, 할당이 동시에 이루어진다.

const c; // Uncaught SyntaxError: Missing initializer in const declaration
         // (선언만 불가능)
const c = 1; // 선언, 초기화, 할당

💡 JS에서는 const 사용을 권장한다.
1. 의도하지 않은 값의 변경을 방지할 수 있고,
2. 다른 개발자들이 변수의 값이 변경될 가능성이 없다는 것을 빠르게 인지할 수 있으며,
3. 반드시 초기화를 해야하기 때문에 어떤 데이터가 사용되는지 초기에 확인 할 수 있기 때문이다.

* 그러나 +, - 같은 연산자에 의해 값이 변해야 하는 경우에는 let 을 사용해야 한다.

 

2. 변수명 짓기 규칙

• 변수 이름은 알파벳(대문자와 소문자), 숫자, 언더스코어(_)로 구성
• $, _ 를 제외한 공백, 특수문자, 구두점(글의 여러 가지 경계를 구분하기 위해 사용되는 반점(,), 온점(.), 물음표(?) 등등…)을
  사용할 수 없다.
• 변수 이름은 숫자로 시작할 수 없다. (e.g. 100test ❌)
• 키워드(e.g. if, else, while 등), 예약어(e.g. class, boolean 등)는 변수 이름으로 사용할 수 없다.
• 변수 이름은 대소문자를 구분한다. (e.g. 'name', 'Name', 'NAME' 은 각각 전부 다른 변수)

변수 이름의 표기법

1. 스네이크 케이스: 띄어쓰기 대신 _ (언더스코어)로 연결해 표기하는 방법.
* e.g. user_name = '가나다';
* 주로 html,css에서 사용

2. 카멜 케이스: 언더스코어 대신 중간문자를 대문자로 표기하는 방법. (시작 글자는 소문자)
* e.g. userName = '가나다';

3. 파스칼 케이스: 카멜케이스와 비슷하나 모든 단어에 앞 문자를 대문자로 표기하는 방법.
*e.g. UserName= '가나다';