일하면서 기록하기

자바스크립트에서 함수를 선언하는 방법중에 함수 선언식, 함수표현식, 화살표 함수 란게 있다

함수 선언문은 함수의 이름을 꼭 써야 한다.

function 함수명() {
	구현로직
}

함수 표현식은 익명 함수표현식과, 기명 함수표현식으로 나뉜다.
말그대로 함수 이름이 있냐 없냐 차이다.

let test1 = function(){
	return '익명 함수표현식';
}

let test2 = function test2(){
	return '기명 함수표현식';
}

왜 이렇게 다르게 사용하느냐?

함수 선언식은 호이스팅의 영향을 받지만
함수 표현식은 호이스팅의 영향을 받지 않기 때문이다.

개발할때보면 내가 의도치 않게 함수가 먼저 읽히거나 실행되서 의도하지 않은 동작이 이뤄질 수 있다.
그걸 방지 할려면 함수 선언문과 표현식을 잘 구분해서 사용하면 되겠다.

호이스팅이란?
JavaScript 호이스팅은 인터프리터가 코드를 실행하기 전에 함수, 변수, 클래스 또는 임포트(import)의 선언문을 해당 범위의 맨 위로 이동시키는 과정
https://developer.mozilla.org/ko/docs/Glossary/Hoisting

   //testFunc(); 에러

    let testFunc = function() {
        console.log('1');
    }
    
    testFunc(); //1출력

함수표현식으로 만든 trstFunc를 선언하기전에 먼저 불러내면 (함수보다 윗줄에서 호출하면)
testFunc is not a function 이라는 에러메세지가 나온다.

​하지만

testtt(); //2 출력

function testtt(){
	console.log('2');
}

testtt(); //2출력​

함수 선언문을 사용하면 함수를 선언한 줄 보다 위에 호출해도 2가 잘 출력된다

이게 호이스팅이다.

​그럼 각각의 장점을 알아보자

함수표현식의 장점
1. 호이스팅의 영향을 받지 않는다
2. 클로저로 사용한다.
3. 콜백으로 사용한다. (다른 함수의 인자로 넘길 수 있다.)

​

 출처

https://gmlwjd9405.github.io/2019/04/20/function-declaration-vs-function-expression.html

https://ko.javascript.info/new-function