[ TIL ] [ ์ •๊ทœ๊ณผ์ • : ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๊ธฐ์ดˆ2 ] ์ฃผํŠน๊ธฐ์–ธ์–ด์™€ ์นœํ•ด์ง€์ž.

2023. 8. 19. 00:54ใ†0. TiL ( Today I Learned )

 

ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๊ธฐ์ดˆ2 : ์•Œ๊ณ ๋ฆฌ์ฆ˜ ํŽ˜์–ด ํ”„๋กœ๊ทธ๋ž˜๋ฐ 
 

์–ด๋ ค์› ๋˜ ๋ฒ ์ด์Šค๋ณผ ๊ฒŒ์ž„ ๋งŒ๋“ค๊ธฐ ํŒ€๊ณผ์ œ๊ฐ€ ๋๋‚˜๊ณ , ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๊ธฐ์ดˆ 2์ฃผ ์ฐจ๊ฐ€ ์‹œ์ž‘๋˜์—ˆ๋‹ค.
์ด๋ฒˆ์ฃผ๋Š” '์ฃผํŠน๊ธฐ์–ธ์–ด์™€ ์นœํ•ด์ง€๊ธฐ' ๊ทธ๋ฆฌ๊ณ  '์•Œ๊ณ ๋ฆฌ์ฆ˜ ๋ฌธ์ œ ์ฐ๋จนํ•˜๊ธฐ'๋กœ ๋ฐœ์ œ ๋˜์—ˆ๋‹ค. 
 
์•Œ๊ณ ๋ฆฌ์ฆ˜ ๋ฌธ์ œ๋Š”  ๋ฐฉํ–ฅ๊ณผ ์ „๋žต์„ ์ œ์‹œํ•ด ์ฃผ๋Š” '๋‚ด๋น„๊ฒŒ์ดํ„ฐ(navigator)' ๋˜, ๊ทธ์— ๋งž๋Š” ์ฝ”๋“œ๋กœ ์ฝ”๋”ฉ์„ ํ•˜๊ณ , ์„ค๋ช…๊นŒ์ง€ ๊ฐ€๋Šฅํ•œ '๋“œ๋ผ์ด๋ฒ„(driver)'๊ฐ€ ํ•˜๋‚˜์˜ ํŽ˜์–ด๊ฐ€ ๋˜์–ด ๊ฐ์ž์˜ ์—ญํ• ์„ ์ˆ˜ํ–‰ํ•˜๋Š” ํ”„๋กœ๊ทธ๋ž˜๋ฐ์ด์—ˆ๋‹ค. 
 
๋‚จ๋“ค์— ๋น„ํ•ด ๋‚ด๊ฐ€ ์–ด๋–ค ๋ถ€๋ถ„์—์„œ ์ฝ”๋“œ๋ฅผ ์ž˜ ๊ตฌํ˜„ํ•˜์ง€ ๋ชปํ•˜๋Š”์ง€๋ฅผ ์กฐ๊ธˆ ๋” ์•Œ ์ˆ˜ ์žˆ์—ˆ๊ณ , ์ƒ๊ฐ์˜์—ญ์„ ํ™•์žฅ ํ•  ์ˆ˜ ์žˆ๋Š” ๊ธฐํšŒ๊ฐ€ ๋˜์—ˆ๋‹ค.
์˜ค๋Š˜์€ ๊ณ ์ฐจํ•จ์ˆ˜์—๋Œ€ํ•ด์„œ ์กฐ๊ธˆ ๊ณต๋ถ€๋ฅผ ํ–ˆ๋Š”๋ฐ, ํ”„๋กœ๊ทธ๋ž˜๋จธ์Šค์—์„œ ๋‹ค๋ฅธ ์‚ฌ๋žŒ๋“ค์˜ ํ•ด๋‹ต์—์„œ๋„ ์‹ฌ์‹ฌ์ฐฎ๊ฒŒ ๋ณด์˜€๋˜ mapํ•จ์ˆ˜๊ฐ€ ๊ถ๊ธˆํ–ˆ๋‹ค.
๊ตฌ๊ธ€๋ง์œผ๋กœ ์‚ฌ์šฉ์„ ํ•˜๊ธด ํ–ˆ๋Š”๋ฐ, ๋ง‰์ƒ ์ฝ”๋“œ๋ฅผ ๋งŒ๋“ค๋ ค๊ณ  ํ•˜๋‹ˆ mapํ•จ์ˆ˜์— ๋Œ€ํ•ด ์‹ฌ๋„ ๊นŠ๊ฒŒ ์•Œ์ง€ ๋ชปํ–ˆ๋‹ค.
์˜ค๋Š˜์€ ์•Œ๊ณ ๋ฆฌ์ฆ˜ ๋ฌธ์ œ๋ฅผ ํ’€๋ฉด์„œ ๊ณ ์ฐจํ•จ์ˆ˜ ํŠนํžˆ mapํ•จ์ˆ˜์— ๋Œ€ํ•ด ์กฐ๊ธˆ ๋” ์•Œ์•„๋ณด์•˜๋‹ค.
 
