05_함수(function)

1. 함수(function)

• 함수 선언식(function declaration)

  function 함수명([매개변수]) {
  		코드
  }

  • 함수 선언문에서는 함수명을 생략할 수 없다.
  • 매개 변수는 없을 수도 있다.
  • 호이스팅이 된다 .
• 함수 표현식(function expression)

  const 함수명 = function () {
  		코드
  }

  • 호이스팅이 되지 않는다.
    • 변수 선언 시에만 호이스팅이 되고 함수 할당은 실행 시점에 이루어진다.
  • 함수 이름 없이 익명 함수를 사용할 수 있다.

---

2. 매개 변수(parameter)

• 매개변수는 함수 몸체 내부에서만 참조할 수 있다.
• 함수는 매개 변수의 개수와 인수의 개수가 일치하는지 체크하지 않는다.
  • 인수가 부족해서 할당되지 않은 매개변수의 값은 undefined이다.
  • 매개변수보다 인수가 더 많은 경우, 초과된 인수는 무시된다.
• 매개변수의 최대 개수에 대해 명시적인 제한은 없다.
  • 하지만 이상적인 함수는 한 가지 일만 해야 하며 가급적 작게 만들어야 하므로 최대 3개 이상을 넘지 않는 것을 권장한다.
• 모든 인수는 암묵적으로 arguments 객체의 프로퍼티로 보관된다.
  • 가변인자 함수 구현 시 유용하게 사용 된다.
• 인수를 전달하지 않았을 경우, undefined를 전달하였을 경우 ES6에서 도입된 매개변수 기본값을 사용할 수 있다.

  const func1 = function (name = 'admin') {
      console.log(name);
  }
  
  func1()  // admin

• 나머지 매개 변수 (rest parameters)
  • 임의의 수의 인자를 배열로 허용해 가변 인자를 나타내는 방법
  • 전개 구문(…params)

    • ES6에서 추가된 내용이다.

    • 반복 가능한 항목을 펼치는 것이다.

    • 반복 가능한 항목의 요소를 개별적인 값으로 분리하거나 현재 배열이나 객체에 추가하는 등의 역할을 한다.

    • 항상 가장 마지막에 있어야 한다.

      const func2 = function (param1, param2, ...params) {
      		console.log(param1, param2, params)
      }
      
      func2(1, 2, 3, 4, 5)
      func2(1, 2)

---

3. 반환 (return)

• return

  • 반환문은 return 키워드 뒤에 오는 값을 반환한다.

  • 반환 값을 명시적으로 지정하지 않으면 undefined가 반환 된다.

  • 반환문을 생략할 수도 있으나 암묵적으로 undefined가 반환 된다.

    const greeting = function (name = 'admin') {
    		return `Hi ${name}`
    }
    
    greeting()  // Hi admin

---

4. 화살표 함수(arrow function)

• function 키워드 대신 화살표를 사용해 더 간략한 방법으로 함수를 선언할 수 있다.
• 화살표 함수는 항상 익명 함수로 정의한다.
• 본문이 한 줄인 함수를 작성할 때 유용하다.
• 기존의 복잡한 함수 선언을 간결하게 표현할 수 있다.
  
• 작성 과정
  1. function 키워드를 제거 하고 매개변수와 중괄호 사이에 화살표(=>)를 작성한다.
  2. 함수의 매개변수가 하나뿐이라면 매개변수의 소괄호() 제거가 가능하다.
  3. 함수 본문의 표현식이 한 줄이라면 중괄호{}와 return 제거가 가능하다.

---

5. 다양한 타입의 함수

5_1) 즉시 실행 함수(immediately invoked function)

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

(function() {
    console.log('익명 즉시 실행 함수! 함수 정의와 동시에 호출!');
 })();

5_2) 중첩 함수(nested function)

• 함수 내부에 정의 된 함수를 중첩 함수 또는 내부 함수라고 한다.
• 중첩 함수를 포함하는 함수는 외부 함수라고 한다.
• 일반적으로 중첩 함수는 자신을 포함하는 외부 함수를 돕는 헬퍼 함수의 역할을 한다.

function outer() {
    var outerVal = '외부 함수';    
    function inner() {
	    var innerVal = '내부 함수';        
	    // 외부 함수의 변수를 참조할 수 있다.        
	    console.log(outerVal, innerVal);    
	  }    
	  inner();
}
outer();

5_3) 콜백 함수(callback function)

• 함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수를 콜백 함수라고 한다.
• 매개변수를 통해 함수의 외부에서 콜백 함수를 전달 받은 함수를 고차 함수라고 한다.
• 콜백 함수는 고차 함수에 전달 되어 헬퍼 함수의 역할을 한다. 즉, 고차 함수는 콜백 함수를 자신의 일부분으로 합성한다.
• 함수의 변하지 않는 공통 로직은 미리 정의해두고 경우에 따라 변경되는 로직은 추상화해서 함수 외부에서 내부로 전달하는 방식이다.
• 콜백 함수는 함수형 프로그래밍 패러다임 뿐 만 아니라 비동기 처리(이벤트, 타이머, ajax)에 활용되는 중요한 패턴이다. 또한 배열 고차 함수(map)에서도 사용 된다.