[JavaScript] array.sort() 동작원리 파악하기

Array.sort()

나는 Array.sort() 를 사용하면서 그냥 자동으로 정열을 해주는지 알았는데 그게 아니였다...

const arr = [1, 3, 5, 2, 3, 7, 8, 11, 22, 33, 88]
console.log("original arr : ", arr)
arr.sort()
console.log("sorted arr : ", arr)

이 코드를 봤을때 누구나 [1 , 2 , 3 , 5, 7 , 8 , 11 .... , 88] 이 결과를 생각하겠지만

실제 결과는 달랐다.

result

---

[compareFunction]

기본적으로 array.sort() 메서드는 문자열을 기준으로 정렬하기때문에 위와같은 결과값이 나왔따.

만약에 내가 원하는 결과값으로 정렬하고 싶은 경우에는 메서드안에 compareFunction로 인자를 넣어줘야 한다.

const arr = [1, 3, 5, 2, 3, 7, 8, 11, 22, 33, 88]
console.log("original arr : ", arr)
arr.sort((a, b) => {
  console.log(`a : ${a} , b : ${b}`)
  return a - b
})
console.log("sorted arr : ", arr)

result

근데 그냥 보기에는 복잡해 보인다.

a,b가 뭔지도 모르겠고 어떤경우에 정렬이 되는지도 직관적이지 않다. a,b를 콘솔로 찍어보면

이런식으로 찍히는데 처음 배열은 const arr = [1, 3, 5, 2, 3, 7, 8, 11, 22, 33, 88] 이런식인데

a = 1 , b = 3 이런식으로 들어가는게 아니라 b에 배열 첫번째값 , a에 배열 두번째 값이 들어간다.

 a : next 값 , b : current값 

---

숫자 비교 

1) return a - b

-> 위 예시로 본다면 3 - 1 = 양수 이므로 자리 교환을 하지 않는다 

즉 오름차순 정렬 

 

2) return b - a 

-> 이경우에는 1 - 3 = 음수 이므로 자리 교환을 한다.

즉 내림차순 정렬 

 

sort() 메서드는 원본 배열을 그대로 바꾸기 때문에 사용할 때 주의 해야한다.