(์ž์ฃผ์“ฐ๋Š” ๊ณ ์ฐจํ•จ์ˆ˜) ์ถ”๊ฐ€๋กœ ๊ณต๋ถ€ํ•ด์•ผ ํ•  ๊ณ ์ฐจํ•จ์ˆ˜ : some /  reduce / filter / every / map

 


๋…ธ๋งˆ๋“œ์ฝ”๋” say 
"mapํ•จ์ˆ˜๋Š” ํ•จ์ˆ˜๋ฅผ ์‹คํ–‰ํ•˜๋Š”, ๋ชจ๋“  ๋ฐฐ์—ด์˜ ์•„์ดํ…œ์— function์„ ์‹คํ–‰ํ•˜๋Š” ๋ฉ”์„œ๋“œ์•ผ,
๊ทธ๋ฆฌ๊ณค ๋‚˜์„œ ๊ทธ ํ•จ์ˆ˜์˜ ๊ฒฐ๊ณผ ๊ฐ’์œผ๋กœ ์ƒˆ๋กœ์šด ๋ฐฐ์—ด์„ ๋งŒ๋“œ๋Š” ๊ฑฐ์ง€."

 

Youtube <๋…ธ๋งˆ๋“œ์ฝ”๋”> map ํ•จ์ˆ˜ ๊ด€๋ จ์˜์ƒ

์œ„ ์˜์ƒ์—์„œ ๋‚˜์˜ค๋Š” ๋ถ€๋ถ„์—์„œ map์— ๋Œ€ํ•ด ์„ค๋ช…ํ•œ ๋ถ€๋ถ„์„ ์ •๋ฆฌํ•˜์ž๋ฉด, 
mapํ•จ์ˆ˜๋Š” days์— ์žˆ๋Š” ๋ชจ๋“  function์„ ์‹คํ–‰ํ•œ๋‹ค. ๊ทธ๋ฆฌ๊ณ  ๊ทธ function์—์„œ ๋‚˜์˜จ ๊ฐ’์„ ์ €์žฅํ•ด์„œ ์ƒˆ๋กœ์šด ๋ฐฐ์—ด๋กœ ๋งŒ๋“ ๋‹ค. ์•„๋ž˜์™€ ๊ฐ™์ด!

const days =["Mon", "Tue", "Wend", "Thurs", "fri"]

const smilingDays= days.map(potato => console.log(potato))

// ์˜ˆ๋ฅผ ๋“ค์–ด potato๋ฅผ ์ด๋ ‡๊ฒŒ mapํ•จ์ˆ˜์— ์‚ฌ์šฉํ•˜๊ฒŒ๋˜๋ฉด, ๋ฐฐ์—ด์˜ ๊ฐ๊ฐ์˜ ๊ฐ’์„ ๊ฐ€์ง€๊ฒŒ๋œ๋‹ค.
// arry.map ํ•จ์ˆ˜๋Š” returnํ•œ ๊ฐ’์œผ๋กœ ์ด๋ฃจ์–ด์ง„ ๋ฐฐ์—ด์„ ๋‹ค์‹œ returnํ•œ๋‹ค.

