[javascript] 호이스팅(hoisting) 과 console.log 디버깅

이준규·2022년 3월 8일
0

자바스크립트

목록 보기
4/6
post-thumbnail

JavaScript에서 호이스팅(hoisting)이란, 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미합니다. var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화합니다.

변수 선언 코드를 최상단으로 옮기는 것임

var로 선언한 변수는 호이스팅 되며 올라가며 undefined로 초기화됨


초기화 해줘도 소용없음
선언 자체만 호이스팅 하기 때문


선언없이 초기화만 존재하면 ReferenceError가 나옴


반면 let 변수는 호이스팅되지만 초기화 하기전에는
읽거나 쓸 수 없다.

호이스팅되어도 초기화가 되지않아서

레퍼런스 에러가 나오게 되는거임

"시간상 사각지대"(Temporal Dead Zone, TDZ)
라는 게 있는데 let 변수가 스코프 맨 위부터 초기화 완료되는 시점까지라고 하는데 이 때 let 변수를 접근하면 에러가 나오게 되는거임

결론적으로

var 변수를 안쓰고 let, const 를 스코프 최상단에 잘 초기화해서 써주면 문제가 없는 거 같고 가독성도 좋을 거같다.


console.log로 콘솔에서 찍어보며 디버깅 할 때가 많은데

당연히 a 는 차례로 {} {a:1} 이되는데
콘솔에서 찍어보면

둘다 {a:1}

console.log는 참조를 로깅하기 때문에
내용이 변할 수 있는 객체(배열 포함)는 실시간으로 바뀐다고 보면됨

결국 객체는 로깅하지 않는게 좋음 console.log

혹은 나는 arr 가 아닌 arr.length 를 찍어보는걸 선호함

깊은 복사를 통한 로깅도 답은 될 수 있지만 비용이 많이 듭니다.


자바스크립트 배열 깊은 복사(주소를 달리함) 방법
옅은복사 (주소 공유) arr = arr1

let arr1 = arr.slice();
profile
백엔드

0개의 댓글