JavaScript Function - 3

이 내용은 이웅모님의 모던 자바스크립트 Deep Dive 책을 공부하고 정리한 내용입니다. (기본 개념부터 심화까지 아주 좋은 책입니다!)
모던 자바스크립트 Deep Dive

다양한 함수의 형태

즉시 실행 함수 (IIFE)

💡 함수의 정의와 동시에 호출. 단 한번만 호출되며 다시 호출할 수 없다.

(function () {
	var a = 1;
  var b = 2;
	return a * b;
}());

• 즉시 실행 함수는 익명 함수를 사용하는 것이 일반적이다. 기명 함수를 사용할 수도 있지만 그룹 연산자 (…) 내의 기명 함수는 함수 선언문이 아니라 함수 리터럴로 평가되기 때문에 함수 이름을 외부에서 호출할 수 없다.
• 즉시 실행 함수는 반드시 그룹 연산자(…)로 감싸야 한다. 감싸는 이유는 먼저 함수 리터럴을 평가해서 함수 객체를 생성하기 위해서다. 따라서 먼저 함수 리터럴을 평가해서 함수 객체를 생성할 수 있다면 그룹 연산자 이외의 연산자를 사용해도 된다.

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

• 또한 일반 함수 처럼 값을 반환할 수 있고 인수를 전달할 수도 있다.

  var res = (function() {
  	var a = 1;
  	var b = 2;
  	return a * b;
  }());
  
  console.log(res) // 2
  
  res = (function(a, b) {
  	return a * b;
  }(3, 5));
  
  console.log(res) // 15

재귀 함수

• 함수가 자기 자신을 호출하는 것을 재귀 호출이라 한다. 재귀 함수는 자기 자신을 호출하는 행위, 즉 재귀 호출을 수행하는 함수를 말한다.
• 함수 이름은 함수 몸체 내부에서만 유효하다.(선언문에서 자바스크립트 엔진이 암묵적으로 만들어주는 식별자와는 다르다.) 따라서 함수 내부에서는 함수 이름을 사용해 자기 자신을 호출할 수 있는 것이다.
• 대표적인 재귀함수 팩토리얼

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

중첩 함수

• 함수 내부에 정의된 함수를 중첩 함수(nested function) 또는 내부 함수(inner function)라 한다. 중첩 함수를 포함하는 함수를 외부 함수(outer function)이라 부른다.
• 중첩 함수는 외부 함수 내부에서만 호출할 수 있다.
• 일반적으로 중첩 함수는 외부 함수를 돕는 헬퍼 함수(helper function) 역할을 한다.

  function outer() {
  	var x = 1;
  	function inner() {
  		var y = 2;
  		console.log(x + y);
  	}
  	inner();
  }
  outer();

• 중첩 함수는 스코프와 클로저에 깊은 관련이 있다.

고차함수와 콜백 함수

• 함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수를 콜백 함수(callback function)라고 하며, 매개 변수를 통해 함수의 외부에서 콜백 함수를 전달받는 함수를 고차 함수(Higher-Order Function, HOF)라고 한다. (repeat 은 고차 함수, logAll, logOdds는 콜백 함수다.)

  function repeat(n, f) {
  	for(var i = 0; i < n; i++) {
  		f(i);
  	}
  }
  
  var logAll = function(i) {
  	console.log(i);
  }
  
  repeat(5, logAll);
  
  var logOdds = function(i) {
  	if(i % 2) console.log(i);
  };
  
  repeat(5, logOdds);

• 매개 변수를 통해 함수를 전달 받거나 반환값으로 함수를 반환하는 함수를 함수형 프로그래밍 패러다임에서 고차 함수라 한다.
• 중첩 함수가 외부 함수를 돕는 헬퍼 함수 역할을 하는 것 처럼 콜백 함수도 고차 함수에 전달되어 헬퍼 함수 역할을 한다. 중첩 함수는 고정되어 있어서 교체하기 어렵지만 콜백 함수는 함수 외부에서 고차 함수 내부로 주입하기 때문에 자유롭게 교체할 수 있다.
• 고차 함수는 매개변수를 통해 전달받은 콜백 함수의 호출 시점을 결정해서 호출한다. 콜백 함수는 고차 함수에 의해 호출되며 이때 고차 함수는 필요에 따라 콜백 함수에 인수를 전달할 수 있다.

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

  콜백 함수로서 전달된 함수 리터럴은 고차 함수가 호출될 때마다 평가되어 함수 객체를 생성한다. 따라서 한번만 생성하게 만드는 것이 좋다.

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

순수 함수

• 함수형 프로그래밍에서 어떤 외부 상태에 의존하지도 않고 변경하지도 않는, 즉 부수 효과가 없는 함수를 순수 함수라 하고, 외부 상태에 의존하거나 외부 상태를 변경하는, 즉 부수 효과가 있는 함수를 비순수 함수라고 한다.
• 순수 함수는 동일한 인수가 전달되면 언제나 동일한 값을 반환하는 함수다. (값이 변하지 않는다는 말이 아니다.)
• 순수 함수는 최소 하나 이상의 인수를 전달 받는다. 인수를 전달 받지 않는 순수 함수는 언제나 동일한 값을 반환하므로 결국 상수와 같다.
• 순수 함수는 인수를 변경하지 않는 것이 기본이다. 순수 함수는 인수의 불변성을 유지한다.
• 또한 순수 함수는 함수의 외부 상태를 변경하지 않는다.

var count = 0;

// n이 값이 동일하다면 반환되는 값도 동일하다.
function increase(n) {
	return ++n;
}

count = increase(count); // 재할당으로 상태 변경
console.log(count);

비순수 함수

• 함수의 외부 상태에 따라 반환값이 달라지는 함수, 다시 말해 외부 상태에 의존하는 함수를 비순수 함수라고 한다.
• 순수 함수와 달리 외부 상태를 변경하는 부수 효과가 있다는 것이다.
• 즉 비순수 함수는 외부 상태에 의존하거나 외부 상태를 변경하는 함수다.

var count = 0;

function increase() {
	return ++count;
}

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

• 인수를 전달받지 않고 함수 내부에서 외부 상태를 직접 참조하면 외부 상태에 의존하게 되어 반환값이 변할 수 있고, 외부 상태도 변경할 수 있으므로 비순수 함수가 된다.
• 함수 내부에서 외부 상태를 직접 참조하지 않더라도 매개변수를 통해 객체를 전달받으면 비순수 함수가 된다.

💡 함수가 외부 상태를 변경하면 상태 변화를 추적하기 어려워진다. 따라서 함수 외부 상태의 변경을 지양하는 순수 함수를 사용하는 것이 좋다.