// Mon
// Tue
// Wend
// Thurs
// fri

 
 


 
์ถ”๊ฐ€๋กœ, ์•„๋ž˜์˜ ์‚ฌ์ดํŠธ์—์„œ ๋ณธ mapํ•จ์ˆ˜์— ๋Œ€ํ•ด ๋ถ€๊ฐ€ ์„ค๋ช…์„ ํ•˜์ž๋ฉด,  ๋ฐฐ์—ด์„ ์ˆœํšŒํ•˜๋ฉฐ ๊ฐ ์š”์†Œ์— ๋Œ€ํ•˜์—ฌ ์ธ์ž๋กœ ์ฃผ์–ด์ง„ ์ฝœ๋ฐฑ ํ•จ์ˆ˜์˜ ๋ฐ˜ํ™˜๊ฐ’(๊ฒฐ๊ด๊ฐ’)์œผ๋กœ ์ƒˆ๋กœ์šด ๋ฐฐ์—ด์„ ์ƒ์„ฑํ•˜์—ฌ ๋ฐ˜ํ™˜ํ•œ๋‹ค. ์ด๋•Œ ์›๋ณธ ๋ฐฐ์—ด์€ ๋ณ€๊ฒฝ๋˜์ง€ ์•Š๋Š”๋‹ค.
forEach ๋ฉ”์„œ๋“œ๋Š” ๋ฐฐ์—ด์„ ์ˆœํšŒํ•˜๋ฉฐ ์š”์†Œ ๊ฐ’์„ ์ฐธ์กฐํ•˜์—ฌ ๋ฌด์–ธ๊ฐ€๋ฅผ ํ•˜๊ธฐ ์œ„ํ•œ ํ•จ์ˆ˜ ์ด๋ฉฐ map ๋ฉ”์†Œ๋“œ๋Š” ๋ฐฐ์—ด์„ ์ˆœํšŒํ•˜๋ฉฐ ์š”์†Œ ๊ฐ’์„ ๋‹ค๋ฅธ ๊ฐ’์œผ๋กœ ๋งตํ•‘ํ•˜๊ธฐ ์œ„ํ•œ ํ•จ์ˆ˜์ด๋‹ค.
poiemaweb ๋‚ด์šฉ (์ฐธ๊ณ  ๊ด€๋ จ URL) : https://poiemaweb.com/js-array-higher-order-function

Higher order function | PoiemaWeb

๋ฐฐ์—ด(array)๋Š” 1๊ฐœ์˜ ๋ณ€์ˆ˜์— ์—ฌ๋Ÿฌ ๊ฐœ์˜ ๊ฐ’์„ ์ˆœ์ฐจ์ ์œผ๋กœ ์ €์žฅํ•  ๋•Œ ์‚ฌ์šฉํ•œ๋‹ค. ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์˜ ๋ฐฐ์—ด์€ ๊ฐ์ฒด์ด๋ฉฐ ์œ ์šฉํ•œ ๋‚ด์žฅ ๋ฉ”์†Œ๋“œ๋ฅผ ํฌํ•จํ•˜๊ณ  ์žˆ๋‹ค.

poiemaweb.com

(* ์ฐธ๊ณ ๋กœ poiemaweb ์‚ฌ์ดํŠธ๋Š” ๊ธฐ์ˆ ๋งค๋‹ˆ์ €๋‹˜์ด ์ถ”์ฒœํ•ด ์ฃผ์‹  ์‚ฌ์ดํŠธ๋‹ค. '๋ชจ๋˜์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ' ์ฑ…์„ ๊ธฐ๋ฐ˜์œผ๋กœ ์“ฐ์ธ ์ •๋ณด์ธ ๊ฒƒ ๊ฐ™์€๋ฐ,
์ด ์ฑ…์„ ์ข…์ด์ฑ…์œผ๋กœ ๊ฐ€์ง€๊ณ  ์žˆ๋Š” ๋‚˜๋กœ์„ , ๋ณด๊ธฐ ํŽธํ•˜๊ฒŒ ๋˜์–ด์žˆ๋Š” ๊ฒƒ ๊ฐ™์•„์„œ ์ข‹์€ ๊ฒƒ ๊ฐ™๋‹ค.) 

 


 

