[JavaScript] Array.sort() / Array.filter() / Array.map()

0후·2022년 2월 28일
0

프론트엔드

목록 보기
23/41

sort()

sort() 메서드는 배열의 요소를 적절한 위치에 정렬한 후 그 배열을 반환한다.

const array1 = [1, 30, 4, 21, 100000];
array1.sort();

console.log(array1);
// 결과
// [1, 100000, 21, 30, 4]

결과값이 좀 이상하다. 작은 수에서 큰 수로 이루어져야 하는거 아닌가? 상식적으로 생각한다면 작은 수에서 큰 수로 array가 정렬되어야 하는 것이 맞다. 하지만, sort() 함수의 기본 정렬 순서는 문자열의 유니코드 포인트를 따르기 때문에, 숫자의 값을 비교하는 것이 아닌 문자처럼 생각하여 1,2000,33434242,4,5 이런 식으로 정렬해버린다. 이런 점을 방지하기 위해 callback 함수를 써준다.

var numbers = [4, 2, 5, 1, 3];
numbers.sort(function(a, b) {
  return a - b;
});

console.log(numbers);

// 결과
// [1, 2, 3, 4, 5]

filter()

ES6에서 새로 나온 filter() 메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환한다. filter를 쓰고자 한다면 그 앞에 새로운 변수명을 지정해줘야한다.

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];

// ES6 버전
const result = words.filter(word => word.length > 6);
// 전통적 버전
const result = words.filter(function(word){return word.length > 6})

console.log(result);

// 결과
// ["exuberant", "destruction", "present"]

map()

ES6에서 새로 나온 map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환한다. 즉, 내용을 변경해주고 싶을 때 사용한다. map을 쓰고자 한다면 그 앞에 새로운 변수명을 지정해줘야한다.

const array1 = [1, 4, 9, 16];

// ES6 버전
const map1 = array1.map(x => x * 2);
// 전통적 버전
const map1 = array1.map(function(x){return x * 2});

console.log(map1);

// 결과
// [2, 8, 18, 32]
profile
휘발방지

0개의 댓글