Hoisting, parameter vs argument

1. Hoisting 이란? TDZ란?

Hoisting은 JavaScript에서 변수와 함수 선언을 위쪽으로 끌어올리는 것을 의미합니다. 변수와 함수 선언이 스코프 내에서 정의된 위치와는 상관없이 스코프의 최상단으로 끌어올려지며, 이후에 선언된 코드에서도 해당 변수와 함수를 참조할 수 있습니다. 이는 var로 선언된 변수와 함수 선언문(function declaration)에 해당합니다. 반면 let과 const로 선언된 변수, 함수 표현식(function expression)은 hoisting이 발생하지 않습니다.

console.log(x); // undefined
var x = 5;

변수 x가 선언되기 이전에 console.log(x)를 실행하면 undefined가 출력됩니다. 이는 var x가 hoisting되어 스코프의 최상단으로 끌어올려졌기 때문입니다.

 

-> 변수와 함수의 선언문을 위쪽으로 끌어올린다. 

 

TDZ(임시적 사각지대, Temporaral Dead Zone)는 let과 const 등 선언된 변수들이 선언되기 전에 사용되는 것을 막는 일종의 메커니즘입니다. TDZ는 hoisting과는 다르게 변수 선언을 스코프의 최상단으로 끌어올리지 않습니다. 대신, 선언 이전에 변수에 접근하려고 할 때 참조 오류(reference error)가 발생합니다. 따라서, let과 const는 hoisting이 발생하지 않지만, TDZ가 존재합니다.

console.log(x); // ReferenceError: x is not defined
let x = 5;

변수 x가 선언되기 이전에 console.log(x)를 실행하면 ReferenceError가 발생합니다. 이는 TDZ로 인해 변수 x가 선언되기 전까지는 접근할 수 없기 때문입니다.

2. parameter와 argument의 차이

함수에서 parameter(매개변수)는 함수 선언 시 함수 내부에서 사용될 변수를 정의하는데 사용되는 변수명입니다. 즉 함수를 정의할 때 함수가 받을 인자를 선언하는 부분입니다. 함수를 정의할 때 매개변수를 정의하면, 해당 함수가 호출될 때 인수(argument)를 전달받을 수 있습니다.

예를 들어, 다음과 같은 함수를 정의하면:

function multiply(a, b) {
  return a * b;
}

a와 b는 함수의 매개변수입니다. a와 b는 함수 내에서 사용될 변수명으로, 함수 호출 시 전달되는 인수(argument)를 받아들입니다.

반면, argument(인수)는 함수를 호출할 때 함수에 전달되는 값입니다. 함수 호출 시 매개변수(parameter)에 해당하는 값을 전달하면, 해당 값은 함수 내에서 매개변수의 값으로 사용됩니다.

예를 들어, 위에서 정의한 multiply 함수를 호출하면:

multiply(2, 3);

2와 3은 함수 호출 시 전달하는 인수(argument)입니다. 이 값들은 multiply 함수 내부의 a와 b 매개변수에 각각 할당되어 함수 내부에서 사용됩니다.