함수 표현식

Featured image

함수 표현식이란?


함수를 변수에 할당하여 정의하는 방법으로, 전통적인 함수 선언 구문을 사용하는 대신 함수 표현식을 사용하면 즉시 함수를 생성하며 값으로 할당가능함.

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!

이 문제는 함수가 사용되기 전에 함수 표현식이 오는지 확인하면 해결됨.