TIL 15: Spread, Rest ๋ฌธ๋ฒ•, DOM
TIL/JavaScript 2021. 8. 6. 22:48

๋งˆํฌ๋‹ค์šด์€ ์•„๋ฌด๋ฆฌ ์ฐพ์•„๋ด๋„ ํ˜•๊ด‘ํŽœ ๊ธฐ๋Šฅ์ด ์—†๋Š” ๊ฒƒ ๊ฐ™์•„์š”... ์ฐพ์€ ๊ฒƒ ๊ฐ™์•„์„œ ์‹ ๋‚ฌ๋‹ค๊ฐ€ ๋˜ ๋ฌด์Šจ ๊ธฐ๋Šฅ ๋”ฐ๋กœ ์ ์šฉํ•ด์•ผ ํ•œ๋‹ค ๋˜์–ด์žˆ๊ณ .. ๊ทธ๋ž˜์„œ ํฌ๊ธฐํ•˜๊ณ  ๊ธฐ๋ณธ๋ชจ๋“œ๋กœ ์ž‘์„ฑํ•ด๋ณด๋ ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค. ํ˜•๊ด‘ํŽœ์€ ํฌ๊ธฐํ•  ์ˆ˜ ์—…์’€! Spread / Rest Spread ๋ฌธ๋ฒ•: ์ฃผ๋กœ ๋ฐฐ์—ด์„ ํ’€์–ด์„œ ์ธ์ž๋กœ ์ „๋‹ฌํ•˜๊ฑฐ๋‚˜, ๋ฐฐ์—ด์„ ํ’€์–ด์„œ ๊ฐ๊ฐ์˜ ์š”์†Œ๋กœ ๋„ฃ์„ ๋•Œ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค. Rest ๋ฌธ๋ฒ•: ํŒจ๋Ÿฌ๋ฏธํ„ฐ๋ฅผ ๋ฐฐ์—ด์˜ ํ˜•ํƒœ๋กœ ๋ฐ›์•„ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค. DOM DOM์€ Document Object Model์˜ ์•ฝ์ž๋กœ, HTML ์š”์†Œ๋ฅผ Object์ฒ˜๋Ÿผ ์กฐ์ž‘ํ•  ์ˆ˜ ์žˆ๋Š” ๋ชจ๋ธ์ž…๋‹ˆ๋‹ค. ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋ผ๋Š” ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์–ธ์–ด์™€ DOM์„ ํ™œ์šฉํ•˜์—ฌ HTML์— ์ ‘๊ทผํ•˜๊ณ  ์กฐ์ž‘ํ•ฉ๋‹ˆ๋‹ค. ์›น ๋ธŒ๋ผ์šฐ์ €๊ฐ€ ์ž‘์„ฑ๋œ ์ฝ”๋“œ๋ฅผ ํ•ด์„ํ•˜๋Š” ๊ณผ์ •์—์„œ ์š”์†Œ๋ฅผ ๋งŒ๋‚˜๋ฉด, HTMLํ•ด์„์„ ์ž ์‹œ ๋ฉˆ์ถ”๊ณ  ์š”์†Œ๋ฅผ ๋จผ..

TIL 14: JS ํ•ต์‹ฌ ๊ฐœ๋…๊ณผ ์ฃผ์š” ๋ฌธ๋ฒ•
TIL/JavaScript 2021. 8. 5. 21:46

