웹개발 및 최신 테크 소식을 전하는 블로그, 웹이즈프리
자바스크립트를 사용하여 배열에 존재하는 값들 중 최대 그리고 최소값을 찾으려고합니다. 이때 어떻게하면 원하는 값을 찾을 수 있는지 아래에서 알아보겠습니다.
! 배열값 중 최대 또는 최소값 찾는 방법
배열의 최대 최소값을 구하려면 함수를 사용하거나 루프문으로 구현하는 두 가지 방법을 생각할 수 있습니다. 먼저 배열의 최대값을 구하는 방법입니다.# 배열의 최대값 구하기
최대값을 구하기 위해서 Function.prototype.apply()를 사용할 수 있습니다. 최대값을 구하는 Math.max 함수에 적용합니다. 아래 예제를 봐주세요.var myArray = [-3, -2, 1, 3, 5];
var max = Math.max.apply(null, myArray);
var max = Math.max.apply(null, myArray);
위 코드를 실행하면 아래와 같이 5가 출력됩니다.
5 // 최대값 5가 출력됨
! 루프를 사용하는 방법
for문을 사용하여 구하는 방법을 생각할 수 있습니다. 아래는 모든 배열값을 비교하여 가장 큰 값이 나올때까지 반복하는 루프문입니다.var myArray = [-10, -1, 0, 1, 10];
for(var i = 0; i < myArray.length; i++) {
// maxNum 값이 없는 경우 현재 배열값으로 지정
if (!maxNum) {
maxNum = myArray[i];
};
// maxNum의 값과 현재 값을 비교해서 maxNum값을 가장 큰 값으로 유지
if (maxNum < myArray[i]) {
maxNum = myArray[i];
}
}
console.log(maxNum);
for(var i = 0; i < myArray.length; i++) {
// maxNum 값이 없는 경우 현재 배열값으로 지정
if (!maxNum) {
maxNum = myArray[i];
};
// maxNum의 값과 현재 값을 비교해서 maxNum값을 가장 큰 값으로 유지
if (maxNum < myArray[i]) {
maxNum = myArray[i];
}
}
console.log(maxNum);
위 스크립트를 실행하면 maxNum에 최대값 10이 저장되어 출력할 것입니다.
10
# 배열의 최소값 구하기
최소값을 구하는 방법 역시 배열에 Function.prototype.apply()를 사용할 수 있습니다. 이번에는 Math.min() 함수를 사용하여 아래와 같이 apply()를 적용합니다.var myArray = [-3, -2, 1, 3, 5]
var min = Math.min.apply(null, myArray);
var min = Math.min.apply(null, myArray);
위 코드를 실행하면 아래와 같이 -3이 출력됩니다.
-3 // 최소값 -3이 출력됨
! 루프를 사용하여 최소값 구하는 방법
이 방법 역시 위의 최대값 방식과 동일한 알고리즘을 사용합니다. 다만 최대값이 아닌 최소값을 저장합니다.var myArray = [-10, -1, 0, 1, 10];
for(var i = 0; i < myArray.length; i++) {
// minNum 값이 없는 경우 현재 배열값으로 지정
if (!minNum) {
minNum = myArray[i];
};
// minNum의 값과 현재 값을 비교해서 minNum값을 가장 작은 값으로 유지
if (minNum > myArray[i]) {
minNum = myArray[i];
}
}
console.log(minNum);
for(var i = 0; i < myArray.length; i++) {
// minNum 값이 없는 경우 현재 배열값으로 지정
if (!minNum) {
minNum = myArray[i];
};
// minNum의 값과 현재 값을 비교해서 minNum값을 가장 작은 값으로 유지
if (minNum > myArray[i]) {
minNum = myArray[i];
}
}
console.log(minNum);
위 스크립트를 실행하면 minNum에 최소값 -10이 저장되어 출력할 것입니다.
-10
# 마치면서
여기까지 최소 최대값을 구하는 방법을 알아보았습니다. 현재 Webisfree.com에 나오는 방문자 숫자 역시 최대, 최소값을 사용하여 그래프의 높이를 구하였습니다.
스크린샷) 방문자 수를 보여주는 그래프이 역시 위 방법을 적용하여 구현하였습니다. 다음번에는 배열의 평균값을 구하는 방법 역시 알아보도록 하겠습니다.
아래의 글도 찾고 계시지 않나요?