JavaScript | sort( )

sort() 메소드는 숫자,문자열 뿐만이 아닌 객체의 정렬에도 쓰일 수 있기 때문에 활용도가 높다.
그런데 매일 헷갈려....그래서 정리!

sort()

: sort() 메서드는 배열의 요소를 적절한 위치에 정렬한 후 그 배열을 반환합니다

• 매개변수
  compareFunction | Optional
  정렬 순서를 정의하는 함수. 생략하면 배열은 각 요소의 문자열 변환에 따라 각 문자의 유니 코드 코드 포인트 값에 따라 정렬됩니다.

✅기본적으로 compareFn을 생략하면 => 오름차순으로 정렬
그럼 오름차순일 때는 compareFn은 필요없을까???

아래의 예를 보자,

const arr = [2, 1, 3, 10];
//
arr.sort();
document.writeln(arr + '<br>'); // [1, 10, 2, 3]
//
//- 배열을 오름차순으로 정렬(Infinity 및 NaN이 포함되어 있지 않은 경우).```

각 인덱스의 제일 처음에 위치한 값을 통해 비교하기 때문에 생각하는 [1, 2, 3, 10]의 값을 얻을 수 없다.

👉🏻 각 인덱스의 타입이 숫자인 배열을 오름차순 정렬하기 위해서는 경우에 따라서 파라미터(compareFunction)를 활용해야 한다.

const arr = [2, 1, 3, 10];
//
arr.sort(function(a, b)  {
  if(a > b) return 1;
  if(a === b) return 0;
  if(a < b) return -1;
});

: a, b 두 개의 파라미터를 입력받고, a > b이면 1, a === b이면 0, a < b이면 -1을 리턴하여, 주어진 배열을 오름차순으로 정렬하였습니다.

⇨ case 1. " compareFunction " 이 제공되지 않을때,
요소를 문자열로 변환하고 유니 코드 코드 포인트 순서로 문자열을 비교하여 정렬됩니다. 예를 들어 "바나나"는 "체리"앞에옵니다. 숫자 정렬에서는 9가 80보다 앞에 오지만 숫자는 문자열로 변환되기 때문에 "80"은 유니 코드 순서에서 "9"앞에옵니다.

const months = ['March', 'Jan', 'Feb', 'Dec'];
months.sort();
console.log(months);
// expected output: Array ["Dec", "Feb", "Jan", "March"]
//
const array1 = [1, 30, 4, 21, 100000];
array1.sort();
console.log(array1);
// expected output: Array [1, 100000, 21, 30, 4]

⇨ case 2. " compareFunction " 이 제공될 때,
: 배열 요소는 compare 함수의 반환 값에 따라 정렬됩니다. a와 b가 비교되는 두 요소라면,

• compareFunction(a, b)이 0보다 작은 경우 a를 b보다 낮은 색인으로 정렬합니다. 즉, a가 먼저옵니다.

• compareFunction(a, b)이 0을 반환하면 a와 b를 서로에 대해 변경하지 않고 모든 다른 요소에 대해 정렬합니다.
  *참고 : ECMAscript 표준은 이러한 동작을 보장하지 않으므로 모든 브라우저(예 : Mozilla 버전은 적어도 2003 년 이후 버전 임)가 이를 존중하지는 않습니다.

• compareFunction(a, b)이 0보다 큰 경우, b를 a보다 낮은 인덱스로 소트합니다. 즉, b가 먼저옵니다.

• compareFunction(a, b)은 요소 a와 b의 특정 쌍이 두 개의 인수로 주어질 때 항상 동일한 값을 반환해야합니다. 일치하지 않는 결과가 반환되면 정렬 순서는 정의되지 않습니다.

const arr = [2, 1, 3, 10];
// ↘️ 내림차순 정렬
arr.sort(function(a, b)  {
    return b - a;
}); //  [10,3,2,1]
// ↗️ 오름차순 정렬
const arr = [2, 1, 3, 10];
arr.sort(function(a, b)  {
  return a - b;
}); //  [1,2,3,10]

출처 | 배열 정렬하기 (오름차순, 내림차순, 문자열, 객체)

Object 정렬