끄적이는 공간

퍼블리셔 Note/JAVASCRIPT

[Javascript] Array.sort() 메소드

Joroki 2023. 7. 28. 17:10

sort() 메소드란?

'sort()'메소드는 자바스크립트의 데이터타입 배열(Array)에 사용되는 내장 된 함수이다.

sort()메소드를 사용하면 배열의 요소들을 정렬하는 기능을 제공한다. sort() 메소드는 원본 배열을 변경하며, 정렬된 배열을 반환 한다.

 

'Array.sort()' 메소드를 호출하면, 배열의 요소들은 기본적으로 문자열로 변환되어 오름차 순으로 정렬된다.

 

예시 코드

 

숫자 오름차순 정렬

숫자 배열을 sort배열의 오름차 순대로 정렬을 하자면 아래와 같이 할 수 있다.

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

numbers.sort();

//출력 결과: [1, 2, 3, 4, 5];

 

숫자 내림차순 정렬

반대로 내림차 순으로 정렬을 하기를 원한다면 아래와 같이 할 수 있다.

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

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

console.log(numbers);

//출력 결과: [5, 4, 3, 2, 1]

 

 

뿐만 아니라, 글자도 sort() 메소드를 활용하면 가나다순,abc순의 기능을 구현 할 수 있다

 

abc순으로 정렬 (+대소문자 구분없이 정렬하기)

const fruits = ['banana', 'orange', 'grape', 'banana'];
fruits.sort();

console.log(fruits);

//출력결과: ["apple", "banana", "grape", "orange"]
const fruits = ['Banana', 'orange', 'Grape', 'apple'];

fruits.sort( (a,b) => {
	return a.toLowerCase().localeCompare(b.toLowerCase());
});

console.log(fruits);

//출력 결과: ['apple', 'Banana', 'Grape', 'orange']

 

가나다순으로 정렬

 

sort() 메소드는 기본적으로 Unicode 코드포인트에 따라 정렬이 되기때문에 한글도 정상적으로 가,나,다 수순으로 정렬 할 수 있는 기능을 구현 할 수 있다.

// 기본 가나다순 정렬

const words = ['라','나','다','가'];

words.sort();

console.log(words);

//출력 결과: ['가','나','다','라']

 

 

Tip. sort() 메소드를 사용해도 배열의 원본을 보존하는 법

 

위에서 sort() 메소드에 대해 얘기했듯, sort() 메소드는 배열의 원본을 보존한 후 정렬이 된 배열을 새로 생성하는게 아닌,

배열의 원본 자체를 정렬시킨 형태로 원본 변형 하는 것을 출력하는 메소드라고 얘기했었다.

 

그러나 배열은 기본적으로 원본을 보존하는것이 데이터 처리할때 더 안정적이다. 그럴땐 아래와 같이 처리한다.

 

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

//slice() 메소드를 활용해 원본 배열의 복사본을 만든다.
const numbersData = numbers.slice();

//slice() 메소드를 활용한 원본 배열의 복사본을 sort()메소드를 활용해 정렬
const sortedNumbersData = numbersData.sort();

//출력결과: [1, 2, 3, 4, 5]
console.log(sortedNumbersData);

//출력결과: [3, 1, 5, 2, 4]
console.log(numbersOg)

배열의 원본인 numbers는 그대로 보존하고 slice()를 활용하여 복사본을 만들어 복사본 배열을 수정하면 원본 배열은 그대로 두고 배열의 복사본만을 변형 시키는 처리를 할 수 있다.

반응형