sort()와 reverse()

배열을 전환하는 방식에는 2가지 방식이 있습니다.

 

 

Array.prototype.sort() - JavaScript | MDN

 

 

 

sort()

sort() 메서드를 사용하면 배열을 정렬한 후 정렬된 배열을 반환합니다.

const nums = [10.99, 5.99, 3.99, 6.59];

const sortedNums = nums.sort();

console.log(sortedNums); // [10.99, 3.99, 5.99, 6.59] 출력

sort() 메서드를 사용하여 배열을 정리를 했더니 이상하게 정렬된 것을 확인할 수 있습니다.

 

이는 sort() 메서드의 매개변수에 정렬 순서를 정의하는 비교 함수를 생략하면 전체 요소를 문자열로 변환해서 문자열 논리로 정렬하기 때문입니다.

 

문자열은 기본적으로 첫 번째 문자만 비교를 하기 때문에 "10"과 "3"을 비교하는 것이 아닌 10의 첫 글자인 "1"과 "3"을 비교하게 됩니다. 

 

때문에 10.99가 제일 앞에 위치하도록 정렬이 된 것입니다.

 

 

const nums = [10.99, 5.99, 3.99, 6.59];

const sortedNums = nums.sort((a, b) => {
  if (a > b) {
    return 1; // 1이 반환되면 a가 b보다 큰 것을 의미함
  } else if (a === b) {
    return 0; // 0이 반환되면 a와 b가 같음을 의미함
  } else {
    return -1; // -1이 반환되면 b가 a보다 큰 것을 의미함
  }
});

console.log(sortedNums); // [3.99, 5.99, 6.59, 10.99] 출력

sort() 메서드의 경우 정렬을 하기 위해 두 개의 숫자를 취하는 비교 함수를 인자로 보낼 수 있습니다.

 

a와 b는 비교되는 두 요소를 의미합니다.

 

두 요소의 비교가 a > b 일 경우 1을 반환하게 되는데 이는 비교 함수에서 반환되는 값이 0보다 클 경우 b가 a보다 작은 값이라 판단하고 정렬을 하게 됩니다.

 

두 요소의 비교가 a === b 일 경우 0을 반환하게 되는데 이는 비교 함수에서 반환되는 값이 0일 경우 a와 b는 같다고 판단하고 따로 정렬을 하지 않고 다음 비교로 넘어가게 됩니다.

 

두 요소의 비교가 b > a 일 경우 -1을 반환하게 되는데 이는 비교 함수에서 반환되는 값이 0보다 작을 경우  a가 b보다 작은 값이라 판단하고 정렬을 하게 됩니다.

 

 

const nums = [10.99, 5.99, 3.99, 6.99];

const sortedNums = nums.sort((a, b) => {
  return a - b;
});

console.log(sortedNums); //[3.99, 5.99, 6.99, 10.99] 출력

숫자를 비교하여 오름차순으로 정렬할 경우 위의 설명을 이용하면 예제 코드처럼 보다 간단하게 코드 작성이 가능합니다.

 

만약 a가 10.99이고 b가 5.99 라면 반환되는 값은 5이기 때문에 a가 b보다 크다고 판단하고 정렬을 하게 됩니다.

(비교 함수에서 반환되는 값이 0보다 클 경우 b가 a보다 작은 값이라 판단하고 정렬을 하게 됩니다.)

 

만약 a가 3.99이고 b가 6.99 이면 반환 값은 -3이기 때문에 b가 a보다 크다고 판단하고 정렬을 하게 됩니다.

(비교 함수에서 반환되는 값이 0보다 작을 경우  a가 b보다 작은 값이라 판단하고 정렬을 하게 됩니다.)

 

 

 

---

reverse() 메서드를 사용하면 배열을 반전시킬 수 있습니다.

const nums = [10.99, 5.99, 3.99, 6.59];

const sortedNums = nums.sort((a, b) => {
    if (a > b) {
    return 1; // 1이 반환되면 a가 b보다 큰 것을 의미함
  } else if (a === b) {
    return 0; // 0이 반환되면 a와 b가 같음을 의미함
  } else {
    return -1; // -1이 반환되면 b가 a보다 큰 것을 의미함
  }
});

console.log(sortedNums); // [3.99, 5.99, 6.59, 10.99] 출력

console.log(sortedNums.reverse()); // [10.99, 6.59, 5.99, 3.99] 출력

reverse() 메서드를 사용하여 정렬한 배열을 반전시키니 가장 큰 값이 첫 번째에 위치하는 것을 확인할 수 있습니다.

 

const nums = [10.99, 5.99, 3.99, 6.59];

const sortedNums = nums.sort((a, b) => {
  if (a > b) {
    return -1; // -1이 반환되면 b가 a보다 큰 것으로 판단하고 정렬
  } else if (a === b) {
    return 0; // 0이 반환되면 a와 b가 같음을 의미함
  } else {
    return 1; // 1이 반환되면 a가 b보다 큰 것으로 판단하고 정렬
  }
});

console.log(sortedNums); // [10.99, 6.59, 5.99, 3.99] 출력

reverse()의 대안으로 반환되는 값을 1을 -1로, -1을 1로 수정해주면 내림 차순으로 정렬이 가능합니다.