12.1. 함수란?
- 프로그래밍 언어의 함수는 일련의 과정을 문(statement)으로 구현하고, 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것
- 매개 변수(parameter): 입력을 전달받는 변수
- 인수(argument): 입력
- 반환 값(return value): 출력
- 함수 정의를 통해 생성하고, 함수를 호출해 실행하여 반환값을 반환
12.2. 함수를 사용하는 이유
- 함수는 여러 번 재사용 가능
- 코드의 재사용 -> 유지보수 편의성 및 코드의 신뢰성 높임
- 함수는 객체 타입의 값으로 식별자를 붙일 수 있음
- 코드의 가독성 향상
12.3. 함수 리터럴
- 함수는 객체 타입의 값 (함수는 호출할 수 있는 객체)
- 함수 리터럴의 구성 요소
- 함수 이름: 식별자, 생략 가능(기명 함수, 무명/익명 함수)
- 매개변수 목록: 0개 이상의 매개변수를 소괄호로 감싸고 쉼표로 구분, 함수 몸체 내에서 변수와 동일하게 취급함
- 함수 몸체: 함수 호출 시 실행될 문들을 하나의 실행 단위로 정의한 코드 블록
12.4. 함수 정의
- 함수 정의 방식
- 함수 선언문: function func(x, y) { return x + y; }
- 함수 표현식: var func = function(x, y) { return x + y; }
- 생성자 함수: var func = new Function('x', 'y', 'return x + y');
- 화살표 함수(ES6): var func = (x, y) => x + y;
12.4.1. 함수 선언문
- 함수 선언문은 함수 이름을 생략할 수 없음
- 함수 선언문은 표현식이 아닌 문
- 브라우저 개발자 도구에서 실행하면 완료 값인 undefined 출력
- 표현식이라면 표현식이 평가되어 생성된 함수가 출력되어야 함
- 기명 함수 리터럴은 코드의 문맥에 따라 함수 선언문 또는 함수 리터럴 표현식으로 해석됨
- 자바스크립트 엔진은 생성된 함수를 호출하기 위해 함수 이름과 동일한 이름의 식별자를 암묵적으로 생성하여 함수 객체를 할당함
12.4.2. 함수 표현식
- 자바스크립트의 함수는 일급 객체, 함수를 값처럼 자유롭게 사용할 수 있음
- 함수 표현식으로 변수에 함수 객체를 할당할 수 있음
- 일반적으로 함수 이름 생략 -> 익명 함수
- 함수를 호출할 때는 식별자(변수) 사용
12.4.3. 함수 생성 시점과 함수 호이스팅
- 선언문 함수는 선언문 이전에 호출 가능
- 함수 호이스팅(function hoisting): 함수 선언문이 코드 선두로 끌어올려 진 것처럼 동장하는 자바스크립트 고유의 특징
- 런타임 이전에 함수 선언문으로 정의한 함수 객체가 먼저 생성되고 암묵적으로 함수 객체에 할당
- 표현식 함수는 표현식 이전에 호출 불가
- 변수 호이스팅: 먼저 undefined로 초기화 된 후, 런타임 시점에 평가되어 할당문이 변수에 할당됨
- 함수 호이스팅은 일반적인 규칙을 무시한다는 측면에서 함수 표현식을 권장하는 의견도 있음
12.4.4. Function 생성자 함수
- 일반적으로 거의 사용하지 않음
12.4.5. 화살표 함수
- ES6에서 도입, 간략하고 익명 함수로 정의
12.5. 함수 호출
12.5.1. 매개변수와 인수
- 함수 내부에 필요한 값을 전달하기 위해 매개변수(parameter, 인자)를 통해 인수(argument) 전달
- 인수는 값을 통해 평가될 수 있는 표현식
- 개수와 타입 제한 없음
- 외부에서는 참조할 수 없음 (유효 범위는 함수 내부)
12.5.2. 인수 확인
- 자바스크립트 함수는 매개변수와 인수의 개수, 타입을 확인하지 않음
- 함수 내부에서 확인하거나 타입스크립트 사용하여 방지
- ES6에서 도입된 매개변수 기본 값(디폴트) 설정 가능
12.5.3. 매개변수의 최대 개수
- 명시적으로는 제한 없음
- 이상적으로 0개, 적을수록 좋음
- 최대 3개 이상 넘지 않는 것을 권장
12.5.4. 반환문
- return 반환문을 통해 실행 결과를 함수 외부로 반환
- 함수 호출은 표현식이므로 return 반환한 표현식의 결과를 변수 할당 가능
- 명시적으로 return 값을 지정하지 않으면 undefined 반환, 생략 가능
- 반환문은 함수의 실행을 중단하고 빠져나감
- return 문 뒤의 코드는 실행되지 않음
12.6. 참조에 의한 전달과 외부 상태의 변경
- 매개변수도 변수와 동일하게 타입에 따라 값 전달 또는 참조 전달 방식
- 함수가 외부 상태를 변경하면 변화를 추적하기 어렵고 복잡성을 증가시킴
- 옵저버 패턴, 깊은 복사 등을 통해 새로운 객체를 생성하고 재할당하는 등의 대응 필요
- 순수 함수: 외부 상태를 변경하거나 의존하지 않는 함수
12.7. 다양한 함수의 형태
12.7.1. 즉시 실행 함수
- 즉시 실행 함수(IIFE): 함수 정의와 동시에 즉시 호출되는 함수, 단 한 번만 호출됨
- 일반적으로 익명 함수 사용
- 그룹 연산자 (...) 로 감싸야 함
- 먼저 함수 리터럴로 평가한 후 함수 객체를 생성하기 위해서
- 즉시 실행 함수도 리턴 값을 반환하여 변수에 할당할 수 있음
12.7.2. 재귀 함수
- 재귀 호출: 함수 자신을 호출하는 것, 재귀 호출을 수행하는 함수, 반복 처리
- 탈출 조건을 반드시 만들어야 함
- 없으면 함수가 무한 호출되어 스택 오버플로(stack overflow) 에러 발생
12.7.3. 중첩 함수
- 외부 함수: 중첩 함수를 포함하는 함수
- 중첩 함수 = 내부 함수 = 헬퍼 함수: 함수 내부에 정의된 함수
- 외부 함수 내부에서만 호출할 수 있음
12.7.4. 콜백 함수
- 콜백 함수: 함수의 매개변수(파라미터)로 다른 함수의 내부에 전달되는 함수
- 헬퍼 함수의 역할
- 고차 함수: 콜백 함수를 전달받은 함수
- 콜백 함수를 자신의 일부분으로 합성함
- 전달받은 콜백 함수의 호출 시점을 결정해서 호출할 수 있음
- 비동기 처리, 배열 고차 함수에서 활용되는 중요한 패턴
12.7.5. 순수 함수와 비순수 함수
- 순수 함수: 외부 상태에 의존하지 않고 변경하지도 않는 부수 효과가 없는 함수
- 매개변수를 통해 내부로 전달된 인수에게만 의존하여 값을 생성함
- 기본적으로 인수를 변경하지 않기 때문에 인수의 불변성 유지
- 비순수 함수: 외부 상태를 변경하는 부수 효과가 있는 함수
- 외부 상태에 따라 반환 값이 달라짐
- 인수를 전달받지 않고 외부 상태를 직접 참조함
- 코드의 복잡성을 증가시키고 상태 변화를 추적하기 어렵기 때문에 사용 지양
- 함수형 프로그래밍: 부수 효과를 최소화하여 불변성을 지향하는 프로그래밍 패러다임
- 조건문과 반복문을 제거하여 복잡성 해결
- 변수 사용을 억제하거나 주기를 최소화, 상태 변경을 피하여 오류 최소화
[출처] 모던 자바스크립트, Deep Dive
괴발개발라이프