[자바스크립트(JavaScript)] 배열 메서드

// 배열 메서드

• forEach
• map
• filter
• find
• reduce
• some
• every

자바에서 stream으로 접했던 익숙한 메서드들이 보일 것이다.

자바스크립트의 이러한 메서드들도 함수형 프로그래밍의 개념을 활용하지만, 일반적으로 stream 이라고 부르지는 않는다.

---

// ForEach

- 배열에 있는 요소마다 함수를 실행한다.

- for .. of 루프가 나오기 전에는 자주 쓰였으나 for .. of 가 등장한 이후 현재는 자주 쓰이지 않는다.

배열(또는 객체).forEach(function(요소) {
    //처리
})

---

numbers.forEach(function (el) {
  if(el % 2 === 0) {
    console.log(el);
  }
});

const movies = [
  {
      title: 'Amadeus',
      score: 99
  },
  {
      title: 'Stand By Me',
      score: 85
  },
  {
      title: 'Parasite',
      score: 95
  },
  {
      title: 'Alien',
      score: 90
  }
];

movies.forEach(function(movie) {
  console.log(`${movie.title} - ${movie.score}/100`);
})

---

// Map

- 콜백 함수를 받아서 배열의 요소당 한 번씩 실행한다.

- 콜백의 반환 값을 이용해서 새로운 배열을 생성한다.
   > 배열을 다른 상태로 매핑!

const 새로운 배열 변수명 = 배열.map(function(인자) {
  // return 처리
})

---

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const doubles = numbers.map(num => {
  return num * 2;
});

console.log(doubles);

const movies = [
  {
      title: 'Amadeus',
      score: 99
  },
  {
      title: 'Stand By Me',
      score: 85
  },
  {
      title: 'Parasite',
      score: 95
  },
  {
      title: 'Alien',
      score: 90
  }
];

const titles = movies.map(movie => {
  return movie.title;
})

console.log(titles);

---

// Filter

- 요소로 구성된 배열에서 필터링을 하거나 부분 집합을 모아 새 배열을 만든다.

- boolean 값이 true인 것만 필터링 한다.

const 새로운 배열 변수명 = 배열.filter(function(인자) {
  // return 처리(true 값이 나오는 처리);
})

---

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const evenNumbers = numbers.filter(n => n % 2 === 0);
console.log(evenNumbers);

const movies = [
  {
      title: 'Amadeus',
      score: 79
  },
  {
      title: 'Stand By Me',
      score: 85
  },
  {
      title: 'Parasite',
      score: 75
  },
  {
      title: 'Alien',
      score: 90
  }
];

const goodMovies = movies.filter(movie => movie.score > 80);
const goodTitles = goodMovies.map(movie => movie.title);
console.log(goodTitles);

---

// Every, Some

- 조건에 대한 boolean 값을 반환한다.

- Every : 모든 요소가 조건을 만족하면 true
- Some : 조건을 만족하는 요소가 하나라도 있으면 true

배열.every[some](function(인자) {
  // return 처리(true 값이 나오는 처리);
})

---

 

const exams = [80, 98, 92, 78, 77, 90, 89, 84, 81, 77];

console.log('Array: ', exams);
console.log('Every: ', exams.every(score => score >= 75));
console.log('Some: ', exams.some(score => score >= 75));

---

// Reduce

- 배열의 각 요소를 점차 줄여가면서 하나의 값만 남긴다.

- 변수와 요소 두 매개변수를 처리하고 그 결과값을 변수로 다시 return한다.

let 변수 = 배열.reduce((변수, 요소) => { 
	//return 처리
})

---

const prices = [9.99, 1.50, 19.99, 49.99, 30.50];

let total = prices.reduce((total, price) => total + price);
console.log(total);

let min = prices.reduce((min, price) => min > price ? price : min);
console.log(min);