.sort() 숫자정렬하기

홍싸리·2023년 10월 11일
0

javascript

목록 보기
17/18

[1,2,6,4,2].sort();를 했을 때 별 다른 문제 없이
[1,2,2,4,6]으로 정렬이 잘 되어서 몰랐었는데
.sort()는 숫자를 정렬해주는게 아니라 문자를 정렬해주는 메소드라는 것을 알고 숫자 정렬을 할 방법을 찾아야만 했다.


var data = [1,11,14,3,61,4];

data.sort();
// 결과값 [1,11,14,3,4,61];

숫자가 문자 순서대로 정렬되어서 뒤죽박죽이 되어버렸는데 이걸 해결할 방법을 찾아야한다.

mdn.sort()를 검색해보았다.

arr.sort([ compareFunction ]);

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

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

compareFunction이 제공되지 않으면.. 이라는 가정은 결국
array.sort()의 경우를 말하는 것이고,
compareFunction을 제공해주려면 .sort()의 괄호 안에 무엇인가 적어주면 되는 것 같다.

💡규칙

compareFunction이 제공되면 배열 요소는 compare 함수의 반환 값에 따라 정렬된다.
a와 b가 비교되는 두 요소라면,

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

  • compareFunction(a, b)0보다 큰 경우 b를 a보다 낮은 인덱스로 소트한다.

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

따라서 compare 함수의 형식은 다음과 같다.

function comapare(a,b){
  if (a is less than b by some ordering criterion) {
    return -1;
  }
  if (a is greater than b by the ordering criterion) {
  	return 1;
  }
  // a must be equal to b
  return 0;
}

문자열 대신 숫자를 비교하기 위해 compare 함수는 a에서 b를 뺼 수 있는데, 다음 함수는 배열을 오름차순으로 정렬한다.
(Infinity 및 NaN이 포함되어 있지 않은 경우)

function compareNumbers(a, b){
  return a - b;
}

내림차순으로 정렬하고 싶을 경우엔 compareNumbers() 함수 안의 return 값을 조금 수정하면 된다.


function compareNumbers(a, b){
  return b - a;
}


sort메소드는 함수식(및 클로저)와 함께 편리하게 사용할 수 있다.

var numbers = [4, 2, 5, 1, 3];
numbers.sort(function (a,b){
  return a - b;
});
console.log(numbers); //[1, 2, 3, 4, 5]

개체는 해당 속성 중 하나의 값을 기준으로 정렬할 수 있다.

var items = [
  { name: "Edward", value: 21 },
  { name: "Sharpe", value: 37 },
  { name: "And", value: 45 },
  { name: "The", value: -12 },
  { name: "Magnetic", value: 13 },
  { name: "Zeros", value: 37},
];

//value 기준으로 정렬
items.sort(function (a, b){
  if (a.value > b.value){
    return 1;
  }
  if (a.value < b.value){
    return -1;
  }
  //a must be equal to b
  return 0;
});

//name 기준으로 정렬
items.sort(function(a, b){
  var nameA = a.name.toUpperCase(); //ignore upper and lower case
  var nameB = b.name.toUpperCase(); //ignore upper and lower case
  
  if (nameA < nameB){
    return -1;
  }
  if (nameA > nameB){
    return 1;
  }
  
  //이름이 같을 경우
  return 0;
}
profile
그럴싸한건 다 따라해보는 프론트엔드 개발자 준비중인 6년차 퍼블리셔

0개의 댓글