reduce로 다 만들 수 있다. (map & filter)
const oneTwoThree = [1, 2, 3];
let result = oneTwoThree.map((v) => {
console.log(v);
return v;
});
// 콘솔에는 1, 2, 3이 찍힘
oneTwoThree; // [1, 2, 3]
result; // [1, 2, 3]
oneTwoThree === result; // false
result = oneTwoThree.map((v) => {
return v + 1;
});
result; // [2, 3, 4]
*** map => 규칙적인 배열만 반환할 수 있는게 아니라, 함수 안에 적어준대로 반환할 수 있기 때문에 자유도가 높다.
result = oneTwoThree.map((v) => {
if (v % 2) {
return '홀수';
}
return '짝수';
});
result; // ['홀수', '짝수', '홀수']
result = oneTwoThree.reduce((acc, cur, i) => {
console.log(acc, cur, i);
return acc + cur;
}, 0);
// 0 1 0
// 1 2 1
// 3 3 2
result; // 6
result = oneTwoThree.reduce((acc, cur, i) => {
console.log(acc, cur, i);
return acc + cur;
});
// 1 2 1
// 3 3 2
result; // 6
*** reduceRight는 reduce와 동작은 같지만 요소 순회를 오른쪽에서부터 왼쪽으로 한다는 점이 차이
result = oneTwoThree.reduceRight((acc, cur, i) => {
console.log(acc, cur, i);
return acc + cur;
}, 0);
// 0 3 2
// 3 2 1
// 5 1 0
result; // 6
result = oneTwoThree.reduce((acc, cur) => {
acc.push(cur % 2 ? '홀수' : '짝수');
return acc;
}, []);
result; // ['홀수', '짝수', '홀수']
*** 0 => false or 1 => true
result = oneTwoThree.reduce((acc, cur) => {
if (cur % 2) acc.push(cur);
return acc;
}, []);
result; // [1, 3]
// every => 모든 조건을 pass하면 => return true => or false
// reduce => return 초기값 + 축적값, 사용하면 편의함. * 초기값을 주지 않으면 자동으로 0번째 인덱스 값이 적용됨.
// 초기값을 줄 수 있는 것이 강력한 파워 => { }, [ ] 객체, 배열을 초기값으로 줄 수 있음 => map, filter 역할이 가능함.
// 초기값을 준 후, 조건을 주면 => filter
// 초기값을 준 후, 1:1 매핑만 시켜주면 => map
// 반복 되는 모든 것들은 reduce를 사용할 수 있다.
// forEach => 빈 배열 push해서 매핑하여 자주 사용한다.
// map => 새로운 배열을 만들 때 사용(1:1 매핑 시켜줌). 원본은 건드리지 않음.
// filter => 조건을 줄 때 사용하면 편의함. 원본은 건드리지 않음.
const items = ['item1', 'item2', 'item3'];
const copy = [ ] ;
// 이전
for (let i=0; i<items.length; i++) { copy.push(items[i]); }
// 이후
items.forEach(function(item){ copy.push(item); });
'TIL > TIL' 카테고리의 다른 글
Array(5).join(" " + object.key); (0) | 2020.01.21 |
---|---|
Array Method (0) | 2020.01.21 |
scope & 클로저 함수(고정 값) & 함수에서 전달인자 & 함수 표현식(변수에 함수를 선언하는 방법) (0) | 2020.01.21 |
toEqual()는 == && toBe()는 ===, 대상의 'type' (0) | 2020.01.21 |
Array & 주소값 & slice & typeof (0) | 2020.01.21 |
comment