변수에 대한 정리

변수란

//var 변수이름 = 저장할 값
var 이름 = 'Kim';

//사용
이름

이렇게 사용하며, 자료를 저장하는 임시공간을 의미한다.

ES6이 되면서 let과 const가 생겨났다.

선언, 할당, 범위에서 차이가 있는데,

재선언이란 var 이름 ~ 을 쓰고 또, var 이름 ~ 을 쓰는 것이다.

재할당이란 var 이름 ~ 을 쓰고, 밑에서 이름 = ~을 쓰는 것이다.

 

var 은 재선언가능 / 재할당가능 / 범위function안에서만 존재

let 은 재선언불가능 / 재할당가능 / 범위 { }안에서만 존재

const 은 재선언불가능 / 재할당불가능 / 범위 { }안에서만 존재

 

그래서 const는 변하지 않는 값을 넣으면 좋다.

그리고 오브젝트 내부 값은 변경해도 에러가 나지 않는다. 이건 재할당으로 취급하지 않는다. 그래서 완전 변경불가능한 오브젝트를 만들고 싶으면, Object.freeze(오브젝트이름) 이렇게 써주면 바꿀 수 없다.

 

이제, 변수의 Hoisting현상에 대해 알아보자.

Hoisting현상이란 변수의 선언을 변수 범위 맨위로 끌고오는 현상을 얘기한다. 

즉, 변수를 만나면 선언부분을 강제로 맨 위로 올린다.

console.log(나이);

var 나이 =30;

console.log(나이);

위처럼 적으면 undefined와 30이 나온다. 변수가 선언이 되어있고, 아직 값이 할당되진 않았다는 뜻이 된다.

 

만약, let, const를 Hoisting하면 undefined가 할당되지 않으며,

temporal deadzone이나 uninitialized라는 에러가 뜨게 된다.

 

그리고 함수를 변수로 만들게 된 후, hoisting을 하면,

함수();

var 함수 = function() {
	console.log('안녕')
}

함수의 선언만 hoisting이 되기 때문에, 함수가 함수가 아니라고 에러가 난다.

 

 

만약, 변수를 동시에 여러개 만들고 싶으면,

var 나이 = 20,  이름 = 'ㅁ';

이렇게 동시에 만들 수 있다.

 

이번엔, 전역변수에 대해 알아보자.

전역변수는 모든 곳에서 쓸 수 있는 변수를 뜻한다.

var 나이 = 20;

function 함수() {
	console.log(나이);
}
함수()

이렇게 사용하면 바깥의 변수는 안에서 자유롭게 사용할 수 있다. 하지만 역으로 함수안에서 만들면 바깥에서 사용할 순 없다. 이런 변수를 지역변수라고 한다.

즉, 가장 바깥에 만들어놓은 변수를 전역변수라고 한다.

그리고 window.이름 = '김' 이렇게도 전역변수를 만들 수 있다. 이렇게 만들면 눈에 띄어 더 낫다고 한다.

만약,

let a = 1;
window.a = 4;
console.log(a);

이렇게 let과 window의 성격이 다른데 사용하면, 범위가 작고 가까운 1을 참조해서 사용하게 된다. 

자바스크립트는 변수를 사용할 때 주변에 없으면 상위 중괄호로 시선을 돌리면서 참조하기 때문이다.