JavaScript / Math.max()와 Math.min()으로 최댓값·최솟값 구하기

Math.max()는 전달한 숫자 중 가장 큰 값, Math.min()은 가장 작은 값을 반환합니다. 배열을 비교할 때는 Math.max(...values)처럼 펼침 문법을 사용합니다. 빈 배열이나 숫자가 아닌 입력을 그대로 넘기면 기대하지 않은 Infinity 또는 NaN이 나올 수 있어 입력 확인이 필요합니다.

여러 인수의 최댓값과 최솟값

두 함수는 Math 객체에서 호출하며 인수를 쉼표로 나눠 전달합니다. 양수와 음수를 함께 비교할 수 있습니다.

console.log(Math.max(2, 5, -3)); // 5
console.log(Math.min(2, 5, -3)); // -3
console.log(Math.max(-8, -2)); // -2

인수를 하나도 전달하지 않으면 Math.max()는 -Infinity, Math.min()은 Infinity를 반환합니다. 이것은 실제 목록에서 선택된 값이 아닙니다. MDN의 Math.max() 문서와 Math.min() 문서에서 반환 규칙을 확인할 수 있습니다.

배열을 전달할 때와 잘못된 값 처리

함수 인수와 배열은 다릅니다. Math.max(values)로 배열 자체를 넘기지 말고 Math.max(...values)로 요소를 펼칩니다. 다만 매우 큰 배열은 함수 인수 제한에 걸릴 수 있으므로 그런 경우에는 반복문이나 reduce()로 순회하세요.

const values = [2, 5, -3];
console.log(Math.max(...values)); // 5
console.log(Math.min(...values)); // -3
console.log(Math.max(...[])); // -Infinity
console.log(Math.min(...[])); // Infinity
console.log(Math.max(2, NaN)); // NaN

사용자가 입력한 문자열을 숫자로 바꾼 뒤 Number.isFinite()로 검사합니다. 빈 문자열을 Number("")로 바꾸면 0이 되므로, 숫자 변환 전에 빈 항목을 별도로 걸러야 합니다.

전체 예제: 숫자 목록 비교하기

다음 코드를 math-max-min.html로 저장해 브라우저에서 엽니다. 쉼표로 구분한 숫자를 입력하고 버튼을 누르면 최댓값과 최솟값이 표시됩니다. 빈 항목이나 숫자가 아닌 값은 결과 대신 안내 문구로 처리합니다.

<!doctype html>
<html lang="ko">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>최댓값 최솟값 비교</title>
</head>
<body>
<label for="numbers">숫자 목록 (쉼표로 구분)</label>
<input id="numbers" value="2, 5, -3">
<button id="compare" type="button">비교</button>
<pre id="result" aria-live="polite"></pre>
<script>
const input = document.querySelector('#numbers');
const result = document.querySelector('#result');

document.querySelector('#compare').addEventListener('click', () => {
  const parts = input.value.split(',').map(part => part.trim());
  const values = parts.map(Number);
  if (parts.some(part => part === '') ||
      values.some(value => !Number.isFinite(value))) {
    result.textContent = '유한한 숫자를 쉼표로 구분해 입력하세요.';
    return;
  }
  result.textContent = `최댓값: ${Math.max(...values)}\n` +
    `최솟값: ${Math.min(...values)}`;
});
</script>
</body>
</html>

기본 입력 2, 5, -3의 결과는 최댓값 5, 최솟값 -3입니다. -8, -2로 바꾸면 -2와 -8이 나옵니다. 마지막에 쉼표를 더하면 빈 항목이 생겨 안내 문구가 나옵니다. 예제는 작은 입력 목록을 다루므로 펼침 문법을 사용하며, 실제 대용량 데이터라면 순회 방식으로 바꾸세요.