익명함수와 선언적 함수의 차이

while 반복문은 조건을 중심으로 반복함
for 반복문은 횟수를 중심으로 또는 배열 등을 중심으로 반복함

익명함수

익명함수는 순차적인 코드 실행에서 코드가 해당 줄을 읽을 때 생성된다.

let 익명함수

익명함수 = function (){
    console.log('1번째 익명함수입니다.')
}
익명함수 = function (){
    console.log('2번째 익명함수입니다.')
}
익명함수()
//결과값
//2번째 익명함수입니다.

익명 함수는 재사용 하지 않는, 한번만 사용할 함수를 위한 개념으로, 따로 함수의 이름을 갖지 않는다. 리터럴(Literal) 방식으로 변수에 담겨 사용하는 함수이다.

리터럴(Literal) 방식이란 글자 뜻 그대로 "문자 그대로 읽히는 방식"을 의미하며, 일반적으로 변수에 데이터를 넣을 때 사용하는 방식이 리터럴 방식이다.

// 리터럴 방식

let a = 10;
const b = 20;

리터럴 방식으로 사용되는 익명 함수는, 변수에 저장되게 된다.

//익명 함수

const sayHello = function() {
  console.log("hello!");
}

sayHello(); // 출력: hello!

반면, 리터럴 방식으로 사용되는 익명 함수의 경우, 호이스팅 시 함수를 담는 변수의 선언부만 위로 올라가고, 익명 함수 자체는 변수가 호출되었을 때 실행되기 때문에, 선언부가 호출 위치보다 위에 있어야 한다.

//익명 함수

sayHello(); // Uncaught ReferenceError: Cannot access 'sayHello' before initialization

let sayHello = function() {
  console.log("hello!");
}

sayHello(); // 위에서 에러가 났으니 출력이 나오지 않음

// 이 자바스크립트를 읽을 때(호이스팅 된 모습)
// 
// const sayHello;
//
// sayHello(); <- sayHello의 초기화가 진행되지 않았다.
// 
// sayHello = function(){
//   console.log("hello!");
// }
//
// sayHello(); <- 초기화는 진행된 후 불렸으니, 원래대로라면 출력 가능

선언적함수

선언적함수는 자바스크립트가 처음 읽힐 당시에 해석되므로, 함수가 쓰여진 위치가 상관없다. 이를 호이스팅이라고 하는데, 호이스팅이란 쉽게 말해 자바스크립트가 처음 읽힐 당시에 모든 객체(변수, 함수)의 선언부를 맨 위로 끌어올리는 것이다. 일반 함수는 함수 전체(함수명, 함수바디)가 통째로 호이스팅 되어 맨 위로 올라가기 때문에 위치 상관없이 읽을 수 있는 것이다.
선언적함수도 입력한 순서대로 생성되고 같은 이름이라면 덮어쓴다.

SayHello(); // "hello!" 가 정상적으로 출력됨.

function SayHello(){
  console.log("hello!");
}

SayHello(); // "hello!" 가 정상적으로 출력됨.

// 호이스팅 된 모습
//
// function SayHello(){      <- 함수 선언이 먼저 일어나고,
//   console.log("hello!");
// }
//
// SayHello(); <- 첫 번째 SayHello();
// SayHello(); <- 두 번재 SayHello();

함수 = function () {
    console.log('익명함수입니다.')
}

함수 = function () {
    console.log('선언적함수입니다.')
}

함수()
//결과값
// 선언적함수입니다.

선언적 함수와 익명 함수의 조합

선언적 함수는 먼저 생성되고, 이후에 순차적인 코드 진행을 시작하면서 익명함수를 생성한다.

함수 = function () { //1번 함수 변수 선언   4.선언부 호출 5.덮어씌우기
    console.log('익명함수입니다.')
}

function 함수(){//2.변수 선언 3.선언부 호출
    console.log('선언적함수입니다.')
}

함수() //6. 호출
//결과값
//익명함수입니다.

익명 함수는 코드를 읽을때와 같은 순서로 함수가 선언되지만, 선언적 함수는 코드를 읽는 순서와 다른 순서로 함수가 선언된다.
익명 함수와 선언적 함수를 같이 조합할 경우 익명함수가 출력된다.

참고문서

오늘은 선언적 함수와 익명함수의 차이에 알게 되었다.
익명함수는 순차적으로 읽히고 보통 변수에 담아서 사용하는데
선언적 함수는 전역적이며 함수 전체(함수명, 함수바디)가 같이 호이스팅되어 호출의 위치와 구현의 위치간에 연관관계가 없다는 것을 알게 되었다.
함수 이름이 동일한 경우 덮어씌워지는 것도 알게 되었다 알면 알수록 더 신기해지는 함수의 세계였다ㅎㅎㅎㅎ.아직 멀은 코린이 세계