자바스크립트 배열의 리듀싱

09 Sep 2023

javascript

자바스크립트에서 배열을 다루는데 가장 많이 사용되는 기능 중 하나는 리듀싱(reducing)입니다.

리듀싱은 배열의 각 요소들을 하나의 값으로 축소하는 작업을 말합니다. 예를 들어, 배열의 모든 요소를 더하거나 평균을 구하는 등의 작업에서 리듀싱을 사용할 수 있습니다.

Array.prototype.reduce()

자바스크립트 배열 객체에서 제공하는 reduce() 메소드는 리듀싱 작업을 수행하는데 사용됩니다. 이 메소드는 다음과 같은 문법을 가지고 있습니다:

array.reduce(callback, initialValue)

callback: 배열의 각 요소에 대해 호출될 함수로, 다음 네 개의 매개변수를 가집니다:
- accumulator: 이전의 callback 호출에서 반환된 값 또는 초기값(initialValue)입니다.
- currentValue: 현재 처리되고 있는 요소입니다.
- currentIndex: 현재 처리되고 있는 요소의 인덱스입니다.
- array: reduce()가 호출된 배열 자체입니다.
initialValue: 필수적이지 않은 매개변수로, 리듀싱 작업의 초기값입니다. 만약 이 매개변수가 제공되지 않으면 배열의 첫 번째 요소가 초기값으로 사용됩니다.

리듀싱 예시

다음은 reduce() 메소드를 사용하여 배열을 리듀싱하는 예시입니다:

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

// 배열의 모든 요소를 더하는 함수
const sumReducer = (accumulator, currentValue) => accumulator + currentValue;

// 리듀싱 작업 수행
const sum = numbers.reduce(sumReducer, 0); // 초기값 0을 사용

console.log(sum); // 출력: 15

위의 예시에서는 numbers 배열의 모든 요소를 더하는 리듀싱 작업을 수행하였습니다.

리듀싱 작업은 sumReducer 콜백 함수에 의해 수행되며, 이 함수는 현재 요소(currentValue)를 이전 결과(accumulator)에 더하는 동작을 합니다.

reduce() 메소드의 두 번째 인수로 초기값 0을 제공하여 리듀싱 작업을 시작합니다. 결과값인 sum에는 배열의 모든 요소를 더한 값인 15가 저장되어 있습니다.

리듀싱의 다양한 활용

리듀싱은 배열을 다룰 때 다양한 상황에서 유용하게 활용될 수 있습니다. 예를 들어, 배열의 최대값이나 최소값을 찾는 작업, 배열의 요소들을 곱하는 작업, 배열의 문자열을 합치는 작업 등에 리듀싱을 사용할 수 있습니다.

리듀싱을 활용하는 다른 예시들을 살펴보면 다음과 같습니다:

const numbers = [1, 5, 2, 9, 3];

// 배열의 최대값 찾기
const maxReducer = (maxValue, currentValue) => currentValue > maxValue ? currentValue : maxValue;
const max = numbers.reduce(maxReducer, numbers[0]);

console.log(max); // 출력: 9

// 배열의 요소들을 곱하기
const productReducer = (accumulator, currentValue) => accumulator * currentValue;
const product = numbers.reduce(productReducer, 1);

console.log(product); // 출력: 270

// 배열의 문자열 합치기
const strings = ["Hello", " ", "World"];
const concatenateReducer = (accumulator, currentValue) => accumulator + currentValue;
const result = strings.reduce(concatenateReducer, "");

console.log(result); // 출력: "Hello World"

위의 예시들은 각각 배열에서 최대값을 찾고, 요소들을 곱하고, 문자열을 합치는 작업을 리듀싱을 사용하여 수행하는 방법을 보여줍니다.

마무리

리듀싱은 자바스크립트에서 배열을 다룰 때 매우 유용한 기능입니다. reduce() 메소드를 사용하여 간단하게 배열을 리듀싱할 수 있으며, 다양한 상황에서 유연하게 활용할 수 있습니다.

이 글에서는 reduce() 메소드의 기본적인 사용법과 몇 가지 예시를 제시하였습니다. 자바스크립트에서 배열을 다룰 때, 리듀싱 기능을 적절히 활용하여 더 효율적이고 간결한 코드를 작성할 수 있습니다.