[JavaScript][기초] 배열 변형 메소드 (filter, map, sort, toSorted)

1. filter
기존 배열에서 조건을 만족하는 요소들만 필터링하여 "새로운 배열"로 반환

let arr1 = [
  { name: "dy lee", address: "KR" },
  { name: "sy im", address: "KR" },
  { name: "yj kim", address: "US" },
];

const bundangPeople = arr1.filter((item) => item.address === "KR");

console.log(bundangPeople);
// [
//     {
//         "name": "dy lee",
//         "address": "KR"
//     },
//     {
//         "name": "sy im",
//         "address": "KR"
//     }
// ]

 

2. map
배열의 모든 요소를 순회하면서, 각각 콜백함수를 실행하고 그 결과값들을 모아서 "새로운 배열"로 반환

let arr2 = [1, 2, 3];

const mapResult1 = arr2.map((item, idx, arr) => {
  console.log(idx, item);
  return item * 2;
});
console.log(mapResult1); // [2, 4, 6]

let names = arr1.map((item) => item.name);
console.log(names); // ['dy lee', 'sy im', 'yj kim']

 

3. sort
배열을 사전순으로 정렬하는 메소드

let arr3 = ["z", "f", "a"];
arr3.sort();
console.log(arr3); // ['a', 'f', 'z']

let arrNumber = [10, 3, 21, 5, 4];

// 숫자도 사전순으로 정렬되는 문제가 있음
console.log(arrNumber.sort()); // [10, 21, 3, 4, 5]

// 오름차순 정렬
arrNumber.sort((a, b) => {
  if (a > b) {
    return 1;
  } else if (a < b) {
    return -1;
  } else {
    return 0;
  }
});
console.log(arrNumber); // [3, 4, 5, 10, 21]

 

4. toSorted
원본 배열은 그대로 두고, 정렬 된 새로운 배열을 반환

let arr5 = ["e", "a", "g", "z"];
const sortedArr = arr5.toSorted();
console.log(arr5); // ['e', 'a', 'g', 'z']
console.log(sortedArr); // ['a', 'e', 'g', 'z']

 

5. join
배열의 모든 요소를 하나의 문자열로합쳐서 반환하는 메소드

let arr6 = ["hi", "i am", "DY lee"];
const joined = arr6.join();
console.log(joined); // hi,i am,DY lee

const joinedDash = arr6.join("-");
console.log(joinedDash); // hi-i am-DY lee