[Jascript] 함수 / 기본 함수 선언 / 익명 함수 선언 / 호이스팅에 관해서

함수란?

변수에는 데이터만 저장할 수 있고, 코드는 저장할 수 없음. 함수는 코드를 메모리에 저장했다가 필요할 떄 마다 호출하여 사용

 

기본 함수 정의문 선언

function 함수명() { 
	자바스크립트 코드;
}

 

1) 기본 함수 정의문 선언 예제

// 기본 함수 정의

function f1() {
    console.log( "기본 함수 정의문인 \"f1\"을 호출 했습니다." )
}

// 기본 함수 호출

f1();

 

2) 기본 함수 정의문 선언문 출력 예제

 

 

익명 함수(함수명이 없는 함수) 선언

참조 변수 = function() {
	자바스크립트 코드;
}

 

1) 익명 함수 선언 예제

 

// 익명 함수 선언
// 추가로 알고가기) let - 변숫값 재할당 가능, const - 재할당 불가능

const f2 = function() {
    console.log( "익명 함수인 \"f2\"을 호출 했습니다.");
};

 // 익명 함수 호출

f2();

 

2) 익명 함수 선언 예제

 

+1) 화살표 함수(Lambda)  선언 예제

//화살표 함수 선언(Lambda)
const f3 = () => {
    console.log( "화살표 함수인 \"f3\"을 호출 했습니다." )
}

//화살표 함수 호출(Lambda)
f3();

 

+2) 화살표 함수(Lambda)  호출 예제

 

---

 

호이스팅 / 기본 함수 정의문 선언과 익명 함수(함수명이 없는 함수) 선언의 차이점

일반 함수 정의는 함수를 호출했을 떄 호이스팅(Hoisting) 기술을 지원하나,

익명 함수 선언 방식은 호이스팅을 지원하지 않음.

즉, 호이스팅을 적용하면 함수 정의문보다 호출문이 먼저 나와도 함수 정의문을 끌어올려 함수를 호출

 

호이스팅 확인을 위한 기본 함수 우선 호출

 

1) 기본 함수 호출을 우선으로 하고, 기본 함수를 뒤에 선언

// 기본 함수 호출 우선

f1();

// 기본 함수 선언

function f1() {
    console.log( "기본 함수 정의문인 \"f1\"을 호출 했습니다." )
}

 

2) 출력 확인

 

기본 함수의 호이스팅 기능 확인

 

호이스팅 확인을 위한 익명 함수 우선 호출

 

1) 익명 함수 호출을 우선으로 하고, 익명 함수를 뒤에 선언

// 익명 함수 호출

f2();

// 익명 함수 선언

const f2 = function() {
    console.log( "익명 함수인 \"f2\"을 호출 했습니다.");
};

 

2) 출력 확인

 

초기화되기 전에는 변수를 사용할 수 없으므로
"초기화 전에 액세스할 수 없습니다"라는 메시지가 표시됩니다.