no.9 - JS 호이스팅
호이스팅(Hoisting)
코드에 선언된 변수 및 함수를 코드의 유효범위의 최상단으로 끌어 올리는 것
- 전역 스코프인지 함수 스코프인지에 따라 다르게 수행된다.
- 함수 내에서 선언된 함수 스코프 변수는 해당 함수의 최상위
- 함수 밖에서 선언된 전역 범위(global scope)는 스크립트의 최상위
호이스팅의 대상
var 변수와 함수 선언문에서만 호이스팅이 발생한다.
let과 const는 호이스팅이 발생하지 않는다.
변수 호이스팅
console.log(a); undefined
var a = "hoisting";
console.log(a); 'hoisting'
코드에 선언된 변수 및 함수를 코드의 유효범위의 최상단으로 끌어 올리는 것
- 전역 스코프인지 함수 스코프인지에 따라 다르게 수행된다.
- 함수 내에서 선언된 함수 스코프 변수는 해당 함수의 최상위
- 함수 밖에서 선언된 전역 범위(global scope)는 스크립트의 최상위
var 변수와 함수 선언문에서만 호이스팅이 발생한다.
let과 const는 호이스팅이 발생하지 않는다.
console.log(a); undefined
var a = "hoisting";
console.log(a); 'hoisting'
변수 선언이 최상단으로 끌어 올려졌기 때문에 console.log의 값이 다르게 나옵니다.
var a = "hoisting"; 이 구문이 var a를 호이스팅 하기 때문에 undefined로 처리됩니다.
함수 호이스팅
foo();
function foo(){
console.log('hoisting')
}
> hoisting
foo 함수의 선언을 global scope의 상단으로 호이스팅하기 때문에 hoisting이 출력됩니다.
foo();
var function foo(){
console.log('hoisting')
}
> Syntax Error!
이와 같은 함수 표현식의 경우는 호이스팅이 발생하지 않기 때문에 에러가 발생합니다.
호이스팅 주의점
코드의 가독성과 유지보수에 있어 혼란을 방지하기 위해 호이스팅이 일어나지 않도록 한다.
- 변수는 let과 const를 사용합니다.
Author And Source
이 문제에 관하여(no.9 - JS 호이스팅), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@playck/TIL-no.9-JS-호이스팅이란저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)