[JS] 배열 다루기(2)

Array.forEach()

- 배열의 모든 값으로 전달한 함수를 실행한다.

const numbers = [];
for (i = 0; i < 10; ++i) {
    numbers[i] = i * 10;
}
console.log(numbers);

function func1(num) {
    console.log(num * 3 + '입니다.');
}

// 해당 배열의 값을 하나씩 꺼내면서 반복문을 돌리는 것과 비슷하다.
numbers.forEach(func1);
numbers.forEach(function (num) {
    console.log('func2입니다...' + num)
});

 

Arrow Function

// function 키워드 대신 => 화살표를 사용해 함수를 정의할 수도 있다. (Arrow Function)
numbers.forEach((num) => {
    console.log('func3입니다...' + (num - 1));
})

 

Array.map()

- map에 전달한 함수의 리턴값들로 구성된 새로운 배열을 리턴한다. (forEach()는 리턴이 없었고, map()은 리턴이 있다.)

 

const result = numbers.map((num) => {
    return num + 5;
});

// 만약 Arrow Fuction에 한 줄 들어가는 명령어가 return이라면 {}를 생략할 수 있다.
const result2 = numbers.map((num) => num * 2);
console.log(result);
console.log(result2);

 

Array.filter()

- 전달한 함수에 각 값을 넣어서 true를 리턴한 값만 남기는 함수 (전달하는 함수는 반드시 boolean 타입 값을 리턴해야 한다.)

console.log(typeof true);
const snacks = ['초코파이', '초코하임', '화이트하임', '초코퍼지', '마가렛뜨', '초코틴틴', '가나초콜렛'];
const chocos = snacks.filter((snack) => {
    return snack.includes('초코');
});

console.log(chocos);

 

Array.reduce()

- 배열의 모든 값을 이용해 하나의 결과를 만들어내는 함수

// reduce를 이용해 총합을 구하는 경우
const total = numbers.reduce((prev, curr) => {
    console.log(`${prev} + ${curr} : return ${prev + curr}`);
    return prev + curr;
});
console.log(total);

// reduce를 이용해 가장 작은 수를 구하는 경우
const min = numbers.reduce((prev, curr) => prev > curr ? curr : prev
);
console.log(min);

// reduce를 이용해 가장 큰 수를 구하는 경우
const max = numbers.reduce((prev, curr) => prev < curr ? curr : prev
);
console.log(max);