Array 그리고 Object 객체를 정렬하는 방법에 대해서 알아보도록 하겠습니다.


Array

문자배열의 정렬

JavaScript 배열객체에 포함된 sort(), reverse() 메서드를 활용하면 정렬된 결과값을 받을 수 있습니다.

var words = ['채원', '혜원', '원영', '나코']
console.log(words.sort())    // (Default) 오름차순 정렬
console.log(words.reverse()) // 내림차순 정렬

숫자의 정렬

숫자 배열은 다음의 수식을 사용하여 배열값을 정렬 합니다.

var arrayNumber = [40, 100, 1, 5, 25, 10];
arrayNumber.sort(); 
//[1, 10, 100, 25, 40, 5]
arrayNumber.sort(function(a, b){return a-b});  
//[1, 5, 10, 25, 40, 100]  // 순차정렬 : 오름차순 
arrayNumber.sort(function(a, b){return b-a});
//[100, 40, 25, 10, 5, 1]  // 역순차정렬 : 내림차순


Object

숫자 값의 정렬

각 배열의 속성값을 조정하여 배열의 값을 정렬 합니다. 숫자값의 정렬은 위에서 살펴본 내용과 동일한 방법을 사용 합니다.

const employees = [
  {id: 4, name: 'Dean', country: 'Denmark'},
  {id: 3, name: 'Carl', country: 'Canada'},
  {id: 2, name: 'Bob', country: 'Belgium'},
  {id: 1, name: 'Alice', country: 'Austria'},
  {id: 5, name: 'Ethan', country: 'Egypt'},
];
// 👇️ sort by Numeric property ASCENDING (1 - 100)
const numAscending  = [...employees].sort(
  (a, b) => a.id - b.id
);

문자값의 정렬

문자는 크기비교를 한 뒤에, 해당 객체들의 인덱스 값을 변경하는 방법을 활용 합니다.

const strDescending = [...employees].sort(
  (a, b) => a.name > b.name ? -1 : 1
);

다중정렬

level 값을 우선 정렬하고, level 값이 동일할 때 name 의 값을 기준으로 정렬하는 내용 입니다.

var arrayObject = [
  {name: '가', level: 0},
  {name: '나', level: 0},
  {name: '다', level: 4},
  {name: '라', level: 2}
];

arrayObject.sort(
  function(a, b) {
    // Step 2 : `level` 값이 같으면 name 정렬 ()
    if(a['level'] === b['level']) { 
      var x = a['name'].toLowerCase();
      var y = b['name'].toLowerCase();
      return ((x < y) ? -1 : x) > y ? 1 : 0;
    }
  // Step 1 : `level` 값 우선정렬
  return b['level'] - a['level']; 
});

// [ 
//   {name: '라', level: 4},
//   {name: '마', level: 2},
//   {name: '가', level: 0},
//   {name: '나', level: 0},
// ]


참고사이트