함수표현

함수표현식

let sayHello = function(){
    console.log('Hello');
}

sayHello();

함수선언문

function sayHello(){
    console.log('Hello');
}

sayHello();

함수선언문은 어디서든 호출이 가능하다.

sayHello();

function sayHello(){
    console.log('Hello');
}

자바스크립트는 실행 전 초기화 단계에서 코드의 모든 함수를 생성해두기 때문에 코드 위치보다 위에서 호출이 가능하다. 이것을 호이스팅(hoisting)이라고 한다.

화살표함수

let add = function(num1, num2){
    return num1 + num2;
}

위 함수를 화살표함수로 바꾸면

let add = (num1, num2) => {
    return num1 + num2;
}

코드 본문이 한줄이고 return문이 있기 때문에 다음과 같이 return 생략 가능

let add = (num1, num2) => (num1 + num2);

return문이 한줄이라면 괄호 생략 가능

let add = (num1, num2) => num1 + num2;

---

let sayHello = function(name){
    return `Hello, ${name}`;
}

let sayHello = (name) => {
    return `Hello, ${name}`;
}

let sayHello = (name) => `Hello, ${name}`;

인수가 하나라면 괄호 생략 가능

let sayHello = name => `Hello, ${name}`;

let showError = () => {
    alert('error!')
}

인수가 없는 함수는 괄호 생략 불가능

return문 전에 여러 줄의 코드가 있다면 일반 괄호 사용불가

let add = function(num1, num2){
    const result = num1 + num2;
    return result;
}

예문

        // 함수선언문

const sayHello = function(name){
   const msg = `Hello, ${name}`;
   console.log(msg);
}
sayHello();

        // 화살표함수

let sayHello = (name) =>{
   const msg = `Hello, ${name}`;
   console.log(msg);
}
sayHello();

예문2

        // 함수선언문

const add = function(num1, num2){
    const result = num1 + num2;
    return console.log(result);
}

add(1, 3); // 4

        // 화살표함수

const add2 = (num1, num2) => console.log(num1 + num2);
add2(1, 2); // 3