TIL 231026(foreach, map, filter, find,

forEach문

forEach(function(val,idx,arr){};

for문과 유사하다. 차이점이 있다면 함수를 파라미터로 사용한다는 점!처리 속도도 for문보다 빠르다.
그리고 forEach 내장 함수 파라미터 첫번째 값은 value, 두번째는 index, 세번째는 배열 전체가 온다.
세번째 인자인 array는 forEach 찍으면 반복되는 배열의 수만큼 전체 배열을 반환한다.
상단의 식에 console.log를 찍어 원하는 인자만 뽑아낼 수도 있다.

만약 배열이 주어졌고, 배열의 모든 값에 +2가 되도록 하고 싶다면

const arr01 = [1, 2, 3, 4, 5];

arr01.forEach(function(plus2){
	plus2 = plus2 + 2
    console.log(plus2)});    // => 3, 4, 5, 6, 7
    

이런 식으로 만들 수도 있다.

filter

만약 arr01 배열에 있는 요소 중에서 5 이상인 값만 뽑아 새로운 배열을 쓰고 싶다면?
filter 메서드를 사용하면 된다.
다시 말해 filter 메서드는 조건에 맞는 것들만 뽑아 새로운 배열을 구성하고, return 문이 있다는 점에서
forEach와 차이가 있다.
arr01 중 2보다 큰 값들만 뽑아서 새로운 배열로 만들어 보자.

const arr01 = [1, 2, 3, 4, 5];

const filter01 = arr01.filter(function(filteredValue){
	             return filteredValue > 2});
                 console.log(filter01);  // => [3, 4, 5]

map

map 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환한다.
즉 배열의 모든 요소에 2를 곱한 값을 새로운 배열로 만들 수 있다는 것이다.

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

const map01 = arr01.map(function (val){
				return val * 2});
         		console.log(map01); // => [2, 8, 18, 32]

체이닝 기법으로 사용도 가능하다. 여러 메서드를 묶어서 사용하는 방법을 말한다.
filter.map을 많이 사용한다고 한다.

// arr안에 있는 요소를 2배씩 한 다음에
// 5 이상인 애들만 필터링 해서 새로운 배열로 만들기 !

const arr = [1, 2, 5, 10, 4];

const result23 = arr
  .map(function (값) {
    return 값 * 2;
  })
  .filter(function (값) {
    return 값 >= 5;
  })                    // => [10, 28]

find

조건을 충족하는 배열의 첫번째 요소를 반환하는 메서드이다. 앞선 메서드들과 다르게 배열을 반환하는 것이 아니라 요소 즉 value 자체를 반환한다.

const arr99 = [3, 4, 2, 7, 10]

const findValue = arr99.find(function (element){
					return element > 4 });
                    
        console.log(findValue)  // => 7