[JavaScript] sort() - 숫자, 문자, 객체

자바스크립트에서 배열을 정렬하기 위해 sort() 메서드를 사용한다. 원하는 순서로 정렬하기 위한 다양한 사용 방법을 알아보자.

---

arr.sort([compareFunction])

compareFunction < 0 (음수) : a가 먼저 -> 그다음 b
compareFunction = 0 (0) : skip
compareFunction > 0 (양수) : b가 먼저 -> 그다음 a

새로운 복사본이 생성되는 것이 아니라, 기존의 배열이 정렬된다.

🔺 숫자 오름차순 정렬

위의 경우에 따라 return에 a-b를 입력한다.

var arr = [40, 1, 5, 200];

arr.sort(function(a,b) {
	return a-b;
});

🔻 숫자 내림차순 정렬

arrow function으로도 표현해보았다. 오름차순과 반대로 b-a를 return 한다.

var arr = [40, 1, 5, 200];

arr.sort((a,b) => b-a);

---

🔺 문자열 오름차순 정렬

sort()는 유니코드 값 기준에 따라 기본적으로 문자형 오름차순으로 정렬된다. 따라서 파라미터가 필요 없다.

var arr = ['Blue', 'Humpback', 'Beluga'];
arr.sort(); //Beluga,Blue,Humpback

🔻 문자열 내림차순 정렬

두 문자를 비교하는 함수를 만들어야 한다. 숫자형과 달리 비교 연산자를 사용해야 한다.

var arr = ['Blue', 'Humpback', 'Beluga'];

arr.sort(function(a,b) {
  if (a > b) return -1;
  else if (a < b) return 1;
  return 0;
});

또는 reverse()를 이용해 간단하게 작성하는 방법도 있다. 배열을 먼저 정렬한 다음, 배열의 순서를 반전시키는 것이다.

var arr = ['Blue', 'Humpback', 'Beluga'];

arr.sort();
arr.reverse();

---

🔺 객체 오름차순 정렬

items라는 객체에서 name을 비교할 것이다. 추가로 대소문자를 구분하지 않고 비교하기 위한 toUpperCase()도 사용하였다.

var items = [
  { name: 'Edward', value: 21 },
  { name: 'sharpe', value: 37 },
  { name: 'and', value: 45 },
];

items.sort(function (a,b) {
  var a1 = a.name.toUpperCase();
  var b1 = b.name.toUpperCase();
  
  if (a1 > b1) return 1;
  else if (a1 < b1) return -1;
  return 0;  
});

🔻 객체 내림차순 정렬

이번에는 간단하게 return값으로만 비교해보았다. 로직은 동일하며 마찬가지로 name을 기준으로 정렬한다.

var items = [
  { name: 'Edward', value: 21 },
  { name: 'Sharpe', value: 37 },
  { name: 'And', value: 45 },
];

items.sort(function (a,b) {
  return b.name - a.name;
});

---

cf)
https://carrotweb.tistory.com/185
https://hianna.tistory.com/409
https://celltong.tistory.com/entry/JavaScript-sort-https://codechacha.com/ko/javascript-sorting-arr/