자바스크립트에서 Array.prototype.sort()의 사용법은 무엇인가요?
_____A1: 자바스크립트의 Array.prototype.sort() 메서드는 배열의 요소를 정렬하여, 정렬된 배열을 반환하는 메서드입니다. 원본 배열 자체가 변경됩니다.
---
Q2: 기본적인 사용법은 어떻게 되나요?
A2:
```javascript
const arr = [3, 1, 2];
arr.sort();
console.log(arr); // ["1", "2", "3"] (문자열 기준 정렬)
```
기본적으로 요소를 문자열로 변환한 후 유니코드 코드 포인트 순서로 정렬합니다.
---
Q3: 숫자 배열을 오름차순으로 정렬하려면 어떻게 해야 하나요?
A3: 기본 sort는 문자열 비교라 숫자 배열을 제대로 정렬하지 못합니다. 비교 함수를 인자로 넘겨야 합니다.
```javascript
const numbers = [10, 5, 20, 1];
numbers.sort((a, b) => a - b);
console.log(numbers); // [1, 5, 10, 20]
```
---
Q4: sort 메서드의 비교 함수(compareFunction)는 무엇인가요?
A4: 비교 함수는 두 인자(a, b)를 받아 반환 값에 따라 정렬 순서를 결정합니다.
- 반환값이 음수: a가 b보다 앞에 위치
- 반환값이 0: 순서 변경 없음
- 반환값이 양수: b가 a보다 앞에 위치
예: `(a, b) => a - b` 는 오름차순 정렬을 의미합니다.
---
Q5: 문자열 배열을 사전 순으로 정렬할 때 팁이 있나요?
A5: 기본 sort()는 문자열 기준 사전 순 정렬을 하지만, 대소문자 구분 및 지역(locale)을 고려하려면 localeCompare()를 활용합니다.
```javascript
const fruits = ['banana', 'Apple', 'cherry'];
fruits.sort((a, b) => a.localeCompare(b));
console.log(fruits); // ["Apple", "banana", "cherry"]
```
---
Q6: sort()는 원본 배열에 영향을 미치나요?
A6: 네, sort()는 원본 배열을 직접 변경(mutate)합니다. 변경 없이 정렬된 새 배열을 얻고 싶으면 복사 후 정렬해야 합니다.
```javascript
const arr = [3, 1, 2];
const sortedArr = [...arr].sort((a, b) => a - b);
```
---
Q7: 객체 배열을 특정 키 값을 기준으로 정렬하려면?
A7: 비교 함수에서 객체의 해당 키를 참조하여 정렬할 수 있습니다.
예: 가격(price) 오름차순 정렬
```javascript
const items = [{name: "A", price: 50}, {name: "B", price: 30}];
items.sort((a, b) => a.price - b.price);
```
---
Q8: sort()의 시간 복잡도는 어떻게 되나요?
A8: 자바스크립트 엔진에 따라 다르지만 일반적으로 O(n log n)의 시간복잡도를 갖는 효율적인 정렬 알고리즘을 사용합니다.
---
Q9: 빈 배열이나 요소가 하나뿐인 배열도 정렬이 잘 되나요?
A9: 네, 빈 배열 또는 요소가 하나인 배열은 기본적으로 정렬 과정에서 변화가 없으므로 안전합니다.
---
Q10: sort() 사용 시 주의해야 할 점은 무엇인가요?
A10:
- 원본 배열이 변경됨을 인지해야 합니다.
- 복잡한 비교 함수 작성 시 반환값 조건을 명확히 해야 예상치 못한 결과를 피할 수 있습니다.
- 숫자 정렬 시 비교 함수를 지정하지 않으면 올바른 결과가 나오지 않습니다.
- localeCompare 등 문자열 비교 방식을 활용해 다양한 언어·문화권 정렬을 처리할 수 있습니다.
---
이상으로 Array.prototype.sort()의 기본 개념과 주요 사용법 FAQ였습니다.
이 메서드는 배열을 제자리에서 정렬하며, 기본적으로 문자열 유니코드 순서에 따라 정렬합니다.
`sort()` 메서드는 원래 배열을 변경하고, 정렬된 배열을 반환합니다.
기본 사용법`sort()` 메서드는 다음과 같이 사용됩니다:```javascriptlet array = [3, 1, 4, 2];array.sort();console.log(array); // ["1", "2", "3", "4"]```위의 예제에서 숫자 배열을 정렬했지만, 결과는 문자열로 변환된 후 정렬된 것입니다.
따라서 "10"이 "2"보다 앞에 오는 등 예상치 못한 결과가 발생할 수 있습니다.
사용자 정의 정렬정렬 기준을 정의하려면 `sort()` 메서드에 비교 함수를 전달할 수 있습니다.
비교 함수는 두 개의 인자를 받아서, 이 두 인자의 순서를 결정하는 값을 반환해야 합니다.
비교 함수의 반환 값은 다음과 같습니다:- 0보다 작은 값을 반환하면 첫 번째 인자가 두 번째 인자보다 앞에 위치합니다.
- 0을 반환하면 두 인자가 동일한 순서로 유지됩니다.
- 0보다 큰 값을 반환하면 두 번째 인자가 첫 번째 인자보다 앞에 위치합니다.
예를 들어, 숫자를 오름차순으로 정렬하려면 다음과 같이 할 수 있습니다:```javascriptlet numbers = [3, 1, 4, 2];numbers.sort((a, b) => a - b);console.log(numbers); // [1, 2, 3, 4]```내림차순으로 정렬하려면 다음과 같이 할 수 있습니다:```javascriptlet numbers = [3, 1, 4, 2];numbers.sort((a, b) => b - a);console.log(numbers); // [4, 3, 2, 1]``` 문자열 정렬문자열을 정렬할 때는 기본적으로 유니코드 순서에 따라 정렬됩니다.
예를 들어:```javascriptlet fruits = ['banana', 'apple', 'cherry'];fruits.sort();console.log(fruits); // ["apple", "banana", "cherry"]```대소문자를 구분하여 정렬하려면, 비교 함수에서 `localeCompare` 메서드를 사용할 수 있습니다:```javascriptlet fruits = ['banana', 'Apple', 'cherry'];fruits.sort((a, b) => a.localeCompare(b));console.log(fruits); // ["Apple", "banana", "cherry"]``` 복잡한 객체 정렬객체 배열을 정렬할 때는 특정 속성을 기준으로 정렬할 수 있습니다.
예를 들어, 다음과 같은 객체 배열이 있다고 가정해 보겠습니다:```javascriptlet people = [ { name: 'John', age: 25 }, { name: 'Jane', age: 30 }, { name: 'Jim', age: 20 }];people.sort((a, b) => a.age - b.age);console.log(people);// [// { name: 'Jim', age: 20 },// { name: 'John', age: 25 },// { name: 'Jane', age: 30 }// ]```위의 예제에서는 `age` 속성을 기준으로 사람들을 오름차순으로 정렬했습니다.
주의사항1. 정렬의 안정성 : 자바스크립트의 `sort()` 메서드는 안정적이지 않을 수 있습니다.
즉, 동일한 값의 순서가 보장되지 않을 수 있습니다.
이는 브라우저 구현에 따라 다를 수 있습니다.
2. 원본 배열 변경 : `sort()` 메서드는 원본 배열을 변경합니다.
만약 원본 배열을 유지하고 싶다면, 배열을 복사한 후 정렬해야 합니다.
```javascriptlet originalArray = [3, 1, 4, 2];let sortedArray = [...originalArray].sort((a, b) => a - b);console.log(originalArray); // [3, 1, 4, 2]console.log(sortedArray); // [1, 2, 3, 4]```3. 비교 함수의 성능 : 비교 함수는 성능에 영향을 미칠 수 있습니다.
복잡한 로직을 포함하는 경우, 정렬 성능이 저하될 수 있습니다.
결론`Array.prototype.sort()` 메서드는 배열을 정렬하는 강력한 도구입니다.
기본적인 사용법부터 시작하여, 사용자 정의 정렬, 객체 배열 정렬 등 다양한 방법으로 활용할 수 있습니다.
그러나 원본 배열의 변경, 안정성, 성능 등을 고려하여 적절히 사용해야 합니다.
작성자:
박예림 [비회원]
| 작성일자: 1년 전
2024-09-08 14:47:27
조회수: 152 | 댓글: 0 | 좋아요: 0 | 싫어요: 0
조회수: 152 | 댓글: 0 | 좋아요: 0 | 싫어요: 0
내용이 부정확하다면 싫어요를 클릭해주세요.