익명함수(Anonymous Function)

함수?

함수이름을 호출하여 재사용이 가능하다.

function sum(a, b) {
	let m = a + b;
	return m;
}
let sumanswer = sum(1, 2);
console.log(sumanswer); // 3

익명함수란?

함수 리터럴 방식으로 만들어진 이름없는 함수.

리터럴?

• 문자 그대로
• 데이터를 만들 때 흔히 사용하는 방식

let a = 10;
let name = 'superman';

익명함수 구조

• 변수에 함수의 코드를 저장하는 대신 함수명을 사용하지 않음
• 변수 명을 함수 명처럼 사용해서 함수를 호출하거나 변수 값을 이동시키는데 사용할 수 있음

let hello = function () {
	document.write("Hello World");
};
hello(); // Hello World

let hi = function () {
	let string = "Hello World";
	return string;
}
console.log(hi()); // Hello World

익명함수의 변수명 변경

• 변수값으로 구성된 함수 코드를 다른 변수명에 변수를 대입하듯이 이동 가능

let apple = function () {
	document.write("This is a banana.");
};

// apple 변수에 저장된 함수를 banana 변수에 대입
let banana = apple;
banana(); // This is a banana.

호이스팅 불가

// hoisting X
orange();
var orange = function () {
document.write("This is an orange.");
};
// error

// hoisting O
banana(); // This is an banana.
function banana() {
document.write("This is an banana.");
}

호이스팅?
함수 안에 있는 선언들을 모두 끌어올려서 해당 함수 유효 범위의 최상단에 선언하는 것

• var 변수, 함수선언문에서만 호이스팅 적용
• 호이스팅 방지를 위해 let, const 사용
• 선언은 끌어올려지지만 할당은 끌어올려지지 않음

console.log(hello); // undefined
var hello = "Hello";

console.log(hi); // error
let hi = "Hi";

즉시실행함수

변수에 함수 자체를 대입하는 익명함수의 예제와는 달리 함수가 실행된 결과값을 변수에 대입한다.

// 익명함수
let sum = function(a, b) {
	let m = a + b;
	return m;
};
console.log(sum(1, 2)); // 3

// 즉시실행함수
let sum = (function(a, b) {
	let m = a + b;
	return m;
})(1, 2);
console.log(sum); // 3