์›์‹œ ์ž๋ฃŒํ˜•๊ณผ ์ฐธ์กฐ ์ž๋ฃŒํ˜• ์›์‹œ ์ž๋ฃŒํ˜•์˜ ๋ณ€์ˆ˜์—๋Š” ํ•˜๋‚˜์˜ ์›์‹œ ์ž๋ฃŒํ˜•๋งŒ ๋‹ด์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋”ฐ๋ผ์„œ ์›์‹œ ์ž๋ฃŒํ˜•์ด ๋‹ด๊ธฐ๋Š” ๋ณด๊ด€ํ•จ์˜ ํฌ๊ธฐ๋Š” ๊ณ ์ •๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ๋ฐ์ดํ„ฐ ๋ณด๊ด€ํ•จ์„ stack์ด๋ผ๊ณ  ๋ถ€๋ฆ…๋‹ˆ๋‹ค. ์›์‹œ ์ž๋ฃŒํ˜•์—๋Š” string, number, bigint, boolean, undefined, symbol, null ์ด ์žˆ์Šต๋‹ˆ๋‹ค. ๋ฐ˜๋ฉด ์ฐธ์กฐ ์ž๋ฃŒํ˜•์€ ๋ณ€์ˆ˜์— ํ• ๋‹น ํ•  ๋•Œ๋Š” ๋ณ€์ˆ˜์— ๊ฐ’์ด ์•„๋‹Œ ์ฃผ์†Œ๋ฅผ ์ €์žฅํ•ฉ๋‹ˆ๋‹ค. ์ด ์ฃผ์†Œ๋ฅผ ๋”ฐ๋ผ๊ฐ€๋ฉด ์›์‹œ ์ž๋ฃŒํ˜•๊ณผ ๋‹ฌ๋ฆฌ ํฌ๊ธฐ๊ฐ€ ๋ณ€๋™ ๊ฐ€๋Šฅํ•œ ๋ฐ์ดํ„ฐ ๋ณด๊ด€ํ•จ์ด ์žˆ์Šต๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ๋ฐ์ดํ„ฐ ๋ณด๊ด€ํ•จ์„ heap์ด๋ผ๊ณ  ๋ถ€๋ฆ…๋‹ˆ๋‹ค. ๊ฐ„๋‹จํ•˜๊ฒŒ ์ •๋ฆฌํ•˜๋ฉด '์›์‹œ ์ž๋ฃŒํ˜•์€ ๊ฐ’์„ ์ €์žฅํ•˜๊ณ , ์ฐธ์กฐ ์ž๋ฃŒํ˜•์€ ์ฃผ์†Œ๋ฅผ ์ €์žฅํ•œ๋‹ค'๋กœ ์ •๋ฆฌํ•  ์ˆ˜ ์žˆ๋Š”๋ฐ์š”. ์ด๋Ÿฌํ•œ ํŠน์„ฑ ๋•Œ๋ฌธ์— ๋ณ€์ˆ˜ a๊ฐ€ ๋ณ€์ˆ˜ b์— ํ• ๋‹นํ•˜๋Š” ๊ฒฝ์šฐ๊ฐ€..

TIL 12: ๊ฐ์ฒด
TIL/JavaScript 2021. 8. 3. 00:42

๊ฐ์ฒด๋Š” ๋ฐฐ์—ด๊ณผ ๋‹ฌ๋ฆฌ๋Š” ์ˆœ์„œ๋ฅผ ๊ฐ–์ง€ ์•Š์ง€๋งŒ ์˜๋ฏธ๋ฅผ ๊ฐ–์Šต๋‹ˆ๋‹ค. ์•„๋ž˜ ๋‘ ๋ฐฉ๋ฒ•์„ ํ†ตํ•ด ๊ฐ์ฒด์˜ ํ‚ค์™€ ๊ฐ’์„ ์‚ฌ์šฉํ•˜๊ณ , ์ถ”๊ฐ€ํ•˜๊ณ , ์‚ญ์ œํ•˜๋Š” ๊ฒƒ ๋ชจ๋‘ ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค. ๋ฐฉ๋ฒ•1: Dot Notation let laptop = {}; laptop.color = 'spacegrey'; laptop.brand = 'Apple'; laptop.hardDiskSize = '256GB'; laptop.memory = '8GB'; laptop.monitor = '13inch'; ์œ„์™€ ๊ฐ™์ด dot์„ ์‚ฌ์šฉํ•ด์„œ ๊ฐ์ฒด์˜ key์™€ value๋ฅผ ์ถ”๊ฐ€ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋ฐฉ๋ฒ•2: Bracket Notation let insta = {}; insta['name'] = 'yun'; insta['nickname'] = 'cherish_yun'; insta[..

TIL 11: ๋ฐฐ์—ด
TIL/JavaScript 2021. 8. 2. 23:39

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

TIL6: ๋ณต์Šต
TIL/JavaScript 2021. 7. 24. 23:14

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

TIL 4 : ๋ฐ˜๋ณต๋ฌธ (JavaScript)
TIL/JavaScript 2021. 7. 22. 23:01

๋ฐ˜๋ณต๋ฌธ ๋ง ๊ทธ๋Œ€๋กœ ๋ฐ˜๋ณต์‹œํ‚ค๋Š” ๊ตฌ๋ฌธ. ๊ฐ™๊ฑฐ๋‚˜ ๋น„์Šทํ•œ ์ฝ”๋“œ๋ฅผ ์—ฌ๋Ÿฌ๋ฒˆ ์‹คํ–‰์‹œ์ผœ์•ผ ํ•  ๊ฒฝ์šฐ์— ํšจ์œจ์„ฑ์„ ๋†’์ด๊ธฐ ์œ„ํ•ด ๊ฐ™์€ ์ฝ”๋“œ๋ฅผ ๊ทธ๋Œ€๋กœ ์“ฐ์ง€ ์•Š๊ณ  ๋ฐ˜๋ณต๋ฌธ์„ ํ™œ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋ฐ˜๋ณต๋ฌธ์—๋Š” 2๊ฐ€์ง€ ์ข…๋ฅ˜๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค. for ๊ตฌ๋ฌธ ๋ฐ˜๋ณตํ•  ์กฐ๊ฑด์„ ์ดˆ๊ธฐํ™” (n=0) , ์กฐ๊ฑด์‹ (n