Spread Syntax (...)
About
Spread syntax(...
)๋ 0๊ฐ ์ด์์ ๋ณ์(ํจ์ ํธ์ถ์ ๊ฒฝ์ฐ) ๋๋ ์์(๋ฐฐ์ด์ ๊ฒฝ์ฐ)๋ฅผ ํ์๋ก ํ ๋ iterable(๋ฐฐ์ด์ด๋ ๋ฌธ์์ด ๋ฑ)์ ํผ์น ์ ์๋๋ก(ํ์ฅ) ํ๋ค.
...
๋ฅผ ์ด๋ค๋ ์ ์์ Rest parameter์ ๋๊ฐ์ด ์๊ฒผ๋ค. ์ด๋ค ๋ฉด์์ rest syntax์ ์์ ํ ๋ฐ๋๋ผ๊ณ ํ ์ ์๋ค. Spread syntax๋ ๋ฐฐ์ด(array)์ ์์๋ค(elements)๋ก "ํ์ฅ"ํ์ง๋ง, rest syntax๋ ์ฌ๋ฌ ์์๋ฅผ "์์ถ" ์ํจ๋ค.
Rest syntax์ ๋ํ ๋ด์ฉ์ Rest Parameters (...)์ฐธ๊ณ .
Syntax
Spread ๋ฌธ๋ฒ์ ๊ฐ์ฒด ๋๋ ๋ฐฐ์ด์ ๋ชจ๋ ์์๊ฐ ์๋ก์ด ๊ฐ์ฒด ๋๋ ๋ฐฐ์ด์ ํฌํจ๋์ด์ผ ํ ๋๋, ์์๋ค์ด ํจ์ ํธ์ถ์ ๋งค๊ฐ๋ณ์ ๋ชฉ๋ก์ ๊ฐ๊ฐ ์ ์ฉ๋์ด์ผ ํ ๋ ์ฌ์ฉํ ์ ์๋ค.
์ด๊ฒ ๋ฌด์จ ์๋ฆฌ๋๋ฉด... spread ๋ฌธ๋ฒ์ด ์ ์ฉ๋ ์ ์๋ ๊ณณ์ 3๊ฐ์ง๊ฐ ์๋ค.
ํจ์ ๋งค๊ฐ๋ณ์ ๋ชฉ๋ก (
myFunction(a, ...iterableObj, b)
)๋ฐฐ์ด ๋ฆฌํฐ๋ด (
[1, ...iterableObj, '4', 'five', 6]
)๊ฐ์ฒด ๋ฆฌํฐ๋ด (
{ ...obj, key: 'value' }
}
์ด ์ธ ๊ฐ๊ฐ ๊ฐ์๋ณด์ด์ง๋ง ์๋ฏธ๊ฐ ์กฐ๊ธ์ฉ ๋ค๋ฅด๋ค.
Iterable ๊ฐ์ฒด(e.g., ๋ฐฐ์ด)๋ง ๋ฐฐ์ด๊ณผ ํจ์ ๋งค๊ฐ๋ณ์์ ๋ํด spread๊ฐ ๊ฐ๋ฅํ๋ค. Symbol.iterator()
๋ฉ์๋๋ฅผ ๊ฐ๊ณ ์์ง ์์ ์์ ๊ฐ์ฒด(Plain Object)๋ฅผ ํฌํจํ ๋ง์ ๊ฐ์ฒด๋ค์ iterableํ์ง ์๋ค.
Spread ๋ฌธ๋ฒ์ ํจ์ ํธ์ถ์ ์ ์ฉํ ๋, JavaScript์ ์๊ท๋จผํธ ๊ธธ์ด(limit)๋ฅผ ๋์ง ์๋๋ก ์ฃผ์ํด์ผ ํ๋ค. MDN ๋ฌธ์๋ฅผ ์ฐธ๊ณ ํ์.
REF
Last updated
Was this helpful?