[JS] sort(), localeCompare() 함수 (문자열비교)

 

[ sort 함수 ]

배열 요소를 정렬. 배열 자체(원본 배열)를 변경하며 정렬된 배열을 반환.

 

array.sort([compareFunction])

 

* array : 정렬할 배열

* compareFunction (선택) : 요소 간의 순서를 정의하는 함수.

  (생략 시 사전식(lexicographical) 정렬  _요소들은 문자열로 변환되어 유니코드 순서로 정렬, 대소문자 구분X)

 

---

(문자열정렬)

let fruits = ["banana", "apple", "cherry"];
fruits.sort();
console.log(fruits); 
// ["apple", "banana", "cherry"]

 

(숫자정렬)

let numbers = [4, 2, 5, 10, 3];
numbers.sort();
console.log(numbers); 
// [10, 2, 3, 4, 5]

 

=> 기본으로 사전식 정렬이 적용되기 때문에 문자열 "10" 이 문자열 "2" 보다 앞에 위치.

 

---

 

( compareFunction 사용 _요소 두개를 인자로 받음 )

const numbers = [4, 2, 5, 10, 3];
numbers.sort(function(a, b) {
  return a - b;
})

console.log(numbers); 
// [2, 3, 4, 5, 10]

=> 오름차순 정렬

 

 

* compareFunction 의 반환값에 따른 결과

 ' 음수 ' :  a를 b의 앞에 위치.

  ' 0 '  : a와 b의 순서 변경X

  ' 양수 '  :  a를 b의 뒤에 위치.

 

 

// 오름차순 정렬
arr.sort((a, b) =>  a - b);

// 내림차순 정렬
arr.sort((a, b) =>  b - a));

 

 

---

 

[ localeCompare 함수 ]

사전식(lexicographical) 비교 

 => 문자열을 문자단위로 비교. ( ex) A10 > A2 )

 

FirstString.localeCompare(SecondString, [locales], [options])

 

 * FirstString, SecondString : 비교할 첫번째, 두번째 문자열

 * locales (선택) : 언어 및 지역설정 (en-US, fr-FR 등..)  _ 생략/undefined 로 설정 시 현재시스템/브라우저의 기본로케일

 * options (선택) : 비교 방법 

   - { numeric : true }  =>  숫자 부분을 숫자 값으로 비교. ( ex) A10 < A2 )

   - { sensitivity : } _ base, accent, case, variant  => 대소문자 구별 여부 설정.

   - { ignorePunctuation : true }  => 구두점 무시 

 

* return 값

 ' - 1 ' :  FirstString 이 SecondString 보다 앞에 위치.

  ' 0 '  : FirstString 과 SecondString 이 같음.

  ' 1 '  : FirstString 이 SecondString 보다 뒤에 위치.

 

---

 

[ sort  +   localeCompare ]  

객체정렬에 대해 정렬기준값이 (문자열+숫자)인 경우.

let items = [
  { seq: 1, name: "item10" },
  { seq: 2, name: "item2" },
  { seq: 3, name: "item1" },
  { seq: 4, name: "item20" },
  { seq: 5, name: "item11" }
];

items.sort((a, b) => a.name.localeCompare(b.name, undefined, { numeric: true }));

 => item의 각 요소의 name의 숫자에 대해서 오름차순 정렬.

 

(정렬결과)

item = [
  { seq: 3, name: "item1" },
  { seq: 2, name: "item2" },
  { seq: 1, name: "item10" },
  { seq: 5, name: "item11" },
  { seq: 4, name: "item20" }
];