sort 함수를 이용한 정렬

arrayObj.sort(sortFunction)

arrayObj는 임의의 Array 객체이며 sortFunction은 요소 순서를 결정하는 데 사용되는 함수이다.

sort 함수를 이용하면 문자, 숫자, Object 정렬 등을 수행할 수 있다.

참고로 sort 함수는 원본 배열을 조작하여 정렬시킨다. 정렬된 새로운 배열을 새로 생성하지 않는다.

1. 문자 정렬

 

const arr = ["fff", "hhh", "aaa", "ccc"]; 
arr.sort(); console.log(arr);

 

일반적인 정렬 방식이며, 아스키코드 문자 순서로 정렬된다.

2. 숫자 정렬

위의 문자 정렬과 동일한 방법으로 숫자를 정렬하게 되면 아스키코드 순으로 정렬되므로 우리가 원하는 대로 숫자를 정렬되지 않는다.

그러므로, 숫자를 정렬할 때는 다른 방법을 이용해야 한다.

 

다음은 오름차순으로 숫자를 정렬하는 방법이다.

 

const arr = [2, 222, 5, 333, 10, 4]; 
arr.sort((a, b) => a-b); 
console.log(arr);

 

숫자들은 가장 작은 요소에서 가장 큰 요소 순서대로 정렬된다.

 

다음은 내림차순으로 숫자를 정렬하는 방법이다.

 

const arr = [2, 222, 5, 333, 10, 4]; 
arr.sort((a, b) => b-a); 
console.log(arr);

 

숫자들은 가장 큰 요소에서 가장 작은 요소 순서대로 정렬된다.

3. Object 정렬

이번에는 Object 안에 있는 프로퍼티의 값들을 서로 비교하여 정렬을 해보겠다.

학생 이름을 오름차순으로 정렬

 

const student = [ 
  {name : "Ron", age : 26}, 
  {name : "Nizel", age : 25}, 
  {name : "Danny", age : 19}, 
  {name : "Chris", age : 20}, 
  {name : "David", age : 26}, 
  {name : "Dan", age : 21} 
]; 

student.sort((a, b) => { 
  return a.name < b.name ? -1 : a.name > b.name ? 1 : 0; 
}); 

console.log(student);

 

sort 함수의 인자로 들어온 콜백 함수는 student 배열 내의 2개의 객체를 인자로 가지며 비교를 통해 결과값을 계산한다. sort 함수는 콜백 함수에 의해 반환된 이 결과값을 바탕으로 요소들을 정렬시킨다. 기본적으로 이 결과값이 0보다 크다면 즉 양수이면, 두 요소의 위치를 서로 바꾼다. 하지만 이 결과값이 0보다 작다면 즉 음수이면, 두 요소는 현재의 위치를 그대로 유지한다.

위의 코드에서 a.name < b.name 이면 -1을 반환하여 이때 a, b 요소는 위치가 바뀌지 않지만, a.name > b.name 이면 1을 반환하여 이때 a, b 요소는 위치가 서로 바뀐다.

이 조건식을 통해 name 값이 작은 요소들이 앞쪽에 정렬된다는 것을 알 수 있다.

학생 이름을 내림차순으로 정렬

 

const student = [ 
  {name : "Ron", age : 26}, 
  {name : "Nizel", age : 25}, 
  {name : "Danny", age : 19}, 
  {name : "Chris", age : 20}, 
  {name : "David", age : 26}, 
  {name : "Dan", age : 21} 
]; 
  
student.sort((a, b) => { 
  return a.name > b.name ? -1 : a.name < b.name ? 1 : 0; 
}); 

console.log(student);

 

위의 코드에서 a.name > b.name 이면 -1을 반환하여 이때 a, b 요소는 위치가 바뀌지 않지만, a.name < b.name 이면 1을 반환하여 이때 a, b 요소는 위치가 서로 바뀐다.

이 조건식을 통해 name 값이 큰 요소들이 앞쪽에 정렬된다는 것을 알 수 있다.

학생 나이를 오름차순으로 정렬

 

const student = [ 
  {name : "Ron", age : 26}, 
  {name : "Nizel", age : 25}, 
  {name : "Danny", age : 19}, 
  {name : "Chris", age : 20}, 
  {name : "David", age : 26}, 
  {name : "Dan", age : 21} 
]; 

student.sort((a, b) => { 
  return a.age < b.age ? -1 : a.age > b.age ? 1 : 0; 
}); 

console.log(student);

 

위의 코드에서 a.age < b.age 이면 -1을 반환하여 이때 a, b 요소는 위치가 바뀌지 않지만, a.age > b.age 이면 1을 반환하여 이때 a, b 요소는 위치가 서로 바뀐다.

이 조건식을 통해 age 값이 작은 요소들이 앞쪽에 정렬된다는 것을 알 수 있다.

학생 나이를 내림차순으로 정렬

 

const student = [ 
  {name : "Ron", age : 26}, 
  {name : "Nizel", age : 25}, 
  {name : "Danny", age : 19}, 
  {name : "Chris", age : 20}, 
  {name : "David", age : 26}, 
  {name : "Dan", age : 21} ]; 

student.sort((a, b) => { 
  return a.age > b.age ? -1 : a.age < b.age ? 1 : 0; 
}); 

console.log(student);

 

위의 코드에서 a.age > b.age 이면 -1을 반환하여 이때 a, b 요소는 위치가 바뀌지 않지만, a.age < b.age 이면 1을 반환하여 이때 a, b 요소는 위치가 서로 바뀐다.

이 조건식을 통해 age 값이 큰 요소들이 앞쪽에 정렬된다는 것을 알 수 있다.