[JS] 배열 정렬 sort() 함수

Javascript에는 배열의 요소들을 정렬해주는 sort() 함수가 존재한다. 이의 사용 방법을 정리해보려 한다.

arrayobj.sort(sortFunction)

arrayobj는 임의의 Array 개체, sortFunction은 요소 순서를 결정하는 데 사용되는 함수의 이름이다. 생략하고 arrayobj.sort()로만 쓰면 오름차순, ASCII 문자 순서로 정렬된다.

sortFunction 인수에 함수를 지정하면 아래의 값 중 하나가 반환된다.

• 첫 번째 인수가 두 번째 인수보다 작을 경우: - 값
• 두 인수가 같을 경우: 0
• 첫 번째 인수가 두 번째 인수보다 클 경우: + 값

1. 문자 정렬

var fruit = ['orange', 'apple', 'banana'];

fruit.sort();  // apple, banana, orange


var arr = ["A", "B", "C", "a", "c"];

arr.sort(); //대문자 먼저(ASCII)"A", "B", "C", "a", "c"

/* 소문자 먼저 */
arr.sort((a, b) => a.localeCompare(b));

 

localeCompare를 쓰면 대소문자가 구분되어 정렬을 한다. 이 때 localeCompare의 리턴값은 1, 0, -1 이므로 만약 오름차순으로 하고 싶다면 -1을 곱해주면 된다.

 

2. 숫자 정렬

var score = [4, 11, 2, 10, 3, 1]; 

score.sort(); //1, 10, 11, 2, 3, 4 (ASCII 문자 순서로 정렬되어 숫자의 크기대로 나오지 않음)

//오름차순
score.sort(function(a, b){
  return a - b; //1, 2, 3, 4, 10, 11 
});

//내림차순
score.sort(function(a, b){
  return b - a; //11, 10, 4, 3, 2, 1 
});

 

3. 객체(Object) 정렬

var student = [ 
  { name : "재석", age : 21}
  , { name : "광희", age : 25}
  , { name : "형돈", age : 13}
  , { name : "명수", age : 44} 
] 

/* 이름순으로 정렬 #오름차순 */
student.sort(function(a, b) { 
  return a.name < b.name ? -1 : a.name > b.name ? 1 : 0;  // 광희, 명수, 재석, 형돈 
});

/* 이름순으로 정렬 #내림차순 */
student.sort(function(a, b) { 
  return a.name > b.name ? -1 : a.name < b.name ? 1 : 0;  // 형돈, 재석, 명수, 광희 
});


var sortingField = "age";

/* 나이순으로 정렬 #오름차순 */
student.sort(function(a, b) { 
  return a[sortingField] - b[sortingField];  // 13, 21, 25, 44 
});

/* 나이순으로 정렬 #내림차순 */
student.sort(function(a, b) { 
  return b[sortingField] - a[sortingField];  // 44, 25, 21, 13 
});

 

+ 2차원 배열 정렬하기

- 첫번째 요소로 먼저 정렬하고, 첫번째 요소가 같을 경우 두번째 요소를 비교해서 정렬

var product = [
	[6, 6],
    	[2, 2],
    	[4, 3],
    	[4, 5],
    	[10, 3],
];

product.sort(function (a, b) {
	return a[0] - b[0] || a[1] - b[1];
});

/* [2, 2]
,[4, 3]
,[4, 5] #첫 번째 요소가 같으면 두 번째 요소로 비교
,[6, 6]
,[10, 3] */

 

❗  주의 사항

sort는 자기 자신을 return 하기 때문에 배열의 원본이 필요할 경우, 배열을 복사 후 정렬을 해야한다. (원 배열이 정렬되는 것에 유의)

이 때는 concat을 이용해 배열을 복사해주면 된다. 또는 [...배열이름] 으로 간단히 복사해준 후 사용해도 된다!

var arr = [1,2,3,4]
var arr2 = arr.concat() // 복사 [...arr] 과 같은 의미
arr2[1] = 5

// 결과
arr = [1, 2, 3, 4]
arr2 = [1, 5, 3, 4]