[javascript]Array.sort() 사용 시 숫자 정확하게 정렬하기(1,5,10,...)

2024/02/27 기준 | 오름차순과 내림차순 설명이 반대로 되어 있는 것을 보고 수정하였습니다.

 

숫자정렬

Array.sort() 함수는 인자값으로 비교함수를 받으며, 만일 비교함수를 인자로 입력하지 않으면  Array의 모든 요소를 문자로 변환하고, 유니코드 기준에 따라서 크기 순서대로 정렬하는 함수이다.

 

때문에, 비교함수를 넣지 않고 10의 자리로 넘어가는 경우  1,10,100,2 와 같은 형식으로 정렬된다. 

 

따라서 문자열은 문자로, 숫자는 숫자 타입으로 정렬하기 위해서는 인자값으로 배열의 각 요소를 비교할 수 있는 비교함수를 정의하여 호출해줘야 한다. 

 

<오름차순 정렬>

function numberSort(num1,num2){  // 선택적 비교 함수 
    return num1 – num2 // num1 – num2가 음수를 반환다면, num1이 num2 앞에 온다. 양수면 반대이다.
}
[10,15,6,5,3,2,8].sort(numberSort) //오름차순으로 모두 정렬 될 때 까지 비교를 반복한다.

//출력) [2, 3, 5, 6, 8, 10, 15]

 

numberSort 라는 비교함수를 정의하였다. 이 함수는 인자로 받은 num1 과 num2 사이에 빼기 연산한 결과를 반환한다. 

 

오름차순으로 정렬하는 연산 과정은 다음과 같다.

----------------------------

1단계) [ 10,15,6,5,3,2,8]  에서 10과 15가 num1, num2 로 전달된다. 

 

2단계) 함수 내 연산을 수행하여 10-15 = -5 로 음수가 반환되었으므로, 10은 15보다 작다는 것을 확인하였으므로 10이 15의 앞에 온다.

 

3단계) [ 10,15,6,5,3,2,8] 에서 15와 6이 num1, num2 로 전달된다.

 

4단계) 연산을 통해 15-6 = 9로 양수가 반환되었으므로, 15가 6보다 크므로, 6이 15의 앞에 온다.  [ 10,6,15,5,3,2,8]

----------------------------

 

위 원리를 바탕으로 모든 숫자가 오름차순(작은 숫자가 앞에 큰 숫자가 뒤에오는 순)으로 모두 정렬될 때 까지 반복하여 순회한다.

 

 

<내림차순 정렬>

내림차순 정렬의 반환 조건을 반대로 바꾸기만 하면 내림차순 이다.

function numberSort(num1,num2){  // 선택적 비교 함수 
    return num2 – num1 // num2 – num1가 양수를 반환하면, num2가 num1의 앞에 온다. 음수면 반대이다.
}
[10,15,6,5,3,2,8].sort(numberSort) //오름차순으로 모두 정렬 될 때 까지 비교를 반복한다.


//출력) [15, 10, 8, 6, 5, 3, 2]

 

 

참고자료

Array.prototype.sort() - JavaScript | MDN (mozilla.org)

Array.prototype.sort() - JavaScript | MDN