์–ด์ œ๋Š” ์‹œํ—˜ + ํŒ€ํ”„๋กœ์ ํŠธ ์ œ์ถœ + ์•Œ๊ณ ๋ฆฌ์ฆ˜ ์Šคํ„ฐ๋”” + ๊ธฐ์ˆ ๋งค๋‹ˆ์ €๋‹˜ ๋ฉด๋‹ด + ํ•‘๊ณ„ +... ํ•‘๊ณ„...๋กœ,,, ์ธํ•ด Til์„ ์•ˆ ์“ฐ๊ณ  ์ž๋ฒ„๋ ธ๋‹ค,,
๊ทธ๋ž˜์„œ ์–‘์‹ฌ์ƒ ์‹œ๊ฐ„ ๋ช‡ ๋ถ„ ๋” ํ• ์• ํ•ด์„œ ๊ธธ๊ฒŒ ์“ฐ๋Š” ์ค‘์ด๋‹ค.. 
 
ํŽ˜์–ดํ”„๋กœ๊ทธ๋žจ์„ ์˜ค๋Š˜ ๋๋‚ธ ์†Œ๊ฐ์€,, ์˜ค.. ์‹ ์„ ํ–ˆ๋‹ค! 
์•„์ง js๋ฌธ๋ฒ•๊ณผ ์‚ฌ์ด๊ฐ€ ์ข‹์ง€ ์•Š์€ ๋‚˜๋Š”, ๋œ์ปฅ ๊ฑฑ์ •์ด ๋˜์—ˆ๊ณ .. (์šฐ๋ฆฌ ์ด์ œ ์ œ๋ฒ• ๋งŒ๋‚ฌ์ง€ ์•Š์•˜๋‹ˆ, ์™œ ๋งค๋ฒˆ ๋‚ฏ๊ฐ€๋ ค?.. ์šฐ๋ฆฌ ์–ธ์ œ ์นœํ•ด์ ธ? )
ํŽ˜์–ดํ”„๋กœ๊ทธ๋žจ์ด ๋ฐœ์ œ๋˜๋ฉด์„œ.. ์˜ค.. ๋‚˜.. ๋‚จ๋“ค์—๊ฒŒ ํ”ผํ•ด์ฃผ๋‚˜.. ํ•˜๋Š” ์ƒ๊ฐ์— ๋‘ ๋ฒˆ ๊ฑฑ์ •.. ์ผ์ฃผ์ผ ๋™์•ˆ ๋ฌธ์ œ๋งŒ ํ‘ผ๋‹ค๋Š” ๊ฒƒ์—.. ์„ธ ๋ฒˆ ๊ฑฑ์ •.. ๊ทธ ๋ฌธ์ œ๋Ÿ‰์ด ์–ด๋งˆ๋ฌด์‹œ ๋‹ค๋Š” ๊ฒƒ์— ๋„ค ๋ฒˆ ๊ฑฑ์ •.. ๊ทธ๋ƒฅ ๊ฑฑ์ •.. ์—๊ฑฑ์ •์—.. ๊ฑฑ์ •..์ด์—ˆ์ง€๋งŒ...... ์ข‹์•˜๋‹ค! 
 
