본문 바로가기
programming/javascript

자바스크립트 배열 최대값 최소값 구하기 Find Max and Min value in Javascript Array

by 개코 - 개발과 코딩 2022. 1. 4.

자바스크립트 배열에서 최대값과 최소값을 구하는 것은 알면 쉽고 모르면 어려운 부분일 수 있다. 방법은 많지만, 정렬을 사용하는 방법이 있고, Math 객체를 사용하는 방법이 있다. 특수한 경우 사용자 함수를 만들어 사용해야 할 경우도 있다. 이 경우들에 대해 자바스크립트 숫자 배열에서 최대값과 최소값을 찾아보도록 한다.

자바스크립트 배열 최대값 최소값 구하기
Find Max and Min value in Javascript Array

자바스크립트 최대값과 최소값을 구하는 것은 여러가지 방법이 있다.

프로그래밍 책자에는 가장 간단한 알고리즘으로 소개하고 있기도 하다.

자바스크립트에서 제공하는 메서드를 사용해도 되고, 상황에 맞게 개발자가 스스로 만들어 사용해도 된다.

최대값과 최소값을 구하는 방법은 여러가지가 있지만 가장 편한 방법은 이미 제공하는 메서드를 사용하는 것이다.

개발자 스스로가 만드는 경우라면 아마 특별한 경우 외에는 거의 만들 일이 없을 수 있다.

자바스크립트에서 최대값, 최소값을 구하는 방법을 여러가지 작성해 본다.

최대값 최소값

자바스크립트 배열에서 숫자형 데이터 집합을 사용할 때는 한두개가 아닐 것이다.

아마 적게는 10개 많게는 몇 만개 또는 그 이상일 수 있다.

최대값은 숫자형 배열에서 가장 큰 수를 말한다.

최소값은 숫자형 배열에서 가장 작은 수를 말한다.

지금이야 어떤 프로젝트를 해도 검색만 하면 최대값, 최소값을 구하는 코드는 많이 구할 수 있다.

sort reverse 메서드 사용

sort 와 reverse 메서드는 가장 자바스크립트의 정렬에 사용하는 메서드이다.

숫자형 배열을 정렬하려면 sort 와 reverse 메서드 사용시 비교함수를 사용해야 한다.

자바스크립트 배열의 맹점이 있기 때문

숫자열 배열의 맹점 대한 포스팅은 이전의 내용을 참고해 본다.

이제 sort 와 reverse 메서드를 사용하여 자바스크립트 숫자형 배열의 최대값과 최소값을 구해보자.

숫자형 배열을 정렬하면 가장 첫번째 수는 최대값 또는 최소값이 될 것이다.

그렇다 정렬 후 가장 처음 값을 가져오면 그것이 최대값 최소값이 된다.

코드를 보자.

<!DOCTYPE html>
<html>
    <body>

        <script>

            /**
             * 변수
             */
             let vNumber, vMax, vMin, vLen;

             /**
             * 원본 배열
             */
            vNumber = [100, 1000, 10, 10000, 20, 300, 4000];
            console.log('원본', typeof(vNumber), vNumber);

            console.log('----------')

            vMax = vNumber.sort(function(a, b){return b - a});
            vMax = vMax[0];
            console.log('sort 최대값', typeof(vMax), vMax);

            console.log('----------')

            vMix = vNumber.sort(function(a, b){return a - b});
            vMix = vMix[0];
            console.log('sort 최소값', typeof(vMix), vMix);

            console.log('----------')

            vMax = vNumber.reverse(function(a, b){return b - a});
            vMax = vMax[0];
            console.log('reverse 최대값', typeof(vMax), vMax);

            console.log('----------')

            vMix = vNumber.sort(function(a, b){return a - b});
            vMix = vMix[0];
            console.log('reverse 최소값', typeof(vMix), vMix);

            console.log('----------')

        </script>

    </body>
</html>

숫자형 배열을 비교함수와 함께 정렬을 하고 정렬한 배열을 첫번째 값을 가져오고 있다.

자바스크립트 배열의 첫번째 요소를 접근하려면 인덱스를 이용한다.

당연히 인덱스는 0번째이다.

결과화면을 보자. 최대값과 최소값을 잘 가져오고 있다.

Math 객체 사용

자바스크립트는 수학과 관련한 Math 객체를 가지고 있다.

