| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | 6 | 7 |
| 8 | 9 | 10 | 11 | 12 | 13 | 14 |
| 15 | 16 | 17 | 18 | 19 | 20 | 21 |
| 22 | 23 | 24 | 25 | 26 | 27 | 28 |
- vscode
- stash
- GitClone
- Decorator
- 네트워크
- 카카오로그인
- git stash
- JavaScript
- hub
- localStorage
- @
- google font
- HTML
- JWT기본원리
- 소셜로그인
- css기초
- github
- 개발블로그 만들기
- aws
- 무한스크롤
- ssh접속오류
- 영어 Frontend Article 읽고 요약하기 #6
- AWS 가입하기
- 데코레이터
- 링크이동
- Arrays
- EC2 is why EC2?
- cookie
- CSMA/CD
- sessionStorage
- Today
- Total
바다는 비에 젖지 않는다
[Javascript] sort() 특정 index 기준 정렬, 숫자 정렬 본문
Introduction
Programmers의 문자열 내 마음대로 정렬하기 를 풀다 sort()에 대해 정리해보고싶어져 글을 적어본다.
Main
문자열 내 마음대로 정렬하기를 풀기위해 배열 내 문자열의 특정 index를 기준으로 정렬을 했어야했는데 localeCompare()이라는 function으로 sort()에 계산을 주어 한번에 정렬해줄수 있었다.
먼저 sort()에 대해 정리해보자
sort()
arr.sort([compareFunction])
매개변수 compareFunction Optional 정렬 순서를 정의하는 함수.
생략하면 배열은 각 요소의 문자열 변환에 따라 각 문자의 유니 코드 코드 포인트 값에 따라 정렬됩니다.
compareFunction이 제공되지 않으면 요소를 문자열로 변환하고 유니 코드 코드 포인트 순서로 문자열을 비교하여 정렬됩니다. 예를 들어 "바나나"는 "체리"앞에옵니다. 숫자 정렬에서는 9가 80보다 앞에 오지만 숫자는 문자열로 변환되기 때문에 "80"은 유니 코드 순서에서 "9"앞에옵니다.
compareFunction이 제공되면 배열 요소는 compare 함수의 반환 값에 따라 정렬됩니다.
a와 b가 비교되는 두 요소라면,
compareFunction(a, b)이 0보다 작은 경우 a를 b보다 낮은 색인으로 정렬합니다. 즉, a가 먼저옵니다.
compareFunction(a, b)이 0을 반환하면 a와 b를 서로에 대해 변경하지 않고 모든 다른 요소에 대해 정렬합니다.
compareFunction(a, b)이 0보다 큰 경우, b를 a보다 낮은 인덱스로 소트합니다.
compareFunction(a, b)은 요소 a와 b의 특정 쌍이 두 개의 인수로 주어질 때 항상 동일한 값을 반환해야합니다.
일치하지 않는 결과가 반환되면 정렬 순서는 정의되지 않습니다.
localeCompare()
// "a"는 "c" 전에 위치하므로 음수 값을 반환
'a'.localeCompare('c'); // -2 혹은 -1 (또는 다른 음수 값)
// 알파벳 순으로 단어 "check"는 "against"보다 뒤에 위치하므로 양수 값을 반환
'check'.localeCompare('against'); // 2 혹은 1 (또는 다른 양수 값)
// "a"와 "a"는 서로 동등하므로 중립 값 0을 반환
'a'.localeCompare('a'); // 0
적용해주는 문자열이 사전상 더 앞에 있을 경우 음수 뒤에 있을경우 양수를 반환하고 같을 경우 0을 반환한다.
이를 활용하여 대소문자를 구분하지않는 배열 정렬을 할 수 있다.
let items = ['réservé', 'Premier', 'Cliché', 'communiqué', 'café', 'Adieu'];
items.sort( (a, b) => a.localeCompare(b, 'fr', {ignorePunctuation: true}));
// ['Adieu', 'café', 'Cliché', 'communiqué', 'Premier', 'réservé']
중간 옵션은 프랑스어를 정렬 기준으로 설정해준 것 이다. 필수는 아닌 옵션이다.
// 기본적으로 "2" > "10"
console.log("2".localeCompare("10")); // 1
// numeric 옵션 사용
console.log("2".localeCompare("10", undefined, {numeric: true})); // -1
// locales tag 사용
console.log("2".localeCompare("10", "en-u-kn-true")); // -1
숫자로된 문자열도 비교 가능하며 {numeric : true}를 넣어주면 숫자로 형변환 하여 비교해주는것 같다.
이런 localeCompare()를 사용하여 특정 index를 기준으로 문자를 정렬해주는 코드를 만들어 보자.
주어진 매개변수는
string : 정렬하고싶은 문자열
n : 정렬 기준이될 문자 Index
function solution(strings, n) {
return strings.sort( (a,b) => {
a[n] === b[n] ? a.localeCompare(b) : a[n].localeCompare(b[n])
})
}
console.log(solution(["moon", "bus", "note"], 1));
console.log(solution(["abce", "abcd", "bdd"], 2));
해당 단어의 n번째 문자를 기준으로 비교는 a[n], b[n]로 접근이 가능하다.
두 단어의 n번째 문자가 같다면 두 단어 를 비교하여 0보다 큰수나 작은수, 0을 반환하여 정렬시키고
두 단어의 n번째 문자가 다르다면 두 단어의 n번째 문자를 비교하여 숫자를 반환하여 정렬한다.
1번 예시로 moon, bus를 먼저 비교한다고 하면 정렬 기준은 1번째 index이기 때문에
moon의 1번째 Index'o' bus의 'u'를 비교했을때 'o'가 앞에 있는 문자이기 때문에 음수를 반환하여 moon이 먼저오는 문자로 정렬된다. 그렇게 모든 나머지 배열을 비교한다.
2번 예시로 abce, abcd를 비교하면 정렬 기준은 2번째 index이다.
abce의 'c' abcd의 'c'를 비교하게 되는데 두개가 같은 문자이기 때문에 abce와 abcd 자체를 비교하여 자동으로 정렬해준다.
나머지 문자열에 대해서도 모두 비교하여 정렬을 진행한다.
Javascript는 정말 편한 메소드들이 많은것 같다.
참고 자료
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/localeCompare
'IT Technical Note > Javascript' 카테고리의 다른 글
| [Javascript] Uncaught SyntaxError: Unexpected identifier(구문 오류) (0) | 2022.11.07 |
|---|---|
| [Javascript] 기초-2 문자열 자료형 (0) | 2022.11.07 |
| [Javascript] ReferenceError(예외 처리), SyntaxError(구문오류) (0) | 2022.11.07 |
| [Javascript] 기초-1 기본연산, 변수 선언, List, Object (0) | 2022.10.11 |
| [Javascript] Javascript란? (0) | 2022.10.10 |