티스토리 뷰

sort

  • 배열의 요소를 정렬한다

 

  • sort의 기본 문법
  • sort 사용 시 주의사항 : 배열을 다른 변수에 복사하여 정렬해도, 원본 배열 자체가 변경되어 버린다 
// sort의 기본 문법
const arr = [3, 2, 1];

console.log(arr.sort());
// arr1을 arr2에 복사하여 sort()를 사용했으나 arr1, arr2 모두 정렬되었다

const arr1 = [3, 1, 10, 9, 2];
const arr2 = arr.sort();

console.log(arr1);
console.log(arr2);

 

 

  • 1. 원본 배열의 변경 없이 정렬하는 방법
// 1. ...(전개구문 Spread syntax) 구조의 형태를 변경해준다
let originalArray = [3, 1, 4, 1, 5, 9];

let sortedArray = [...originalArray].sort(); // ...으로 [ ]를 없애고 정렬 후 다시 배열 형태로 만듬

console.log("Sorted Array: ", sortedArray);
console.log("Original Array: ", originalArray);

 

  • 2. 원본 배열의 변경 없이 정렬하는 방법
// 2. slice();
let originalArray = [3, 1, 4, 1, 5, 9];

let sortedArray = originalArray.slice().sort(); // slice() 구분 기준으로 배열을 자르는 메소드, ()에 아무것도 없을 경우 전체를 복사해서 반환한다.

console.log("Sorted Array: ", sortedArray);
console.log("Original Array: ", originalArray);

 

 

sort( [ ] ) 비교함수

  •  array.sort(['비교함수 값 (compareFunction)']);   [ ]에 정렬 순서를 정의하는 비교 함수를 전달할 수 있다.(optional)
  • [비교 함수]를 생략할 경우 배열 요소들이 문자열로 변환되어 각 문자의 유니코드값(일관된 문자 세트)에 따라 정렬된다. (이 경우 80의 8이 9보다 앞에 있기 때문에 [1, 2, 80, 9]로 정렬된다.)

 

  • 오름차순 정렬  (모두 같은 방법으로 함수 표기식만 다르게 작성함)
  • (a - b) 1번째 index가 a / 0번째 index가 b로 배정된다.
  • index 순서대로 뒤에 값과 비교했을 때, 음수면 뒤에 값이 앞으로, 양수면 그대로 둔다.
  • EX) index [2, 1, 9, 80]인 경우 오름차순 정렬 시 [1번 - 0번 > 2번 - 0번 > 3번 - 0번 순차적으로 계산 후 정렬된다]
  • (1-2=-1), (9-1=8 / 2가 아닌 1인 이유는 앞에서 자리를 바꿨기 때문), (80-1=79).. 동일하게 2번 - 1번 인덱스 길이만큼 계산을 반복하며 정렬한다.
const arr = [2, 1, 9, 80];

 // 1. 오름차순 정렬 
arr.sort(function (a, b) {
  return a - b
});


// 2. 오름차순 정렬, 화살표 함수
arr.sort((a, b) => {
  return a - b  
});


// 3. // 오름차순 정렬, 화살표 함수 return문이 한 줄일 경우 몸체{} 생략
arr.sort((a, b) => a - b);

console.log(arr);

 

 

  • 내림차순 정렬  (모두 같은 방법으로 함수 표기식만 다르게 작성함)
  • (b - a) 1번째 index가 a / 0번째 index가 b로 배정된다.
  • index 순서대로 뒤에 값과 비교했을 때, 음수면 뒤에 값이 앞으로, 양수면 그대로 둔다.
  • EX) index [2, 1, 9, 80]인 경우 내림차순 정렬 시 [0번 - 1번 > 0번 - 2번 > 0번 - 3번 순차적으로 계산 후 정렬된다]
  • (2-1=1), (2-9=-7), (9-80=-71).. 동일하게 1번 - 2번 인덱스 길이만큼 계산을 반복하며 정렬한다.
const arr = [2, 1, 9, 80];

 // 1. 내림차순 정렬 
arr.sort(function (a, b) {
  return b - a
});

 // 2. 내림차순 정렬, 화살표 함수



arr.sort((a, b) => {
  return b - a
});

 // 3. 내림차순 정렬, 화살표 함수 return문이 한 줄일 경우 몸체{} 생략


arr.sort((a, b) => b - a);

console.log(arr);

 

 

오름, 내림 차순 정렬 console로 확인

//오름차순 정렬
const arr = [2, 1, 9, 80];

arr.sort(function (a, b) {
  console.log("----- 시작 -----");

  console.log('a', a);
  console.log('b', b);
  console.log('a - b', a - b);
  console.log(a - b >= 0 ? "안바꿔요" : "바꿔요");

  console.log("----- 종료 -----");
  console.log();

  return a - b
});
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG
more
«   2025/02   »
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
글 보관함