반응형
forEach vs map
forEach를 쓸 때와 map을 쓸 때가 있다
차이점을 알아보자
① forEach()
Array 요소를 제공된 함수로 한 번 실행
아무 값도 반환하지 않는다
기존 배열 변경 가능
const arr = [1, 2, 3]
aarrrray.forEach((item, index) => {
arr[index] = item * 2
})
console.log(arr) // [2, 4, 6]
② map()
모든 Array 요소가 제공된 함수로 호출될 때 새로운 array를 생성
기존의 배열을 가공하여 새로운 배열을 생성할 때 사용
=> 기존 배열은 값이 바뀌지 않고 유지
const arr = [1, 2, 3]
const newArray = arr.map(item => {
return item * 2
})
console.log(newArray) // [2, 4, 6]
=> {} 중괄호 사용 시 return이 꼭 있어야 한다
return 안 쓰고 싶으면 () 사용
const newArray2 = arr.map(item => (
item * 2
))
var arr = [1, 2, 3]
arr.map(item => {
item * 2
})
console.log(arr) // [1, 2, 3]
=> 기존 배열의 값은 바뀌지 않고, 새로운 변수에 값을 담아야 한다
반응형
'JavaScript' 카테고리의 다른 글
[#. JavaScript] 배열 array에 특정 값이 포함되어 있는지 여부 체크하기 (0) | 2021.02.15 |
---|---|
[#. JavaScript] Date() 날짜 함수 YYYY-mm-dd HH:mm:ss format 형식으로 표기하기 (0) | 2021.01.25 |
[#. JavaScript] 정규표현식을 이용해서 input 입력 폼에서 소수점 첫째 자리까지만 입력할 수 있도록 막기 (0) | 2020.11.30 |
[#. JavaScript] chart.js doughnut(donut) chart 원형 차트 생성, 사용하기 (0) | 2020.11.24 |
[#. JavaScript] Math.pow(a, b) 제곱 구하기 (0) | 2020.11.19 |