JS_기록

호근·2023년 1월 4일
0

JS

목록 보기
1/2

자바스크립트는 타입추론을 지원한다.

변수 선언 방식

var 변수명; => es6이전
let 변수명; => es6이후 변수 선언 방식
const 변수명; => es6이후 상수 선언 방식

var를 사용하기 껄끄러운 이유

변수 호이스팅이 발생하기 때문이다.
es6의 letconst의 등장 이전,
변수의 선언을 var를 사용해야만하던 호랑이 담배피던 시절. . .
변수의 유효범위는 Global Scope와 Function Scope로만 존재했다.

함수밖에 선언된 변수는 모두 전역변수가 되어버렸기 때문에 코드를 읽어야하는 입장에서는 가독성이 떨어질 수 밖에 없었다.

console.log(`a : ${a}`); //  undefined !호이스팅
var a = 1;
function variableEx(){
	console.log(`a : ${a}`); // undefined
 	var a = 2;
  	console.log(`a : ${a}`); // a : 2
  	
  
}
console.log(`a : ${a}`); // a : 1 

변수와 함수의 선언만 해당 스코프의 최상단으로 끌어올려지는 것이 호이스팅이다.

Execution Context의 단계를 나누어 설명하자면
1. 선언 : 변수를 실행 컨텍스트의 변수객체에 등록
2. 초기화 : 변수 객체에 등록된 변수를 위한 메모리 공간 확보,(이 때 undefined로 초기화) 메모리가 할당되면 참조를 통해 변수로 접근가능
3. 할당 : 사용자가 정의한 값을 변수에 초기화

즉, var키워드로 변수를 생성할 경우, 선언과 초기화단계가 동시에 일어난다.
사용자가 지정한 값이 변수에 초기화 되기 직전단계에서 실행컨텍스트가 undefined로 초기화했기 때문에 저꼴이 나는 것이다.

CallStack의 실행순서,Execution Context, Lexical Scope를 잘 이해하면 이해에 무리가 없을듯
호이스팅에 대해 완벽히 이해하려면 Execution Context의 생성과정에 대한 깊은 이해가 필요해보인다..

profile
22.11.28 ~

0개의 댓글