[JavaScript] sort - 자바스크립트 배열 메소드

목차

• sort 메서드란?
• sort 알아보기

---

sort 메서드란?

sort 메서드는 배열의 요소를 정렬한 후 그 배열을 반환하는 메서드입니다.

const strs = ['d', 'b', 'a', 'c'];

console.log(strs.sort());

// 결과 = ['a', 'b', 'c', 'd']

위 코드의 결과는 a, b, c, d로 우리가 일반적으로 생각하는 정렬이 된 상태로 출력되는 것을 볼 수 있습니다.

 

const nums = [7, 3, 8, 2, 10];

console.log(nums.sort());

// 결과 = [10, 2, 3, 7, 8]

반면에, 위 코드의 결과는 10, 2, 3, 7, 8로 우리가 원하는 대로 정렬이 되지 않은 것을 볼 수 있습니다.

원하는 대로 정렬을 할 수 있도록 sort 메서드를 자세히 알아봅시다.

---

sort 알아보기

기본적으로 sort 메소드는 유니코드 값으로 요소를 정렬합니다.

따라서, 위에서 봤던 예제와 같이 원하는 정렬 값이 나오지 않을 수 있습니다.

위 사진은 아스키코드 표 이며, 위와 비슷한 방식으로 유니코드가 존재합니다.

 

우리가 원하는 정렬을 하기 위해서 sort() 메서드 괄호 안에 compareFunction을 사용해야합니다.

const nums = [7, 3, 8, 2, 10];
nums.sort(function(a, b) {
	return a - b;
});
console.log(nums);

// 결과 = [2, 3, 7, 8, 10]

nums.sort(function(a, b) {
	return b - a;
});
console.log(nums);

// 결과 = [10, 8, 7, 3, 2]


// 화살표함수 사용
nums.sort((a, b) => a - b);
nums.sort((a, b) => b - a);

compareFunction 내에서 return 값에 따라 정렬 기준이 바뀌게 됩니다.

• 반환 값 < 0 : a가 b보다 앞에 있어야 한다.
• 반환 값 = 0 : a와 b의 순서를 바꾸지 않는다.
• 반환 값 > 0 : b가 a보다 앞에 있어야 한다.

 

위의 조건들을 직접 구현해 볼 수 있으며, if문 내의 조건들을 바꿔서 자기가 원하는 정렬 조건을 직접 정의할 수 있습니다.

const nums = [7, 3, 8, 2, 10];

nums.sort((a, b) => {
	if (a > b){
    	return 1;
    }
    if (a === b) {
    	return 0;
    }
    if (a < b){
    	return -1;
    }
});

console.log(nums);

// 결과 = [2, 3, 7, 8, 10]

 

마지막으로, sort 메서드는 원본 배열을 정렬하기 때문에 주의해야 합니다.

const nums = [7, 3, 8, 2, 10];

const sortedNums = nums.sort((a, b) => a - b);

sortedNums === nums

// 결과 = true

 

오탈자, 오류 지적, 보완할 점 등 언제나 환영합니다.

메일이나 댓글로 남겨주시면 확인 후 수정하겠습니다.