반응형
호이스팅이란?
hoist는 영어로 끌어올리다는 뜻입니다.
호이스팅은
변수와 함수를 선언할 때,
자신의 스코프 최상단으로 끌어올려서
어디서든 볼 수 있도록 하는것을 호이스팅이라고 합니다.
호이스팅 예시 1
add(1, 2); // 3
function add(a, b) {
return a + b;
}
위와 같이 add 함수를 아래에서 만들어도 호이스팅이 되어서 위에서 실행될 수 있습니다.
minus(2, 1); // Uncaught TypeError: minus is not a function
var minus = function(a, b) {
return a - b
}
단 변수에 함수를 담게 되면 에러가 발생 됩니다
에러가 발생하는 이유는 변수의 경우에는 선언과 초기화가 구분이 되어 있습니다.
console.log(a); //undefined
var a = 5;
변수의 경우에는 선언과 초기화가 동시에 이루어지지 않고, 호이스팅에 의해 참조만 가능하고, 실행은 불가능합니다.
언제 호이스팅 사용하면 좋을까?
button.addEventListener('click', function() {
login();
function login() {
// to do something;
}
})
예를 들어 복잡한 비즈니스 로직을 구현할 때,
복잡한 함수가 최상단에 위치하게 되면 코드를 읽을 때, 혼란이 올 수 도 있습니다.
그럴 경우에 복잡한 로직의 함수들을 아래로 구현하게 되면 로직을 파악하는데 도움을 줄 수 있습니다.
728x90
반응형