본 포스팅은 '모던 자바스크립트 Deep Dive'를 기반으로 공부한 내용을 정리한 것입니다.

1. 즉시 실행 함수

함수 정의와 동시에 즉시 호출되는 함수. 단 한 번만 호출될 수 있다. 익명 함수를 쓰는 것이 일반적이다. (이름이 있어도 호출할 수 없기 때문)

(function (){
  // ...
}());

(function (){
  // ...
})();

!function (){
  // ...
}();

+function (){
  // ...
}();

즉시 실행 함수도 값을 반환하거나 인수를 전달할 수 있다.

// 값의 반환
var res = (function (){
  var a = 3;
  var b = 5;
  return a * b;
}());

console.log(res);  // 15

// 인수 전달
res = (function (a, b){
  return a * b;
}(3,5));

console.log(res);  // 15

2. 재귀 함수

자기 자신을 호출하는 행위, 즉 재귀 호추를 수행하는 함수. 반복 처리를 위해 사용한다.

function countdown(n) {
  if (n < 0) return;
  console.log(n)
  countdown(n - 1);   // 재귀 호출
}

countdown(10);   // 10 9 8 7 6 5 4 3 2 1 0

팩토리얼의 구현

// 팩토리얼(계승)은 1부터 자신까지의 모든 양의 정수의 곱이다.
// n! = 1 * 2 * ... * (n-1) * n
function factorial(n) {
  if (n <= 1) return 1;
  return n * factorial(n - 1);
}

factorial(0);  // 0! = 1
factorial(2);  // 2! = 2 * 1 = 2
factorial(3);  // 3! = 3 * 2 * 1 = 6
...

함수 표현식으로 정의한 재귀 함수

함수 표현식으로 정의한 함수 내부에서는 함수 이름은 물론 함수를 가리키는 식별자로도 자기 자신을 재귀 호출할 수 있다. (함수 이름은 여전히 외부에서 호출 불가하다)

var factorial = function foo(n) {
  if (n <= 1) return 1;
  return n * factorial(n - 1);
};

factorial(5); // 5! = 5 * 4 * 3 * 2 * 1 = 120

스택 오버플로 에러

탈출 조건을 만들지 않으면 재귀 함수가 무한 호출되어 스택 오버플로 에러가 발생한다.

3. 중첩 함수

함수 내부에 정의된 함수를 중첩 함수 또는 내부 함수라 한다. 중첩 함수는 외부 함수 내부에서만 호출할 수 있다. 외부 함수를 돕는 헬퍼 함수의 역할을 한다.

• 외부 함수 : 중첩 함수를 포함한 함수
• 내부 함수(중첩 함수) : 외부 함수 내에 포함된 함수

function outer(){
  var x = 1;
  
  function inner() {
    var y = 2;
    // 외부 함수의 변수를 참조할 수 있다.
    console.log(x + y); // 3
  }
  inner();
}

outer();

4. 콜백 함수

• 콜백 함수 : 함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수
• 고차 함수 : 매개변수를 통해 함수의 외부에서 콜백 함수를 전달받은 함수

콜백 함수 사용하는 방법 (함수의 합성)

함수의 변하지 않는 공통 로직은 미리 정의해 두고, 변경되는 로직은 추상화해서 함수 외부에서 함수 내부로 전달하는 것.

function repeat(n, f) {
  for (var i = 0; i < n; i++) {
    f(i);
  }
}

var logAll = function (i) {
  console.log(i);
};

var logOdds = function (i) {
  if (i % 2) console.log(i);
};

repeat(5, logAll);    // logAll = 콜백 함수
repeat(5, logOdds);   // logOdds = 콜백 함수

콜백 함수가 한번만 사용될 때

콜백 함수가 고차 함수 내부에만 호출된다면 콜백 함수를 익명 함수 리터럴로 정의하면서 바로 고차 함수에 전달한다.

repeat(5, function (i){
  if (i % 2) console.log(i);
});

콜백 함수가 여러번 사용될 때

콜백 함수를 고차 함수 외부에서 정의한다.

var logOdds = function (i) {
  if (i % 2) console.log(i);
};

repeat(5, logOdds); // 고차 함수에 함수 참조를 전달

5. 순수 함수와 비순수 함수

• 순수 함수 : 어떤 외부 상태에 의존하지도 않고 변경하지도 않는, 부수 효과가 없는 함수
• 비순수 함수 : 외부 상태에 의존하거나 외부 상태를 변경하는, 부수 효과가 있는 함수

1) 순수 함수

동일한 인수가 전달되면 언제나 동일한 값을 반환하는 함수다. 오직 매개변수로 전달된 인수에게만 의존해 값을 생성해 반환한다.

순수 함수의 특징

• 최소 하나 이상의 인수를 전달받는다.
• 인수의 불변성을 유지한다.
• 외부 상태를 변경하지 않는다.

var count = 0;

function increase(n) {   // increase : 순수 함수
  return ++n;
}

count = increase(count)
console.log(count);     // 1

2) 비순수 함수

외부 상태에 따라 반환값이 달라지는 함수, 즉 외부상태에 의존하는 함수다.

var count = 0;

function increase(){   // increase : 비순수 함수
  return ++count;
}

increase();
console.log(count);  //1