๋‚ด๊ฐ€ ์ƒ๊ฐํ•˜์ง€ ๋ชปํ•œ ์ƒ๊ฐ์„ ๊ณต์œ ํ•  ์ˆ˜ ์žˆ์–ด์„œ ์ข‹์•˜๋‹ฌ๊นŒ.. ์ ‘๊ทผ์„ ์™„์ „ํžˆ ๋‹ฌ๋ฆฌํ•˜๋Š” ๋ถ„๋“ค๋„ ์žˆ์—ˆ๊ณ , ๋‚˜์™€ ๋‹ค๋ฅธ ์‚ฌ๊ณ ํšŒ๋กœ๋ฅผ ๊ฐ€์ง€๊ณ  ์žˆ๋‹ค ์ƒ๊ฐ์ด ๋“œ๋Š” ๋ถ„๋“ค๋„ ์žˆ์—ˆ๋‹ค.. ๋‚˜ ๊ฐ™์€ ๋ฌธ๊ณผ์Ÿ์ด๋Š” ๋ชจ๋ฅด๋Š” ์ด๊ณผ์ƒ๋“ค์˜ ์„ธ๊ณ„๋ž„๊นŒ.. ๊ทธ๋ž˜๋„ ๋งŽ์ด ์ž๊ทน๋ฐ›์œผ๋ฉด์„œ ๊ณต๋ถ€ํ•  ์ˆ˜ ์žˆ์–ด์„œ ์ข‹์•˜๋‹ค!
๋‹ˆ์™€ ๋‹ค๋ฅด๊ฒŒ ํ’€์—ˆ๋˜ ์‹ ์„ ํ–ˆ๋˜ ์ ‘๊ทผ๋ฒ•๋“ค์„  ๋”ฐ๋กœ ์ฒดํฌ๋„ ํ•ด๋‘์—ˆ๋Š”๋ฐ, ์–ธ์ œ ์ •๋ฆฌํ•ด์„œ ์˜ฌ๋ฆฌ๋Š” ์‹œ๊ฐ„๋„ ๊ฐ€์ ธ์•ผ์ง€.. ๋‚ด ๊ฑธ๋กœ ๋งŒ๋“ค๊ฒ ๋‹ค..!  ( ์›๋ž˜.. ์ฐฝ์ž‘์€ ๋ชจ๋ฐฉ์—์„œ๋ถ€ํ„ฐ ์‹œ์ž‘๋œ๋‹ค๊ณ ..?   ? ? )

 

์ด๋ฒˆ์ฃผ ์‹œ๊ฐ„์ด ๋นจ๋ฆฌ ๊ฐ”๋‹ค.. ์•„์ง 3์ฃผ ์ฐจ ๊ฐ•์˜ ๋œ ๋ดค๋Š”๋ฐ,,  ๊ธฐ์ˆ ๋งค๋‹ˆ์ €๋‹˜์„ ์—ฐ๋‹ฌ์•„ 2์ผ์„ ๋ณด๋ฉด์„œ, ๋Œ€ํ™”์†Œ์žฌ๊ฑฐ๋ฆฌ๊ฐ€ ์กฐ๊ธˆ ๋–จ์–ด์กŒ์ง€๋งŒ ์งˆ๋ฌธํญ๊ฒฉ์„ ํ•ด์•ผ ํ•œ๋‹ค๊ณ  ํ•ด์„œ, ์—ด์‹ฌํžˆ ์งˆ๋ฌธํ–ˆ๋‹ค.. ๊ทธ๋ฆฌ๊ณ  ์ž์ฃผ ๋ณด๋Š”(?) ๊ฐœ๋ฐœ ํ˜น์€ ์ฝ”๋”ฉ ์œ ํŠœ๋ฒ„๋“ค์„ ์ถ”์ฒœ๋ฐ›์•˜๋‹ค. ( ์œ ํŠœ๋ธŒ๋กœ ๊ณต๋ถ€ํ•˜๋Š” ๊ฑฐ ์ข‹์•„ํ•จ.. ใ…Ž ์žฌ๋ฐŒ๊ฒŒ ๊ณต๋ถ€ํ•˜๋ฉด ์ข‹์ž–์•„์š”? )
์‰ฌ์šด ์ฝ”๋“œ, ์ œ๋กœ์ดˆ, ๊ฐœ๋ฐœ๋ฐ”๋‹ฅ์ด ์žˆ์—ˆ๋Š”๋ฐ ์ œ๋กœ์ดˆ๋‚˜ ์‰ฌ์šด ์ฝ”๋“œ๋Š” ๊ฐ€๋” ๋ดค์—ˆ๋Š”๋ฐ ๊ฐœ๋ฐœ๋ฐ”๋‹ฅ์€ ์˜ค.. ์ฒ˜์Œ ๋ดค๋‹ค ์‹œ๊ฐ„ ๋‚  ๋•Œ ๋‹ค ๋ด์•ผ์ง€..