map()

Array.prototype.map()

배열 내의 모든 요소마다 callback 함수를 적용한 결과로 구성된 새로운 배열 반환

let newArray = arr.map(callback(currentValue[, index[, array]]) {
  // return element for newArray, after executing something
}

const numList = [1, 2, 4, 5, 10]
let result = numList.map((num) => { 
    return num
})
console.log(result)

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

배열 numList안의 요소들을 하나씩 그대로 새로운 배열에 담아서 반환한다.

const numList = [1, 2, 4, 5, 10]
let result = numList.map((num) => {
    return num * 2
})
console.log(result)

// 결과
[2, 4, 8, 10, 20]

배열 numList안의 요소들을 하나씩 2를 곱한 후 새로운 배열에 담아서 반환하고, 기존의 numList는 변하지 않는다.

const personList = [
      { name: 'kim', sex: 'M' },
      { name: 'lee', sex: 'W' },
      { name: 'park', sex: 'M' }
    ]
let result = personList.map((el) => {
    if (el.sex === 'M') {
        return 'Man'
    } else {
        return 'Woman'
    }
})
console.log(result)

// 결과
["Man", "Woman", "Man"]

배열 personList안의 객체 요소들을 조건에 맞게 변환한 후 새로운 배열로 반환하고, 기존의 numList는 역시 변하지 않는다.

filter()

Array.prototype.filter()

배열 내의 모든 요소마다 조건 확인 후 조건을 만족하는 요소들로 구성된 새로운 배열 반환

let newArray = arr.filter(callback(currentValue[, index, [array]]) {
  // return element for newArray, if true
}[, thisArg]);

const numList = [1, 2, 4, 5, 10]
let result = numList.filter((num) => { 
    return num < 5
})
console.log(result)

// 결과
[1, 2, 4]

배열 numList안의 요소들을 하나씩 그대로 새로운 배열에 담아서 반환한다.

const personList = [
      { name: 'kim', sex: 'M' },
      { name: 'lee', sex: 'W' },
      { name: 'park', sex: 'M' }
    ]
let result = personList.filter((el) => {
    return el.sex === 'M'
})
console.log(result)

// 결과
 [
      { name: 'kim', sex: 'M' },
      { name: 'park', sex: 'M' }
 ]

배열 personList안의 객체 요소들을 조건에 맞게 변환한 후 새로운 배열로 반환하고, 기존의 numList는 변하지 않고 그대로 존재하게 된다.