자바스크립트에서 특별 대우를 받음
대표적인 예 => 함수
- 변수에 할당을 할 수 있다
- 다른 함수의 전달인자로 전달될 수 있다
- 다른 함수의 결과로서 리턴될 수 있다
/*
* 아래는 변수 square에 함수를 할당하는 함수 표현식입니다.
* JavaScript에서 함수는 일급 객체이기 때문에 변수에 할당할 수 있습니다.
*
* 함수 표현식은 할당 전에 사용할 수 없습니다.
* square(7); // --> ReferenceError: Can't find variable: square
*/
const square = function (num) {
return num * num;
};
// 변수 square에는 함수가 할당되어 있으므로 (일급 객체), 함수 호출 연산자 '()'를 사용할 수 있습니다.
output = square(7);
console.log(output); // --> 49
다른 함수의 전달인자(argument)로 전달되는 함수
function double(num) {
return num * 2;
}
function doubleNum(func, num) {
return func(num);
}
/*
* 함수 doubleNum은 다른 함수를 인자로 받는 고차 함수입니다.
* 함수 doubleNum의 첫 번째 인자 func에 함수가 들어올 경우
* 함수 func는 함수 doubleNum의 콜백 함수입니다.
* 아래와 같은 경우, 함수 double은 함수 doubleNum의 콜백 함수입니다.
*/
let output = doubleNum(double, 4);
console.log(output); // -> 8
function adder(added) {
return function (num) {
return num + added;
};
}
/*
* 함수 adder는 다른 함수를 리턴하는 고차 함수입니다.
* adder는 인자 한 개를 입력받아서 함수(익명 함수)를 리턴합니다.
* 리턴되는 익명 함수는 인자 한 개를 받아서 added와 더한 값을 리턴합니다.
*/
// adder(5)는 함수이므로 함수 호출 연산자 '()'를 사용할 수 있습니다.
let output = adder(5)(3); // -> 8
console.log(output); // -> 8
// adder가 리턴하는 함수를 변수에 저장할 수 있습니다.
// javascript에서 함수는 일급 객체이기 때문입니다.
const add3 = adder(3);
output = add3(2);
console.log(output); // -> 5
function double(num) {
return num * 2;
}
function doubleAdder(added, func) {
const doubled = func(added);
return function (num) {
return num + doubled;
};
}
/*
* 함수 doubleAdder는 고차 함수입니다.
* 함수 doubleAdder의 인자 func는 함수 doubleAdder의 콜백 함수입니다.
* 함수 double은 함수 doubleAdder의 콜백으로 전달되었습니다.
*/
// doubleAdder(5, double)는 함수이므로 함수 호출 기호 '()'를 사용할 수 있습니다.
doubleAdder(5, double)(3); // -> 13
// doubleAdder가 리턴하는 함수를 변수에 저장할 수 있습니다. (일급 객체)
const addTwice3 = doubleAdder(3, double);
addTwice3(2); // --> 8
// 아래 코드에서 '짝수'와 '길이 5 이하'는 문법 오류(syntax error)에 해당합니다.
// 의미만 이해해도 충분합니다.
let arr = [1, 2, 3, 4];
let output = arr.filter(짝수);
console.log(output); // ->> [2, 4]
arr = ['hello', 'code', 'states', 'happy', 'hacking'];
output = arr.filter(길이 5 이하)
console.log(output); // ->> ['hello', 'code', 'happy']
// 함수 표현식
const isEven = function (num) {
return num % 2 === 0;
};
let arr = [1, 2, 3, 4];
// let output = arr.filter(짝수);
// '짝수'를 판별하는 함수가 조건으로서 filter 메서드의 전달인자로 전달됩니다.
let output = arr.filter(isEven);
console.log(output); // ->> [2, 4]
const isLteFive = function (str) {
// Lte = less then equal
return str.length <= 5;
};
arr = ['hello', 'code', 'states', 'happy', 'hacking'];
// output = arr.filter(길이 5 이하)
// '길이 5 이하'를 판별하는 함수가 조건으로서 filter 메서드의 전달인자로 전달됩니다.
let output = arr.filter(isLteFive);
console.log(output); // ->> ['hello', 'code', 'happy']
하나의 데이터를 다른 데이터로 매핑(mapping)할때 사용
배열을 하나의 값으로 만들어 줌. 초기값을 정하거나 배열의 첫번째 요소를 초기값으로 정함. 특정방법에 따라 원하는 하나의 형태로 응축함(reduction)
ex) arr.reduce(acc, cur)
acc
: 응축된 값// 초기값을 설정하지 않으면 배열의 첫번째 요소가 acc
이며 cur
은 두번째 요소부터 시작
cur
: 현재 배열요소
let arr = [1,2,3,4,5]
arr.reduce(acc, cur)
<초기값 없을 때: 배열의 첫번째 요소가 acc
, cur
은 두번째 요소부터 시작>
acc | cur | return 값 |
---|---|---|
1 | 2 | 1+2 |
3 | 3 | 3+3 |
6 | 4 | 6+4 |
10 | 5 | 10+5 |
15 | 15 |
let arr = [1,2,3,4,5]
arr.reduce{(acc, cur), 10}
<초기값 있을 때: cur
은 첫번째 요소부터 시작>
acc | cur | return 값 |
---|---|---|
10 | 1 | 10+1 |
11 | 2 | 11+2 |
13 | 3 | 13+3 |
16 | 4 | 16+4 |
20 | 5 | 10+5 |
25 | 25 |
<조건이 있을 경우>
let arr = [1,2,3,4,5]
arr.reduce( (acc, cur) => {
if(cur % 2 === 0) {
return acc + cur;
} else {
return acc;
}
},0)
acc | cur | return 값 |
---|---|---|
0 | 1 | 0 |
0 | 2 | 0+2 |
2 | 3 | 2 |
2 | 4 | 2+4 |
6 | 5 | 6 |
6 | 6 |
복잡한 어떤 것을 압축해서 핵심만 추출한 상태로 만드는 것