3 min to read
함수 표현식
함수 표현식이란?
함수를 변수에 할당하여 정의하는 방법으로, 전통적인 함수 선언 구문을 사용하는 대신 함수 표현식을 사용하면 즉시 함수를 생성하며 값으로 할당가능함.
let multiply = function(x,y){
return x * y;
};
console.log(mulityply(5,10)); // output :50
위처럼 익명일수도 있음.
let factorial = function fact(n){
if(n === 0 || n === 1){
return 1;
}
else{
return n * fact(n - 1);
}
}
console.log(factorial(4)); //output : 24
함수 표현식은 다른 함수에 대한 인수, 다른 함수 본문 내, 객체 속성 값 등 함수를 쓰는 모든 곳에서 사용가능.
함수 표현식의 장점?
- 할당가능성: 변수에 쉽게 할당되므로 다른 함수에 인수로 전달하거나 데이터 구조에 저장하거나 다른 변수 할당 가능.
- 익명 함수: 지정된 이름이 없는 익명 함수를 포함하는 경우가 많아 콜백을 생성하거나 함수를 즉시 호출하는 경우와 같이 이름으로 함수를 참조할 필요가 없을 때 유용함.
- 캡슐화: 함수 표현식을 사용하면 변수 내 기능을 캡슐화할 수 있음. 비공개 함수 및 클로저를 만들 수 있음.
- 동적 동작: 런타임에 평가 되기에 동적 동작이 포함된 함수를 생성할 수 있음. 특정 조건에 따라 변수에 조건부로 다른 기능을 할당하거나 런타임에 기능을 수정할 수 있음.
함수 표현식과 함수 선언
함수 표현식과 함수 선언은 서로 다른 JS 환경에서 호이스팅 되고 처리되는 방식에 약간 차이가 있음.
함수 선언은 자동으로 전역 스코프의 일부가 됨. 즉 전체 프로그램에서 사용할 수 있으며 프로그램의 전체에서 사용 가능 및 전체 수명 동안 사용 가능함을 의미함. 일반적으로 특정 이유로 전역 스코프의 일부가 되면 안되는 함수가 필요할 때가 있음. 함수 표현식은 함수 스코프를 더 잘 제어할 수 있음.
greetUser("Steven"); // output: Hello, Steven!
greetUser("Samantha"); // output: Hello, Samantha!
functiion greetUser(name){
console.log("Hello," + name + "!");
}
함수 선언이 호이스팅이 된다는 걸 우리는 알고 있음. 즉, 선언된 전체 스코프에서 함수에 엑세스 가능함. (함수 선언 전에 함수 호출이 가능)
greetUser("Steven"); //error
greetUser("Samantha"); //error
let greetUser = function(name){
console.log("Hello, " + name + "!");
}
함수 표현식은 변수에 할당된 후에만 엑세스 가능하며, 호이스팅할 수 없음. 이는 함수 표현식을 사용하는 동일 코드가 작동하지 않음을 의미함.
let greetUser = function(name){
console.log("Hello, " + name + "!");
}
greetUser("Steven"); // output: Hello, Steven!
greetUser("Samantha"); // output: Hello, Samantha!
이 문제는 함수가 사용되기 전에 함수 표현식이 오는지 확인하면 해결됨.