[JavaScript] 배열 정렬하는 간단한 방법(sort) - 문자열, 숫자, 객체 배열 정렬하기

배열에 학생들의 성적을 넣어놨는데 순서대로 보여주고 싶다면 어떻게 해야 할까요? 이럴 때는 배열을 성적이 높은 순으로 정렬을 해야 할 텐데요. 자바스크립트에서는 sort() 메서드를 사용하면 간단하게 배열을 정렬할 수 있습니다. 이번 포스팅에서 알아보겠습니다.

 

 자바스크립트 배열 정렬하는 sort() 함수 

//사용법
배열.sort();

sort() 메서드는 문자열 유니코드 순서로 배열을 정렬합니다.

 

문자열 배열 정렬

See the Pen Untitled by 우정태 (@sxqouumz-the-reactor) on CodePen.

 

sort() 함수는 유니코드 순서로 정렬을 실행하기 때문에 문자열 배열 정렬에 최적화되어 있습니다. 위를 보시면 a, b, c, d가 무작위로 배치된 배열을 sort() 함수 호출로 알파벳 순서대로 정렬된 것을 보실 수 있습니다.

 

숫자 배열 정렬

See the Pen Untitled by 우정태 (@sxqouumz-the-reactor) on CodePen.

 

 

sort() 메서드를 사용하여 숫자 배열을 정렬할 때는 비교 함수를 인자값으로 넣어야 합니다. 위의 예제에서 (a, b) => a - b는 배열의 두 요소 a와 b를 비교하는 익명 함수입니다. 이 비교 함수는 두 숫자의 차이를 계산하여 오름차순으로 정렬합니다.

 

정렬 과정

• 음수: a가 b보다 작으면 (a - b < 0), a가 b보다 앞에 위치합니다.
• 0: a와 b가 같으면 (a - b === 0), 순서를 바꾸지 않습니다.
• 양수: a가 b보다 크면 (a - b > 0), a가 b보다 뒤에 위치합니다.

 

객체 배열 정렬

See the Pen 객체 배열 정렬 by 우정태 (@sxqouumz-the-reactor) on CodePen.

 

객체로 이루어진 배열을 정렬할 때는 객체의 특정 속성을 기준으로 정렬해야 합니다. 위의 예제에서는 객체로 이루어진 배열을 성적순으로 정렬한 뒤 HTML 테이블로 변환하여 출력합니다.