Math 객체를 이용하면 자바스크립트 배열의 최대값과 최소값을 구할 수 있다.

Math.max 는 배열의 최대값을 구한다.

Math.min 은 배열의 최소값을 구한다.

코드를 보자.

<!DOCTYPE html>
<html>
    <body>

        <script>

            /**
             * 변수
             */
             let vNumber, vMax, vMin, vLen;

             /**
             * 원본 배열
             */
            vNumber = [100, 1000, 10, 10000, 20, 300, 4000];
            console.log('원본', typeof(vNumber), vNumber);

            console.log('----------')

            vMax = Math.max.apply(null, vNumber);
            console.log('Math.max 최대값', typeof(vMax), vMax);

            console.log('----------')

            vMin = Math.min.apply(null, vNumber);
            console.log('Math.min 최소값', typeof(vMin), vMin);

            console.log('----------')

        </script>

    </body>
</html>

코드가 줄어들었다. 간결하다.

이런 객체들을 많이 알아두면 개발할 떄 많이 참고할 수 있다.

결과 화면을 보자.

이번에도 자바스크립트 배열에서 최대값, 최소값을 잘 가져오고 있다.

사용자 함수 만들기

이 경우가 문제다.

최대값 최소값을 구하는 메서드가 이미 있다고 해도

남들이 잘 만들어 놓은 함수나 메서드가 있다고 해도 특수한 경우가 발행할 수 있다.

특정한 수치는 계산에서 빼던지 혹은 제외하던지 혹은 더하던지

경우는 많다.

그럴 땐 사용자정의 함수를 만들어 비교해야 한다.

하지만, 이런 경우는 거의 드물다.

최대값, 최소값을 구하기 전에 배열에서 이미 값을 제거하는게 더 편할 수 있다.

어쨌든 코드를 보자.

여기서 나오는 것이 양의 무한대인 Infinity, 음의 무한대인 -Infinity 값이 나타난다.

쉽게 말하면

Infinity 는 자바스크립트에서 인식 가능한 가장 큰 수 이다.

-Infinity 는 자바스크립트에서 인식 가능한 가장 작은 수 이다.

이 두 수와 비교하여 사용자 함수를 만들게 된다.

코드를 보자.

<!DOCTYPE html>
<html>
    <body>

        <script>

            /**
             * 변수
             */
             let vNumber, vMax, vMin, vLen;

             /**
             * 원본 배열
             */
            vNumber = [100, 1000, 10, 10000, 20, 300, 4000];
            console.log('원본', typeof(vNumber), vNumber);

            console.log('----------')

            console.log('Infinity', typeof(Infinity), Infinity);
            console.log('-Infinity', typeof(-Infinity), -Infinity);

            console.log('----------')

            vLen = vNumber.length;
            vMax = -Infinity;
            while (vLen--) {
                if (vNumber[vLen] > vMax) {
                    vMax = vNumber[vLen];
                }
            }
            console.log('사용자함수 최대값', typeof(vMax), vMax);

            console.log('----------')

            vLen = vNumber.length;
            vMin = Infinity;
            while (vLen--) {
                if (vNumber[vLen] < vMin) {
                    vMin = vNumber[vLen];
                }
            }
            console.log('사용자함수 최소값', typeof(vMin), vMin);

            console.log('----------')

        </script>

    </body>
</html>

배열을 일일히 반복하면서 비교하고 있다.

가장 큰 수인 Max 값을 구하기 위해 두 수를 비교하여 큰 수를 저장하고 다시 반복한다.

가장 작은 수인 Min 값을 구하기 위해 두 수를 비교하여 작은 수를 저장하고 다시 반복한다.

결과화면을 보자.

이번에도 최대값과 최소값을 잘 출력하고 있다.

반응형

'programming > javascript' 카테고리의 다른 글

자바스크립트 배열 반복 map 메서드 사용 Using javascript iteration map method  (0) 2022.01.08
자바스크립트 배열 반복 foreach 메서드 사용 Using javascript iteration foreach method  (0) 2022.01.06
자바스크립트 숫자 배열 비교 함수 정렬 Sorting Javascript Number Array Compare Function  (0) 2022.01.03
자바스크립트 숫자 배열 정렬 Sorting Javascript Number Array  (0) 2022.01.02
자바스크립트 문자열 배열 정렬 Sorting Javascript Sring Array  (0) 2021.12.31

관련글

댓글

티스토리툴바