04. various-types-of-functions
01_immediately-invoked-function-expression(즉시 실행 함수)
즉시 실행 함수
- 함수 정의와 동시와 즉시 호출이 되는 함수로 단 한번만 호출 되며 다시 호출할 수 없다.
- 즉시 실행 함수는 반드시 () - 그룹 연산자로 감싸야 한다.
- 즉시 실행 함수 내에 코드를 모아두면 혹시 있을수도 있는 변수나 함수의 이름 충돌을 방지할 수 있다.
- 함수 이름이 없는
익명 함수를 사용하는 것이 일반적이다.
( ) - 그룹 연산자로 감싸야 한다.
( ); 호출
(function () {
실행할 내용; })( );;
나중에 다시 호출해서 사용할 함수가 아니기 때문에 기명함수 작성도 가능하지만 의미가 없다.
- 전달 값이 있는 경우, 실행 괄호 안에 적어준다.
('홍길동'); 호출
(function hello(name) {
console.log('기명 즉시 실행함수! 함수 정의와 동시에 호출!');
console.log(`${name}님 안녕하세요`);
})('홍길동');
hello('유관순');
// 다시 호출해서 사용할 수 없기때문에 에러 발생
//ReferenceError: hello is not defined
02_recursive-function(재귀 함수)
재귀 함수 : 함수가 자기 자신을 호출하는 것
재귀 호출을 수행하는 함수인 재귀 함수는 반복되는 처리를 위해 사용한다.
// n! = 1 * 2 * ... * (n-1) * n;
function factorial(n) {
// n이 1 이하일 때 1을 반환함
if(n <= 1) return 1;
// 재귀 호출
return n * factorial(n - 1);
}
console.log(factorial(1));
console.log(factorial(2));
console.log(factorial(3));
console.log(factorial(4));
console.log(factorial(5));
03_nested-function(중첩 함수)
중첩 함수 : 함수 내부에 정의 된 함수를 중첩 함수.
또는 내부 함수라고 한다.
중첩 함수를 포함하는 함수는 외부 함수라고 한다.
일반적으로 중첩 함수는 자신을 포함하는 외부 함수를 돕는 헬퍼 함수의 역할을 한다.
inner함수는 outer함수 내부에서만 호출할 수 있다.
function outer () {
var outerVal = '외부 함수';
function inner () {
var innerVal = '내부 함수';
console.log(outerVal + "," + innerVal); //외부 함수의 변수를 내부 함수에서 참조할 수 있다.
}
inner(); //outer함수 내부에서만 호출할 수 있다.
}
outer();
04_callback-function(콜백함수)
콜백함수 : 함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수라고 한다.
콜백 함수는 고차 함수에 전달 되어 헬퍼 함수의 역할을 한다.
고차 함수 : 매개변수를 통해 함수의 외부에서 콜백 함수를 전달 받은 함수
//콜백 함수: 함수 선언 시 매개변수부에 함수를 호출할 수 있는데 그때 호출된 함수
function func (value) {}
// 콜백함수 호출
func(function(){});
//func는 고차함수가 된다.
- 고차 함수는 매개변수를 통해 전달 받은 콜백 함수의 호출 시점을 결정해서 호출한다.
- 콜백 함수는 고차 함수에 의해 호출 되며 이 때 고차 함수는 필요에 따라 콜백 함수에 인수(value)를 전달할 수 있다.
// 전달 받는 값을 증가 시켜주는 함수
function increase(value) {
return value + 1;
}
// 전달 받는 값을 감소 시켜주는 함수
function decrease(value) {
return value - 1;
}
// 전달 받은 함수에 전달 받은 값을 적용 시켜주는 고차 함수
function apply(func, value) {
return func(value); //고차 함수는 필요에 따라 콜백 함수에 인수(value)를 전달할 수 있다.
}
// 고차 함수로 콜백 함수를 전달하며 호출한다.
console.log(apply(increase, 5));
console.log(apply(decrease, 5));
콜백 함수가 고차 함수 내부에서만 호출 된다면 콜백 함수를 익명 함수 리터럴로 정의하면서 바로 고차 함수에 전달하는 것이 일반적이다.
console.log(apply(function(value){ return value + 1; }, 10));화살표 함수 버전
console.log(apply(value => value - 1, 10));함수의 변하지 않는 공통 로직(apply함수 안에서 func함수를 호출해서 반환한다 같은 동작)은 미리 정의해두고 경우에 따라 변경 되는 로직(값이 증가한다, 감소한다 같은 콜백함수 기능)은 추상화해서 함수의 외부에서 내부로 전달하는 방식이다.
콜백 함수는 비동기 처리(이벤트, 타이머, ajax)에서 활용 되는 중요한 패턴이며 배열 고차 함수에서도 사용 된다.
- 참고
console.log([3, 1, 4, 2, 5].sort((left, right) => right - left));05_pure-and-impure-function(순수 함수와 비순수 함수)
순수 함수 : 외부 상태에 의존하지도 않고 변경하지도 않는 함수
비순수 함수 : 외부 상태에 의존하거나 외부 상태를 변경하는 함수
함수 외부 상태의 변경을 지양하는 순수 함수를 사용하는 것이 좋다.
(외부상태의 값을 사용할 경우 상태 변화를 추적하기 어려워지기 때문)
var cnt = 0;
// 순수 함수는 최소 하나 이상의 인수를 전달 받으며 인수의 불변성을 유지한다.
function increase(n) {
return ++n;
}
// 순수 함수가 반환한 결과 값을 변수에 재할당 해서 상태를 변경
cnt = increase(cnt);
console.log(cnt);
// 비순수 함수는 외부 상태에 의존하며 외부 상태를 변경한다.
function decrease() {
return --cnt;
}
// 비순수 함수는 외부 상태(cnt)를 변경하므로 상태 변화를 추적하기 어려워진다.
decrease();
console.log(cnt);
05. first-class-object
01_first-class-object(일급객체)
- 무명의 리터럴로 생성할 수 있다. 즉, 런타임에 생성이 가능하다.
- 변수나 자료구조(객체, 배열 등)에 저장할 수 있다.
- 함수의 매개변수에 전달할 수 있다.
- 함수의 반환값으로 사용할 수 있다.
// 1. 무명의 리터럴로 생성할 수 있다.
// 2. 변수에 저장할 수 있다.
var hello = function () {
return '안녕!';
};
// 2. 객체에 저장할 수 있다.
var obj = { hello };
// 3. 함수의 매개변수에 전달할 수 있다.
function repeat(func, count) {
for(var i = 0; i < count; i++) {
console.log(func());
}
// 4. 함수의 반환 값으로 사용할 수 있다.
return function () {
console.log(`${count}번 반복 완료`);
}
}
var returnFunc = repeat(obj.hello, 5);
//obj 안에 hello(키값)라는 함수호출, count 매개변수에 5 전달
// var obj = { hello(키) : hello(밸류) };
// 프로퍼티의 키, 밸류 이름 동일할 때 생략할 수 있다.(프로퍼티 참조)
returnFunc();
// returnFunc 호출
함수가 일급 객체라는 것은 함수를 객체와 동일하게 사용할 수 있다는 의미이다.
객체는 "값"이므로 함수는 값과 동일하게 취급할 수 있다.
변수 할당문, 객체의 프로퍼티 값, 배열의 요소, 함수 호출의 인수, 함수 반환문 등에서 사용할 수 있다.
