자바스크립트 익명 함수(anonymous function) 기명 함수(named function)의 차이

---

함께보면 좋은 글

• 2020/07/05 - [프로그래밍 언어/Javascript] - 자바스크립트 호이스팅(Hoisting)이란?
• 2020/07/19 - [프로그래밍 언어/Javascript] - TDZ(Temporal Dead Zone)이란?

---

자 오늘은 자바스크립트에서 사용되는 익명함수와 기명함수 또는 무명함수와 선언적 함수라고도 하는 이 두 함수의 차이에 대해 알아보도록 하겠습니다.

 

---

익명함수(Anonymouse Function)

자 첫번째로 익명함수에 대해 알아보도록 하겠습니다. 이 익명함수 또는 무명함수같은 경우는 따로 사용자가 함수를 만들 때 이름을 지정하지 않고 변수 혹은 그냥 호출만으로 선언할 수 있는 함수 입니다. 간단한 코드를 봐보겠습니다.

 

See the Pen Anonymouse Function by HyeonJun, Bang (@noogoonaa) on CodePen.

 

위 코드와 같이 이런식으로 사용이 가능합니다. 비록 익명함수 같은경우는 func라는 이름을 가지고 있지만. func는 그저 함수를 가지고 있는 변수에 불과하므로 이름을 가지고 있다고는 말 할 수 없습니다.

---

기명함수(Named Function)

기명함수는 사용자가 이름을 지정한 함수로, 선언적 함수라고도 부르는 함수입니다. 이 기명 함수란 것도 코드를 한번 살펴 볼까요?

 

See the Pen 기명함수 by HyeonJun, Bang (@noogoonaa) on CodePen.

 

위 코드와 같이 실행이 가능합니다.

---

익명함수(Anonymouse Function)와 기명함수(Named Function)의 차이

그럼 이 두개의 차이점은 무엇일까요? 이 두 함수는 브라우저가 읽는 순서의 차이가 있습니다.

익명함수 같은 경우는 브라우저가 런타임(RunTime)에 동적으로 선언되는 함수입니다.

기명함수 같은 경우는 브라우저가 런타임(RunTime) 이전에 선언되는 함수입니다.

잘 이해가 안가시나요? 한번 아래 코드를 한번 보도록 하겠습니다.

 

See the Pen 익명함수 기명함수의 차이 by HyeonJun, Bang (@noogoonaa) on CodePen.

 

어떤가요? 둘다 같은 이름으로 선언하고 호출했을 때 실행되는 함수는 둘다 무명함수 이지요? 

이렇듯, 익명함수가 기명함수 이후에 실행이 되므로 익명함수가 실행되게 되는것 입니다.

어때요? 간단하죠?

(사실 이 또한 동작방식이 호이스팅과 연관이 있습니다. 하지만 이 포스팅에서는 따로 다루지 않고 호이스팅 포스팅, TDZ 포스팅에서 따로 다루도록 하겠습니다.)

그냥 두 함수의 차이는 런타임 이전에 실행되느냐, 아니면 런타임 이후에 실행되는냐로 나누면 됩니다.

 

---

마무리

오늘은 기명함수와 익명함수의 차이에 대해서 알 수 있었습니다.

만약 포스트에 문제가 있거나 틀린부분이 있다면 댓글을 남겨주시기 바랍니다.

감사합니다.