[Javascript] 함수 선언 function vs const (arrow function)

Hoisting(호이스팅) 관련 내용을 보다가 함수 선언 function을 주로 사용하는지 const (arrow function)을 주로 사용하는지 각 선호도에 대해 각자의 생각을 토론하는 글을 보고 재미있어서 정리해보았다. 

(토론 출처 : https://dev.to/skinnypetethegiraffe/function-or-const-which-do-you-prefer-typescriptjavascript-apa)

 

// function
function test() {
    return "test";
}

// arrow function
const test = () => "test";

1. function 선언을 선호하는 이유

• hoisting(호이스팅)을 지원 (중첩 함수를 작성할 때 코드 정리 용이)
• const (arrow function)선언 보다 함수인지 인지하기 쉬움 (const로 하면 변수인지 함수인지 뒤를 더 봐야하니까)
• 함수를 직접 참조하기때문에 읽기 쉽다.

 

2. arrow function 선언을 선호하는 이유

• function 단어치기가 const치기보다 귀찮음
• 주로 고차 함수에 대한 콜백함수로 사용 (etc. map, reduce, forEach 등)
• 적절한 함수 선언 배치와, 모듈을 사용하면 hoisting(호이스팅)은 문제가 안됨
• 함수명 중복을 막음

 

※ 의견을 종합해보면 대다수는 일반 함수를 선언할 때 function을 주로 사용하고 onSubmit, map 등 콜백 함수에서 arrow function을 선호한다.