[JS] 함수 표현식 & 화살표 함수 & 콜백함수

함수 표현식

• 함수 선언식 : 이때까지 일반적으로 함수를 선언하던 방식

function func() {

    console.log("hello world");
    
}

 

• 함수 표현식

let func = function () {

    console.log("hello world");
    
};

함수 선언식 vs 함수 표현식

• 함수 선언식은 호이스팅에 영향을 받지만 함수 표현식은 호이스팅에 영향을 받지 않는다. (https://hongcode.tistory.com/68)

[JS] 스코프와 호이스팅

 

func(); // hello world -> 호이스팅으로 인해 함수가 잘 동작함

function func() {

    console.log("hello world");

}

 

func(); //error

let func = func () {

    console.log("hello world");
    
};

 

• 함수 표현식은 호이스팅의 대상에 해당되지 않기 때문에, 함수 표현식을 실행하는 순서가 되었을 때 함수를 생성하게 됨.
• 함수 표현식으로 생성된 함수들을 호출할 경우에는 항상 함수가 선언된 후에 호출해야 함.

let func = function () {

    console.log("hello world");
    
};

func();

화살표형 함수

• 화살표 모양을 통해 변수에 함수를 값처럼 저장한다
• 함수 표현식처럼 변수의 이름을 통해 함수를 호출할 수 있다.
• 호이스팅의 대상이 아니기 때문에, 순서를 잘 지켜서 작성해주어야 한다.

const func = () => {

    console.log("hello world");
};

func(); // hello world

콜백 함수

• 다른 함수에 매개변수로 넘겨준 함수를 의미한다.
• 다른 함수의 인자로 전달된 함수.

function func(blogName, callback) {

    console.log(`${blogName} 블로그에 오신걸 환영해요!`); // hongcode 블로그에 오신걸 환영해요!
    
    callback(); // plus();
}

function plus() {

    console.log("글이 유익하시면 좋아요 눌러주세요!");
    
}

start("hongcode", plus);