STUDY/Javascript
Javascript 정렬하기
티앤모이
2023. 9. 27. 16:16
필터에 API를 통해서 데이터 리스트를 가져오면서 정렬을 하게되었다.
데이터는 가나다 순이 아니라 해당하는 데이터가 많은 순으로 가져오고 있었지만 가나다 순 정렬을 해달라는 요청이 들어왔다!
처음에는 서버단에서 API 호출 후 리턴된 데이터를 정렬하려고 하였는데 데이터가 많아서 그런지 로컬 톰캣이 정렬 몇번하고 나면 뻗어버렸다,,,
그래서 정렬을 클라이언트에서 하기로 했다.
Javascript를 사용하고 있어서 Javascript로 정렬하는 코드를 짜봤다!
const jsonArray = [{"value":"비맥스","count":172},{"value":"비비빅","count":172}];
const patternNumber = /[0-9]/; // 숫자 정규표현식
const patternAlphabet = /[a-zA-Z]/; // 알파벳 정규표현식
const patternHangul = /[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/; // 한글 정규표현식
const patternSpecial = /[\{\}\[\]\/?.,;:|\)*~`!^\-_+<>@\#$%&\\\=\(\'\"]/; // 특수문자 정규표현식
const orderLevelDesc = [patternSpecial, patternNumber, patternAlphabet, patternHangul]; // 정렬 순서 레벨링 1.특수문자 2.숫자 3.알파벳 4.한글
// 해당 문자의 레벨을 확인
const getLevel = (s) => {
const index = orderLevelDesc.findIndex((pattern) => pattern.test(s));
return index;
};
// JSON 리스트를 정렬
const sortGroupJson = function(source){
source.sort((a, b) => {
const aValue = a.value;
const bValue = b.value;
console.log("aValue : "+aValue);
console.log("bValue : "+bValue);
// 두 문자열 중 길이가 짧은 문자열의 길이만큼 반복문을 돌린다.
let loopCount = aValue.length > bValue.length ? bValue.length : aValue.length;
for(let i=0; i<loopCount; i++){
// 두 문자열의 해당 인덱스에 해당하는 문자가 같은 레벨인지 확인한다(같은 한글/영어 등등인지)
const aLevel = getLevel(aValue.charAt(0));
const bLevel = getLevel(bValue.charAt(0));
if (aLevel === bLevel) {
// 같은 레벨이라면 해당 문자의 유니코드를 비교한다
if(aValue.charCodeAt(i) != bValue.charCodeAt(i)){
// 해당 문자가 같지 않다면 정렬
return aValue.charCodeAt(i) - bValue.charCodeAt(i);
}else{
// 해당 문자가 같은데
if(i == loopCount -1){
// 반복문은 끝났을 경우 길이에 따라 정렬
if(a.length == loopCount){
// a가 문자열이 더 길 경우 양수값 리턴 (b를 뒤로 보냄)
return 1;
}else{
// b가 문자열이 더 길 경우 음수값 리턴 (b를 앞으로 보냄)
return -1;
}
}
}
}else{
// 같은 레벨이 아니라면 레벨에 따라서 정렬 (특수문자 -> 숫자 -> 영어 -> 한글 순)
return bLevel - aLevel; // Ascending order
}
}
});
};