코딩테스트 대비 문제풀이에서 가장 많이 사용하고 있는 메서드 중 하나인데 작동원리에 대해 모른다는 생각이 들어 개념을 잡고자 글을 쓰게 되었다.
배열의 요소를 적절한 위치에 정렬한 후 해당 배열을 반환한다.
배열 요소를 문자열로 만든 뒤 유니코드 값을 기준으로 정렬하기 때문에 내부 처리를 별도로 하지 않는다면 원하지 않은 결과를 얻게 된다.
array.sort([compareFunction]);
정렬 순서를 정의하는 sort의 콜백함수로 firstElement, secondElement 인자가 자동으로 들어간다.
생략할 경우 배열 각 요소의 유니코드 값을 기준으로 정렬된다.
주의할 점은 정렬한 배열이 반환되는데 slice() 메서드와 같이 복사본이 만들어지는 것이 아닌 splice() 메서드 처럼 원본 배열이 변형된다.
compareFunction 생략 시 아래와 같이 정렬이 이루어진다.
const arr = [10, 30, 20, 40, 100]
arr.sort(); // [10, 100, 20, 30, 40]
compareFunction는 숫자값을 반환해야 하는데 3가지 경우로 나뉜다.
3가지 케이스 | 결과 |
---|---|
0보다 작은 경우 | [a,b]의 값이 있다면 b가 먼저 위치하게 되어 [b,a]가 된다. |
0보다 큰 경우 | [a,b]의 값이 있다면 a가 먼저 위치하게 되어 그대로 [a,b]가 된다. |
0인 경우 | [a,b]의 값이 들어왔다면, 그대로 [a,b]가 된다. |
글로는 잘 와닿지 않아 예시 코드를 작성해봤다.
const arr = [3, 1, 5, 2, 7, 10];
arr.sort((a, b) => {
console.log(`a : ${a}, b : ${b}, a - b = ${a - b}`);
return a - b;
});
console.log(arr);
결과를 보면 a : 3, b : 1가 아닌 a : 1, b : 3으로 출력되는 것을 확인할 수 있다.
헷갈릴 수 있으므로 a : nextValue, b : prevValue라고 이해하자.
첫 번째로 a : 1, b : 3, a - b : -2 이므로 자리가 변경되어 [1, 3, 5, 2, 7, 10]이 된다.
두 번째로 a : 5, b : 1, a - b : 4 이므로 그대로 자리가 유지된다.
세 번째로 a : 2, b : 5, a - b : -3 이므로 자리가 변경되어 [3, 1, 2, 5, 7, 10]이 된다.
b(prev value)
값이 큰 경우만 결과값이 음수로 나오기 때문에 작은 값이 앞으로 오게 되어 오름차순 정렬을 구현할 수 있는 것이다.
내림차순은 반대로 a(next value)
의 값이 더 큰 경우만 결과값이 음수로 나와 큰 값이 뒤로 가게 되어 내림차순 정렬을 구현할 수 있는 것이다.
참고