JavaScript로 개발하다 보면 배열에 담긴 숫자들 중에서 가장 큰 값을 찾아야 하는 경우가 자주 발생합니다. 예를 들어 성적 목록에서 최고 점수를 구하거나, 상품 가격 중 최고가를 확인할 때가 대표적입니다.
reduce() 메서드를 활용한 최댓값 찾기
배열의 최댓값을 구하는 대표적인 방법은 reduce() 메서드를 사용하는 것입니다. reduce()는 배열의 각 요소를 순회하면서 콜백 함수를 실행하고, 그 결과를 누적하여 하나의 값으로 반환합니다.
아래 예제 코드를 실행하면 배열 [340, 25, 530, 299]에서 가장 큰 수인 530이 출력됩니다.
예제 코드
<!DOCTYPE html>
<html>
<body>
<script>
var myArr = [340, 25, 530, 299];
var max = myArr.reduce(function(a, b) {
return (a > b) ? a : b;
});
document.write("배열에서 가장 큰 수: " + max);
</script>
</body>
</html>실행 결과
배열에서 가장 큰 수: 530
코드 동작 원리
위 코드의 핵심은 콜백 함수 (a, b) => (a > b) ? a : b입니다. 이 함수는 두 값을 비교하여 더 큰 쪽을 반환하는 삼항 연산자(조건 연산자)로 구성되어 있습니다.
- a: 지금까지 비교한 결과 중 누적된 최댓값
- b: 현재 순회 중인 배열의 요소
배열을 처음부터 끝까지 순회하며 각 단계마다 더 큰 값이 남게 되므로, 최종적으로 배열 전체의 최댓값이 반환됩니다.
다른 방법: Math.max()와 스프레드 연산자
ES6 이상 환경에서는 Math.max()와 스프레드 연산자(...)를 조합하면 더욱 간결하게 작성할 수 있습니다.
const myArr = [340, 25, 530, 299]; const max = Math.max(...myArr); console.log(max); // 530
두 방법 모두 동일한 결과를 반환하지만, Math.max() 방식이 코드가 짧고 직관적이라는 장점이 있습니다. 반면 매우 긴 배열을 다룰 때는 스프레드 연산자가 인자 개수 제한으로 오류를 일으킬 수 있으므로, 이 경우에는 reduce() 방식이 더 안전합니다.