JavaScript - 배열 함수(고차 함수)

for문을 효율적으로!

우선, 고차 함수(higher order function)를 알아보자.

고차 함수는 함수를 인자(argumentm)로 받을 수 있고, 함수의 형태로 리턴할 수 있는 함수이다.

다른 함수의 인자로 전달되는 함수를 콜백 함수라고 부른다. (작업 완료 시 호출하는 경우가 많아 답신 전화라는 뜻의 콜백으로 이름 지어졌다.)

 

1. forEach()

주어진 함수를 배열의 요소 각각에 실행한 결과를 반환한다.

실행할 함수에는 세 가지 매개변수가 온다.

• currentValue: 처리할 현재 요소

• index(optional): 처리할 현재 요소의 인덱스

• array(optional): forEach()를 호출한 배열

// for 반복문
const items = ['item1', 'item2', 'item3'];

for (let i = 0; i < items.length; i++) {
  console.log(items[i]);
};

// forEach()
const items = ['item1', 'item2', 'item3'];

items.forEach((item) => console.log(item));

2. map()

주어진 함수를 배열의 요소 각각에 실행한 결과를 모아 새로운 배열을 반환한다.

실행할 함수에는 세 가지 매개변수가 온다.

• currentValue: 처리할 현재 요소

• index(optional): 처리할 현재 요소의 인덱스

• array(optional): forEach()를 호출한 배열

const arr = [1, 2, 3, 4];

const checkEvenOrNot = (arr) => {
  return arr.map((el) => {
    if (el === 0 || el % 2 !== 0) {
      return "no";
    } else {
      return "ok";
    }
  });
};

checkEvenOrNot(arr); // ['no', 'ok', 'no', 'ok']

3. filter()

주어진 함수의 조건에 참인 요소를 모아 새로운 배열로 반환한다.

실행할 함수에는 세 가지 매개변수가 온다.

• currentValue: 처리할 현재 요소

• index(optional): 처리할 현재 요소의 인덱스

• array(optional): forEach()를 호출한 배열

const arr = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
const filtered = arr.filter(word => word.length > 6);

filtered; // ['exuberant', 'destruction', 'present']

reduce, some, every, find, findIndex