[Javascript] 고차함수

 

FILTER

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present']; 
const result = words.filter(word => word.length > 6); 
console.log(result); // expected output: Array ["exuberant", "destruction", "present"]

arr.filter(callback(element[, index[, array]])[, thisArg])

 

callback이 true로 반환한 요소로 이루어진 새로운 배열을 return한다. 호출되는 배열을 변화시키지 않는다

 

MAP

const array1 = [1, 4, 9, 16]; 

// pass a function to map 
const map1 = array1.map(x => x * 2); 
console.log(map1); // expected output: Array [2, 8, 18, 32]

arr.map(callback(currentValue[, index[, array]])[, thisArg])

 

map은 callback 함수를 각각의 요소에 대해 한번씩 순서대로 불러 그 함수의 반환값으로 새로운 배열을 만든다.

 

REDUCE

const array1 = [1, 2, 3, 4]; 
const reducer = (accumulator, currentValue) => accumulator + currentValue; 

// 1 + 2 + 3 + 4 
console.log(array1.reduce(reducer)); // expected output: 10 

// 5 + 1 + 2 + 3 + 4 
console.log(array1.reduce(reducer, 5)); // expected output: 15

arr.reduce(callback[, initialValue])

 

배열.reduce((누적값, 현잿값, 인덱스, 요소) => { return 결과 }, 초깃값) 형태. 첫번째 인자가 누적값임을 주의해야 한다.

 

const promiseFactory = (time) => { 
    return new Promise((resolve, reject) => { 
        console.log(time); 
          setTimeout(resolve, time); 
        }); 
       }; 

 [1000, 2000, 3000, 4000].reduce((acc, cur) => { 
     return acc.then(() => promiseFactory(cur)); 
    }, Promise.resolve()); 

// 바로 1000
// 1초 후 2000
// 2초 후 3000 
// 3초 후 4000

 

reduce의 첫번째 인자가 누적값임을 이용하여 다양하게 사용이 가능하다. 반복하는 모든 것에 reduce를 사용할 수 있으므로 다른 고차함수들도 reduce를 사용하여 구현이 가능하다.

 

SORT

const months = ['March', 'Jan', 'Feb', 'Dec']; 
months.sort(); 
console.log(months); 
// expected output: Array ["Dec", "Feb", "Jan", "March"] 

const array1 = [1, 30, 4, 21, 100000]; 
array1.sort(); 
console.log(array1); 
// expected output: Array [1, 100000, 21, 30, 4]

arr.sort([compareFunction])

 

compareFunction을 따로 지정하지 않으면 유니코드 순서로 정렬이 된다. 따라서 '70'이 '2'보다 앞에 오게 된다. compareFunction을 원하는데로 구현하여 다양하게 정렬할 수 있다.

새로운 배열이 만들어 지는 것이 아니라 기존 배열이 정렬되는 것임을 주의해야 한다.

 

EVERY

const isBelowThreshold = (currentValue) => currentValue < 40; 
const array1 = [1, 30, 39, 29, 10, 13]; 
console.log(array1.every(isBelowThreshold)); // expected output: true

 

every는 callback이 거짓을 반환하는 요소를 찾을 때까지 배열에 있는 각 요소에 대해 한 번씩 callbackFn 함수를 실행. 해당하는 요소를 발견한 경우 every는 즉시 false를 반환. 그렇지 않으면, 즉 모든 값에서 참을 반환하면 true를 반환.

some: every의 반대. 한개라도 조건을 만족하면 true를 반환

 

참조

Array.prototype.filter() - JavaScript | MDN

https://www.zerocho.com/category/JavaScript/post/5acafb05f24445001b8d796d

Array.prototype.reduce() - JavaScript | MDN

Array.prototype.sort() - JavaScript | MDN