자바스크립트 중급 강좌 (변수)

코딩앙마님의 강의를 보고 쓰는 글 입니당..

변수

let은 두번 선언되면 에러가 뜸

var

var color = "red"

var color = "orange"

var는 선언하기 전에 사용할 수 있다


console.log(color); // undefined 
					   선언(color)은 호이스팅 되지만 
					   할당(red)은 호이스팅 되지않음 그렇지만 error가 나는것도 아님 
var color = "red"; 

왜냐하면 

var color;
console.log(color); 
color = "red"; 이런식으로 동작하기 때문

var로 선언한 모든 변수는 최상위로 끌어 올라간 것 처럼 작동함 이걸 호이스팅 이라함 (hoisting)

let

let color = "red"

let color = "orange" error!

console.log(color); // ReferenceError 에러발생함

let color = "red"; 
					let,const둘다 호이스팅이 되지만 TDZ영역 이기때문에
                    할당 하기 전에는 사용 불가

					이유: 코드를 예측 가능하게하고 불필요한 버그를 줄일수 있음.

오류없음

let age = 30:

function showAge(){
	console.log(age);
}

showAge(); 

오류생김

let age = 30:

function showAge(){
	console.log(age);
    let age = 20;
}

showAge();  

이유 : 호이스팅은 스코프 영역에서만 이루어 지는데 스코프 영역은 
	function showAge(){
		console.log(age);
    	let age = 20; 여기까지 이기때문 
    			  	  그렇기때문에 console.log(age)가 
                  	  선언된 let age 보다 앞에 있기때문에 오류가 발생함
    

변수의 생성과정

1. 선언 단계
2. 초기화 단계
3. 할당 단계

var
1. 선언 및 초기화 단계
2. 할당 단계

let
1. 선언 단계
2. 초기화 단계
3. 할당 단계

const
1. 선언 + 초기화 + 할당

var age;
age = 30;

let name;
name = "Mike";

const gender;
gender = "male"; 여기서 const는 오류 발생 선언하면서 할당하지 않았기 때문

var : 함수 스코프(function-scoped)
let, const : 블록 스코프(block-scoped)

블록 스코프 예시
function add(){
	// block-scoped
}

if(){
	// block-scoped
}

for(let i = 0 ;i < 10 ;i++){
	// block-scoped
}

즉 코드블록 안에서 선언한 함수는 지역변수다.
여기서 말하는 코드블록은 함수, if문, for문, while문, try/catch문 등
함수 스코프는 함수안에서 선언된 애들이 지역변수가 됨

예시

const age = 30;

if(age>19){
	var txt = "성인"; if문 안에서 선언된 var는
    				  if문 밖에서도 사용 가능 (let, const는 사용 불가함)
}

consolg.log(txt); // "성인"

function add(num1, num2){
	var result = num1 + num2;
}
	add(2,3);
    
    console.log(result); // 정의되지 않았다고 나옴 (오류)
    
    이유: function(함수)안에 선언된 함수들은 밖에서 사용 불가능함.