Js Reduce
reduce ๐ก
๊ณ ์ฐจํจ์ ์ค ํ๋์ธ reduce ์ ์ฌ์ฉํ๊ณ ์์์ผ๋, ์ค๋๋ง์ ์ฐ๋ ค๊ณ ํ๋ฉด
์๊พธ ํท๊ฐ๋ ค ๊ฐ๋จํ๊ฒ ์ ๋ฆฌํด ๋ณด๋ ค๊ณ ํ๋ค.
๊ณ ์ฐจํจ์๋?
- ์ด๋ค ํ๋ก๊ทธ๋๋ฐ ์ธ์ด์ ํจ์ ๊ตฌํ์์ ํจ์๋ฅผ ์ธ์๋ก ๋๊ธธ ์ ์๊ฑฐ๋ ๋ฐํํ ์ ์์ ๋ ํจ์๋ฅผ ์ผ๊ธ ๊ฐ์ฒด(์ธ์ด ๋ด๋ถ์์ ๊ฐ์ผ๋ก ํํ๋๊ณ ์ ๋ฌ๋ ์ ์๋ ์๋ฃํ)๋ก ์ทจ๊ธ ํ๊ณ , ํจ์๋ฅผ ์ธ์๋ก ๋ฐ๊ฑฐ๋ ๊ฒฐ๊ณผ๋ก ๋ฐํํ๋ ํจ์๋ฅผ ๊ณ ์ฐจ ํจ์๋ผ ํ๋ค. [์ฐธ๊ณ ]: ๋๋ฌด์ํค
์ฌ์ฉ๋ฐฉ๋ฒ
arr.reduce(Callback(1๏ธโฃ accumulator, 2๏ธโฃ currentValue, 3๏ธโฃ index, 4๏ธโฃ array), 5๏ธโฃ -initialValue-) 1๏ธโฃ: ์ฝ๋ฐฑ์ ๋ฐํ๊ฐ์ ๋์ 2๏ธโฃ: ํ์ฌ ์ฒ๋ฆฌํ ๊ฐ(์์) 3๏ธโฃ: ์ฒ๋ฆฌํ ์์์ index๊ฐ(optional) 4๏ธโฃ: reduce๋ฅผ ํธ์ถํ ๋ฐฐ์ด(optional) 5๏ธโฃ: ๋์ ์ ์์ํ ์ด๊ธฐ ๊ฐ(optional: ์ ๋ ฅํ์ง ์์ผ๋ฉด ๋ฐฐ์ด์ ์ฒซ๋ฒ์งธ ์์)
const arr = [1, 2, 3, 4, 5];
const result = arr.reduce((acc, cur, -idx, arr-) => acc + cur, -์ ์ง ์์ผ๋ฉด 1-)
console.log(result) // 15
๊ฐ์ ํฉ์ฐํ๋ ๊ฒ ๋ง๊ณ ๋ ๋ค๋ฅธ ์ฉ๋๋ก ์ฌ์ฉ๋ ์ ์๋ค.
์ค์ฒฉ๋ ๋ฐฐ์ด ํํํ
const arr = [[1,2,3,4],[5,6,7,8]];
console.log(arr.reduce((acc, cur) => acc.concat(cur)))
// [1,2,3,4,5,6,7,8]
// initialValue ์
๋ ฅ x ๋ฐ๋ผ์ ๋ฐฐ์ด์ ์ฒซ ์์์ธ [1,2,3,4].concat([5,6,7,8])์ ๊ฒฐ๊ณผ๊ฐ ๋์จ๋ค.
๋ฐฐ์ด ๋ด์ ์์ ๊ฐฏ์ ํ์
const arr = ['apple', 'banana', 'apple', 'mango', 'watermelon', 'apple'];
const fruit = arr.reduce((acc, cur) => {
if(cur in acc) {
acc[cur]++
} else {
acc[cur] = 1
}
return acc;
}, {})
console.log(fruit); // {apple: 3, banana: 1, mango: 1, watermelon: 1}
// ์ด๊ธฐ๊ฐ์ผ๋ก ๋น ๊ฐ์ฒด {}๋ฅผ ๋์ ๋ค ๊ฐ์ฒด์ ํค๊ฐ์ด ์กด์ฌํ์ง ์๋๋ค๋ฉด ๋ฑ๋ก, ์๋๋ฉด ์ฆ๊ฐ
๋ฐฐ์ด ๋ด ํน์ ๊ฐ ํน์ ์์ฑ์ผ๋ก ์ ๋ ฌ
const info = [
{
name: '์คํํฌ',
age: 52,
union: 'avengers'
},
{
name: '๋ฐฐ๋',
age: 50,
union: 'avengers'
},
{
name: 'ํผํฐ',
age: 22,
union: 'avengers'
},
{
name: '์คํฐ๋ธ',
age: 48,
union: 'free'
},
{
name: 'vision',
age: '???',
union: 'free'
},
{
name: '์๋ค',
age: 32,
union: 'free'
}
]
>
const sorted = info.reduce((acc, cur) => {
const key = cur['union'] // free or avengers
if(!acc[key]) {
acc[key] = []
}
acc[key].push(cur);
return acc; // return ์์ง ๋ง์ !!
}, {})
์ฃผ์์ฌํญโ๏ธ ์ ์ฝ๋์์ if ๋ค์ else์ pushํ๊ฒ ๋๋ค๋ฉด ์ํ๋ ๊ฒฐ๊ณผ๊ฐ ๋์ค์ง ์๋๋ค !!
์ค๋ณต ๋ฐฐ์ด ์์ ์ ๊ฑฐ
const arr = [1,1,1,22,2,2,3,3,3,34,5,5,];
const newArr = arr.sort((a, b) => a - b).reduce((acc, cur) => {
const leng = acc.length;
if(leng === 0 || acc[leng-1] !== cur) {
acc.push(cur)
}
return acc;
}, [])
console.log(newArr) // [1, 2, 3, 5, 22, 34]
์ด์ ๊ฐ์ด ๋ค์ํ๊ฒ ์ฐ์ผ ์ ์๋ค. ์ ์ฉํ reduce ์ฌ์ฉ ๋ฐฉ๋ฒ์ ๋ฐ๊ฒฌํ๊ฒ ๋๋ฉด ์ถ๊ฐ
# reduce ๐ก ๊ณ ์ฐจํจ์ ์ค ํ๋์ธ reduce ์ ์ฌ์ฉํ๊ณ ์์์ผ๋, ์ค๋๋ง์ ์ฐ๋ ค๊ณ ํ๋ฉด ์๊พธ ํท๊ฐ๋ ค ๊ฐ๋จํ๊ฒ ์ ๋ฆฌํด ๋ณด๋ ค๊ณ ํ๋ค. ### ๊ณ ์ฐจํจ์๋? >- ์ด๋ค ํ๋ก๊ทธ๋๋ฐ ์ธ์ด์ ํจ์ ๊ตฌํ์์ ํจ์๋ฅผ ์ธ์๋ก ๋๊ธธ ์ ์๊ฑฐ๋ ๋ฐํํ ์ ์์ ๋ ํจ์๋ฅผ ์ผ๊ธ ๊ฐ์ฒด(์ธ์ด ๋ด๋ถ์์ ๊ฐ์ผ๋ก ํํ๋๊ณ ์ ๋ฌ๋ ์ ์๋ ์๋ฃํ)๋ก ์ทจ๊ธ ํ๊ณ , ํจ์๋ฅผ ์ธ์๋ก ๋ฐ๊ฑฐ๋ ๊ฒฐ๊ณผ๋ก ๋ฐํํ๋ ํจ์๋ฅผ ๊ณ ์ฐจ ํจ์๋ผ ํ๋ค. [[์ฐธ๊ณ ]: ๋๋ฌด์ํค](https://namu.wiki/w/%EA%B3%A0%EC%B0%A8%20%ED%95%A8%EC%88%98) ### ์ฌ์ฉ๋ฐฉ๋ฒ arr.reduce(Callback(1๏ธโฃ accumulator, 2๏ธโฃ currentValue, 3๏ธโฃ index, 4๏ธโฃ array), 5๏ธโฃ -initialValue-) 1๏ธโฃ: ์ฝ๋ฐฑ์ ๋ฐํ๊ฐ์ ๋์ 2๏ธโฃ: ํ์ฌ ์ฒ๋ฆฌํ ๊ฐ(์์) 3๏ธโฃ: ์ฒ๋ฆฌํ ์์์ index๊ฐ(optional) 4๏ธโฃ: reduce๋ฅผ ํธ์ถํ ๋ฐฐ์ด(optional) 5๏ธโฃ: ๋์ ์ ์์ํ ์ด๊ธฐ ๊ฐ(optional: ์ ๋ ฅํ์ง ์์ผ๋ฉด ๋ฐฐ์ด์ ์ฒซ๋ฒ์งธ ์์) ```js const arr = [1, 2, 3, 4, 5]; const result = arr.reduce((acc, cur, -idx, arr-) => acc + cur, -์ ์ง ์์ผ๋ฉด 1-) console.log(result) // 15 ``` ๊ฐ์ ํฉ์ฐํ๋ ๊ฒ ๋ง๊ณ ๋ ๋ค๋ฅธ ์ฉ๋๋ก ์ฌ์ฉ๋ ์ ์๋ค. > #### ์ค์ฒฉ๋ ๋ฐฐ์ด ํํํ ```js const arr = [[1,2,3,4],[5,6,7,8]]; console.log(arr.reduce((acc, cur) => acc.concat(cur))) // [1,2,3,4,5,6,7,8] // initialValue ์ ๋ ฅ x ๋ฐ๋ผ์ ๋ฐฐ์ด์ ์ฒซ ์์์ธ [1,2,3,4].concat([5,6,7,8])์ ๊ฒฐ๊ณผ๊ฐ ๋์จ๋ค. ``` #### ๋ฐฐ์ด ๋ด์ ์์ ๊ฐฏ์ ํ์ ```js const arr = ['apple', 'banana', 'apple', 'mango', 'watermelon', 'apple']; const fruit = arr.reduce((acc, cur) => { if(cur in acc) { acc[cur]++ } else { acc[cur] = 1 } return acc; }, {}) console.log(fruit); // {apple: 3, banana: 1, mango: 1, watermelon: 1} // ์ด๊ธฐ๊ฐ์ผ๋ก ๋น ๊ฐ์ฒด {}๋ฅผ ๋์ ๋ค ๊ฐ์ฒด์ ํค๊ฐ์ด ์กด์ฌํ์ง ์๋๋ค๋ฉด ๋ฑ๋ก, ์๋๋ฉด ์ฆ๊ฐ ``` #### ๋ฐฐ์ด ๋ด ํน์ ๊ฐ ํน์ ์์ฑ์ผ๋ก ์ ๋ ฌ ```js const info = [ { name: '์คํํฌ', age: 52, union: 'avengers' }, { name: '๋ฐฐ๋', age: 50, union: 'avengers' }, { name: 'ํผํฐ', age: 22, union: 'avengers' }, { name: '์คํฐ๋ธ', age: 48, union: 'free' }, { name: 'vision', age: '???', union: 'free' }, { name: '์๋ค', age: 32, union: 'free' } ] > const sorted = info.reduce((acc, cur) => { const key = cur['union'] // free or avengers if(!acc[key]) { acc[key] = [] } acc[key].push(cur); return acc; // return ์์ง ๋ง์ !! }, {}) ``` ![](https://images.velog.io/images/ajrfyd/post/920b4030-a33a-443a-8f67-2a02791f7ea9/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202022-01-18%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%203.45.31.png) ์ฃผ์์ฌํญโ๏ธ ์ ์ฝ๋์์ if ๋ค์ else์ pushํ๊ฒ ๋๋ค๋ฉด ์ํ๋ ๊ฒฐ๊ณผ๊ฐ ๋์ค์ง ์๋๋ค !! #### ์ค๋ณต ๋ฐฐ์ด ์์ ์ ๊ฑฐ ```js const arr = [1,1,1,22,2,2,3,3,3,34,5,5,]; const newArr = arr.sort((a, b) => a - b).reduce((acc, cur) => { const leng = acc.length; if(leng === 0 || acc[leng-1] !== cur) { acc.push(cur) } return acc; }, []) console.log(newArr) // [1, 2, 3, 5, 22, 34] ``` ์ด์ ๊ฐ์ด ๋ค์ํ๊ฒ ์ฐ์ผ ์ ์๋ค. ์ ์ฉํ reduce ์ฌ์ฉ ๋ฐฉ๋ฒ์ ๋ฐ๊ฒฌํ๊ฒ ๋๋ฉด ์ถ๊ฐ