[자바스크립트] 배열의 sort(), slice()

 

 

🔥 정렬의 sort() 함수

배열을 상대로 sort()함수를 사용하면 오름차순으로 정렬된다.

[7,2,5,9].sort();
//[2,5,7,9]

 

배열 내 값들을 재배치하고 정렬된 배열을 다시 반환한다.

let num = [3,2,1,];
let sortNum = num.sort();
console.log(num, sortNum);
//[ 1, 2, 3 ] [ 1, 2, 3 ]

 

 

'-'(마이너스) 가 들어갔다고해서 음수가 아니라 배열 안에서는 그저 문자일 뿐이다.

그래서 정렬 전 내부적으로 문자열로 변환하곤하는데 이러한 부분때문에 숫자 배열을 정렬할 때 예상치 못한 결과 값이 나올 수 있다. 

[-3, 2, 0, 1, 3, -2, -1].sort();
// [-1, -2, -3, 0, 1, 2, 3]

 

---

 

구문

 

매개변수

compareFunction

정렬 순서를 정의하는 함수. 생략하면 배열은 각 요소의 문자열 변환에 따라 각 문자의 유니 코드 코드 포인트 값에 따라 정렬된다.

 

반환값

정렬한 배열. 원 배열이 정렬되는 것에 유의하세요. 복사본이 만들어지는 것이 아님.

 

 

---

 

sort()  규칙

첫 번째 인자가 두 번째 인자보다 작으면 음수를 반환
첫 번째 인자가 두 번째 인자보다 크면 양수를 반환
첫 번째 인자가 두 번째 인자와 같으면 0을 반환

 

오름차순으로 정렬하기 위해서는 첫번째 인자에서 두번째 인자를 빼준다.

[-3, 2, 0, 1, 3, -2, -1].sort((a, b) => a - b);
// [-3, -2, -1, 0, 1,  2,  3]

 

내림차순은 반대로 a-b 를 b-a로 바꿔주면 끝!

[-3, 2, 0, 1, 3, -2, -1].sort((a, b) => b - a);
// [3, 2, 1, 0, -1, -2, -3]

 

---

 

 

객체 배열 정렬

const user = [
  { no: 1, grade: "A", name: "July" },
  { no: 2, grade: "B", name: "Anna" },
  { no: 3, grade: "C", name: "Tom" },
  { no: 4, grade: "D", name: "May" },
  { no: 5, grade: "F", name: "Alice" },
];

 

user 배열을 하나 생성하고 오름차순 내림차순으로 정렬해보자.

 

no 기준으로 정렬

user.sort(function (a, b) {
    if (a.no > b.no) {
      return 1;
    }
    if (a.no < b.no) {
      return -1;
    }
    // a must be equal to b
    return 0;
  });

 

 

---

 

✏️ 예제

var stringArray = ["Blue", "Humpback", "Beluga"];
var numericStringArray = ["80", "9", "700"];
var numberArray = [40, 1, 5, 200];
var mixedNumericArray = ["80", "9", "700", 40, 1, 5, 200];

function compareNumbers(a, b) {
  return a - b;
}

console.log("Sorted:", stringArray.sort());

결과값 Sorted: [ 'Beluga', 'Blue', 'Humpback' ]

 

var stringArray = ["Blue", "Humpback", "Beluga"];
var numericStringArray = ["80", "9", "700"];
var numberArray = [40, 1, 5, 200];
var mixedNumericArray = ["80", "9", "700", 40, 1, 5, 200];

function compareNumbers(a, b) {
  return a - b;
}

console.log(
    "Sorted with compareNumbers:",
    numericStringArray.sort(compareNumbers),
  );

결과값 Sorted with compareNumbers: [ '9', '80', '700' ]

 

 

 

 

 

🔥 slice() 메서드로 특정 범위 요소 자르기

slice() 메서드는 어떤 배열의 begin 부터 end 까지(end 미포함)에 대한 얕은 복사본을 새로운 배열 객체로 반환한다.

 

구문

 

매개변수

begin	0을 시작으로 하는 추출 시작점에 대한 인덱스를 의미, slice(-2) 는 배열에서 마지막 두 개의 엘리먼트를 추출하고 begin이 undefined인 경우에는, 0번 인덱스부터 slice 한다. begin이 배열의 길이보다 큰 경우에는, 빈 배열을 반환
end	추출을 종료 할 0 기준 인덱스, slice 는 end 인덱스를 제외하고 추출하고 end가 생략되면  slice()는 배열의 끝까지(arr.length) 추출

 

반환값

추출한 요소를 포함한 새로운 배열

 

---

✏️ 예제

const colors = ["red", "green", "blue", "orange", "yellow"];
const slicedColors = colors.slice(1, 3);

//[green, blue, orange]

const numbers = [1, 2, 3, 4, 5];

// 배열의 처음 3개 요소를 추출합니다.
const firstThree = numbers.slice(0, 3);

console.log(firstThree); // 출력: [1, 2, 3]

// 배열의 마지막 2개 요소를 추출합니다.
const lastTwo = numbers.slice(-2);

console.log(lastTwo); // 출력: [4, 5]

const num_list = [5,4,3,7,2,9,1,8];

function solution(num_list){
    return num_list.sort((a,b) => a-b).slice(0, 5);
    // 배열 처음부터 5번째까지 출력
}