Skip to Content
Sunbeen's Blog
Documents๊ตฌ TypescriptTypescript_Example01. ๐ŸŸฆ foreach, map ๋ถ„์„

01. ๐ŸŸฆ foreach, map ๋ถ„์„

๐Ÿ“Œ ์ธํ„ฐํŽ˜์ด์Šค์˜ ์ œ๋„ˆ๋ฆญ

interface A<T>

๐Ÿ“Œ ํƒ€์ž…์˜ ์ œ๋„ˆ๋ฆญ

type A<T>

๐Ÿ“Œ class์˜ ์ œ๋„ˆ๋ฆญ

class A<T>

๐Ÿ“Œ ํƒ€์ž… ์ถ”๋ก 

foreach๋Š” ์ œ๋„ˆ๋ฆญ์„ ์ด์šฉํ•˜์—ฌ, ํƒ€์ž… ์ถ”๋ก ์ด ๊ฐ€๋Šฅํ•˜๋‹ค.

// value: number [1, 2, 3] .forEach((value) => { console.log(value); }) [ // value: string ("1", "2", "3") ].forEach((value) => { console.log(value); }) [ // value: boolean (true, false, true) ].forEach((value) => { console.log(value); }) [ // value : number | string | boolean (123, "123", true) ].forEach((value) => { console.log(value); });

๐Ÿ“Œ ์ œ๋„ˆ๋ฆญ์„ ์‚ฌ์šฉํ•˜๋Š” ์ด์œ 

// ํƒ€์ž…์ด ํ•œ๊ฐ€์ง€๋ผ๊ณ  ์ถ”๋ก ์ด ๋ถˆ๊ฐ€๋Šฅํ•จ // 2*2 ์ด 4๊ฐ€์ง€์˜ ๋ชจ๋“  ๊ฒฝ์šฐ๋ฅผ ๊ณ„์‚ฐํ•ด์„œ ์‚ฌ์šฉํ•  ์ˆ˜ ์—†์Œ function numOrStrAdd(a: number | string, b: number | string) { return a + b; }

๐Ÿ“Œ forEach ๋ถ„์„

//lib.es5.d.ts interface Array`<T>` { /** * Performs the specified action for each element in an array. * @param callbackfn A function that accepts up to three arguments. forEach calls the callbackfn function one time for each element in the array. * @param thisArg An object to which the this keyword can refer in the callbackfn function. If thisArg is omitted, undefined is used as the this value. * ๋ฐฐ์—ด์˜ ๊ฐ ์š”์†Œ์— ๋Œ€ํ•ด ์ง€์ •๋œ ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•ฉ๋‹ˆ๋‹ค. * @param callbackfn ์ตœ๋Œ€ ์„ธ ๊ฐœ์˜ ์ธ์ˆ˜๋ฅผ ํ—ˆ์šฉํ•˜๋Š” ํ•จ์ˆ˜์ž…๋‹ˆ๋‹ค. ๊ฐ๊ฐ์— ๋Œ€ํ•ด ๋ฐฐ์—ด์˜ ๊ฐ ์š”์†Œ์— ๋Œ€ํ•ด ํ•œ ๋ฒˆ์”ฉ callbackfn ํ•จ์ˆ˜๋ฅผ ํ˜ธ์ถœํ•ฉ๋‹ˆ๋‹ค. * @param thisArg ์ด ํ‚ค์›Œ๋“œ๊ฐ€ callbackfn ํ•จ์ˆ˜์—์„œ ์ฐธ์กฐํ•  ์ˆ˜ ์žˆ๋Š” ๊ฐ์ฒด์ž…๋‹ˆ๋‹ค. ์ด Arg๋ฅผ ์ƒ๋žตํ•˜๋ฉด undefined ๊ฐ’์ด ์ด ๊ฐ’์œผ๋กœ ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค. */ forEach(callbackfn: (value: T, index: number, array: T[]) => void, thisArg?: any): void; }
  • interface Array<T>์— forEach๊ฐ€ ์„ ์–ธ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค.
  • CallBackfn ํ•จ์ˆ˜๋Š” callbackfn: (value: T, index: number, array: T[])
  • value: T์™€ array: T[]๊ฐ€ Array<T>์˜ ์ œ๋„ˆ๋ฆญ์„ ํ•จ๊ป˜ ๊ณต์œ ํ•˜๋Š” ๊ฒƒ์ด ํ™•์ธ ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค.

๐Ÿ“Œ map ๋ถ„์„

interface Array`<T>` { /** * Calls a defined callback function on each element of an array, and returns an array that contains the results. * @param callbackfn A function that accepts up to three arguments. The map method calls the callbackfn function one time for each element in the array. * @param thisArg An object to which the this keyword can refer in the callbackfn function. If thisArg is omitted, undefined is used as the this value. * ๋ฐฐ์—ด์˜ ๊ฐ ์š”์†Œ์—์„œ ์ •์˜๋œ ์ฝœ๋ฐฑ ํ•จ์ˆ˜๋ฅผ ํ˜ธ์ถœํ•˜๊ณ  ๊ฒฐ๊ณผ๊ฐ€ ํฌํ•จ๋œ ๋ฐฐ์—ด์„ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค. * @param callbackfn ์ตœ๋Œ€ ์„ธ ๊ฐœ์˜ ์ธ์ˆ˜๋ฅผ ํ—ˆ์šฉํ•˜๋Š” ํ•จ์ˆ˜์ž…๋‹ˆ๋‹ค. ๊ฐ๊ฐ์— ๋Œ€ํ•ด ๋ฐฐ์—ด์˜ ๊ฐ ์š”์†Œ์— ๋Œ€ํ•ด ํ•œ ๋ฒˆ์”ฉ callbackfn ํ•จ์ˆ˜๋ฅผ ํ˜ธ์ถœํ•ฉ๋‹ˆ๋‹ค. * @param thisArg ์ด ํ‚ค์›Œ๋“œ๊ฐ€ callbackfn ํ•จ์ˆ˜์—์„œ ์ฐธ์กฐํ•  ์ˆ˜ ์žˆ๋Š” ๊ฐ์ฒด์ž…๋‹ˆ๋‹ค. ์ด Arg๋ฅผ ์ƒ๋žตํ•˜๋ฉด undefined ๊ฐ’์ด ์ด ๊ฐ’์œผ๋กœ ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค. */ map<U>(callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): U[]; }
  • interface Array<T>์— map์ด ์„ ์–ธ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค.
  • CallBackfn ํ•จ์ˆ˜๋Š” callbackfn: (value: T, index: number, array: T[])
    • value: T์™€ array: T[]๊ฐ€ Array<T>์˜ ์ œ๋„ˆ๋ฆญ์„ ํ•จ๊ป˜ ๊ณต์œ ํ•˜๋Š” ๊ฒƒ์ด ํ™•์ธ ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค.
  • callbackfn(~) => U
    • T์™€ ๋‹ค๋ฅธ ์ œ๋„ˆ๋ฆญ U๋ฅผ ์‚ฌ์šฉํ•œ ๊ฒƒ์„ ํ™•์ธํ•  ์ˆ˜์žˆ์Šต๋‹ˆ๋‹ค.
    • T์™€๋Š” ํƒ€์ž…์ด ๋‹ค๋ฅผ ์ˆ˜ ์žˆ๋‹ค๋Š” ์˜๋ฏธ์ด๋ฉฐ,
    • map์˜ ์ฒ˜๋ฆฌ๊ฒฐ๊ณผ๊ฐ€ U[] ๋ฐฐ์—ด์ธ ๊ฒƒ์„ ํ™•์ธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
Last updated on