1. 변수
mdn 공식 문서
let 명령문은 블록 스코프의 범위를 가지는 지역 변수를 선언하며, 선언과 동시에 임의의 값으로 초기화할 수도 있습니다.
즉, 변수는 가지고 있는 값을 다른 값으로 변경할 수 있다.
아래와 같이 변수 x=10 으로 선언하고, 줄바꿈 하면서 각각 다른 값으로 재할당해주었다.
맨 마지막으로 x에 객체를 선언해주었으므로, 최종적으로 x의 값은 {name:"jihye"} 이다.
변수나 상수는 마지막에 넣은 값을 저장하기 때문에 맨 마지막으로 재할당해준 값으로 저장된다.
let x=10;
x=15;
x="hi";
x={name:"jihye"}
console.log(x) //{name:"jihye"}2. 상수
mdn 공식 문서
const 선언은 블록 범위의 상수를 선언합니다. 상수의 값은 재할당할 수 없으며 다시 선언할 수도 없습니다. 상수는 let 문을 사용하여 정의된 변수와 마찬가지로 블록 범위(block-scope)입니다. 상수의 값은 재할당을 통해 바뀔 수 없고 재선언될 수 없습니다.
상수는 같은 범위의 상수 또는 변수와 그 이름을 공유할 수 없습니다.
상수는 최초 만들어질 때 단 한 번만 값을 넣을 수 있고, 그 이후에는 값을 바꿀 수 없다.
let x=10;
const y=200;
x=200;
y=500;
x=300; 상단과 같이 코드를 짜고, 디버깅을 확인해보면 "y=500" 으로 재할당하면 ReferenceError가 뜨면서 코드 실행은 종료된다. 즉, y는 상수이기 때문에 실제로 다른 값으로 바꿀 수 없기 때문!!
만일 상수에 object 값을 선언할 경우 어떻게 될까?
const obj={
name:"jihye",
age:10
};
obj.age=20; 상단과 같이 obj=객체를 선언 후, obj.age 에 접근하여 값을 재할당하면 age는 10이 아닌 20으로 재할당이 가능하다. obj는 상수인데 왜 속성 값은 재할당이 가능할까?
그것은 바로 상수의 영향 범위가 객체 자체로 한정되기 때문이다.
즉, 상수 obj=object 이므로 object 자체를 다른 값으로 바꾸지 말란 것이지, object의 속성까지는 관여하지 않는다. 따라서 속성 값은 언제든지 수정이 가능하고, 만일 obj를 다른 값(obj={} 혹은 obj=[])으로 변경하면 런타임 에러가 뜨면서 어플리케이션은 종료된다.
3. 변수 var
상수가 나오기 전, var 라는 명령어를 이용해 변수를 선언하였다.
어디에 선언이 되어있든 간에 변수들은 어떠한 코드가 실행되기 전에 처리가 됩니다. var로 선언된 변수의 범위는 현재 실행 문맥인데, 그 문맥은 둘러싼 함수, 혹은 함수의 외부에 전역으로 선언된 변수도 될 수 있습니다.
선언된 변수들의 값 할당은 할당이 실행될 때 전역변수(이것은 전역 오브젝트의 프로퍼티가 됩니다)처럼 생성이 됩니다.
var 호이스팅
var을 이용하여 변수를 선언하면 어디에서 선언하든 최상위에 선언한 것과 같다.
즉, 변수가 선언되기 전에 사용 될 수 있다는 뜻이다. 변수 선언이 함수 또는 전역 코드의 상단(전연 코드의 최 상단)에 이동하는 행동을 "호이스팅(hoisting)"이라고 한다.console.log(a) //undefined var a = 1; console.log(a) //1 // a라는 변수가 선언되기 전에 콘솔에 a를 찍으면, 에러가 아닌 undefined 값이 반환된다. // a 변수 선언 후, 다시 console에 a를 찍으면 1이 정상적으로 반환for(var i = 0; i < 5; i ++){ console.log(i); //1, 2, 3, 4 반환 } console.log(i); //5 반환 //var 변수는 함수를 제외한 모든 영역에서 호이스팅일 일어난다.
var 변수 재 선언
var는 한 번 선언이 되었더라도 재 선언이 가능하다.
var a = 1; var a = 2; console.log(a) // 2 반환var a = 2 function foo(){ var b = 1; } console.log(b) // ReferenceError => b가 정의되지 않음. //이와 같이 var 는 함수 내에 선언되었기 때문에 함수 밖에서는 사용할 수 없음
4. 마무리
변수는 값이 변한다는 뜻으로 변하는 값을 다루기 위하여 변수를 사용하는데 값이 변경된다는 자체가 굉장히 불안정성을 내포하고 있다.
퍼블리셔로 근무하면서 let과 const는 알지 못 한채 모든 변수는 var로 선언했었는데 var가 옳지 못 한 선언 방식이었다니 ..😟
프론트엔드 개발 과정을 통해서 let과 const 차이점을 분명히 알게 되었고, 쓰임 목적에 따라 올바르게 선언하는 방식을 배웠다. 값이 바뀌지 않을 경운 대부분 상수를 사용하고, 되도록 값이 변하지 않는 구조로 프로그래밍 하는 습관을 갖자 !!
