JavaScript
정렬 객체정렬 sort reverse *localeCompare
MHY.PRO
2022. 7. 7. 10:09
예제를 통해 정렬함수를 알아보자.
숫자 데이터 정렬
배열안에 있는 숫자들을 정렬해보겠다.
✺여기서 문제는 그냥 arrData.sort() 해주면 안된다. sort() 함수만 호출했을경우 문자열 형태를 비교하게되어 숫자는 정렬되지않는다.
sort()함수안에 콜백함수를 인자로 넣어 return을 해준다. a , b가 배열안에있는 데이터들이 차례대로들어와서 비교를하게된다. a - b에서 위 데이터로 비교를하면 맨처음 a=4 , b=3이온다. a-b를 해주면 1이나온다. a가 더 크기때문에 a는 뒤로밀리게되며 a와 b의 자리가 바뀔 것이다. 이런형태이다.
그렇다면 내림차순정렬은 어떻게할 것 인가?
정말 간단하다 오름차순정렬을 return a-b를 했다면 return b-a를 해준다면 서로의값이 달라지며 위치도 거꾸로 되지않겠나? 코드로 알아보자.
내림차순이 잘 되는걸 볼 수 있다.
문자열 데이터 정렬
sort()함수와 reverse()함수가 있기때문에 그냥 가져다 쓰면된다 문자열은 뭐 건드릴 필요가 없는듯 여기서 reverse()함수는 정렬하는 함수가아닌 거꾸로 뒤집는 함수이다.
* 오름차순 -> arrData.sort()
* 내림차순 -> arrData.sort().reverse()
객체 데이터 정렬
이번엔 객체데이터를 정렬해보자.
이 데이터를 정렬해보자 정렬기준은 name으로 오름차순으로 정렬 해보겠다.

다른 데이터와다른점은 localCompare함수를 사용했다는점이다. 이함수는 비교를 해주는 함수이다. if(a.name > b.name){ return = -1} 이런식으로 직접 음수,양수를 넘겨 정렬을 하기도하는데 localCompare함수를 사용하면 편하게 비교를 할 수있다.
객체 내림차순으로정렬

a.name.lacalCompare(b.name) -> b.name.localCompare(a.name)으로만 바꿔줬다. 이렇게 객채를 쉽게 정렬 할 수 있다