๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ

๐Ÿ“ฐ ์–ธ์–ด/JS

(15)
๋ฐฐ์—ด๊ณผ ๋ฐฐ์—ด์ฒ˜๋ฆฌ ์ฑ… ๋ฅผ ๊ธฐ๋ณธ์œผ๋กœ ๋ฐฐ์šด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋‚ด์šฉ์ž…๋‹ˆ๋‹ค. ๋ชฉ์ฐจ 1. ๋ฐฐ์—ด์˜ ์š”์†Œ ์กฐ์ž‘ 2. ๋ฐฐ์—ด ๊ฒ€์ƒ‰ 3. ๋ฐฐ์—ด์˜ ์š”์†Œ ๋ณ€ํ˜• 4. ๋ฐฐ์—ด ์ž์ฒด๋ฅผ ๋ณ€ํ˜• 5. ๋ฌธ์ž์—ด ๋ณ‘ํ•ฉ ๋ฐฐ์—ด์˜ ์š”์†Œ ์กฐ์ž‘ ๋ฐฐ์—ด์— ์š”์†Œ ํ•˜๋‚˜ ์ถ”๊ฐ€/์ œ๊ฑฐ push/pop(๋) unshift/shif(์ฒ˜์Œ) ๋ฐฐ์—ด์˜ ๋์— ์—ฌ๋Ÿฌ ์š”์†Œ ์ถ”๊ฐ€ concat ๋ฐฐ์—ด์ผ๋ถ€ ๊ฐ€์ ธ์˜ค๊ธฐ slice ์ž„์˜์˜ ์œ„์น˜์— ์š”์†Œ ์ถ”๊ฐ€/์ œ๊ฑฐ splice ๋ฐฐ์—ด ์•ˆ์—์„œ ์š”์†Œ ๊ต์ฒดํ•˜๊ธฐ copyWithin ํŠน์ • ๊ฐ’์œผ๋กœ ๋ฐฐ์—ด ์ฑ„์šฐ๊ธฐ fill ๋ฐฐ์—ด ์ •๋ ฌ sort/reverse ๋ฐฐ์—ด ๊ฒ€์ƒ‰ ์กฐ๊ฑด์— ๋งž๋Š” ์š”์†Œ์˜ ์ธ๋ฑ์Šค ๊ฒ€์ƒ‰ indexOf/lastIndexOf ๋˜๋Š” findIndex ์กฐ๊ฑด์— ๋งž๋Š” ์š”์†Œ ๊ฒ€์ƒ‰ find some๊ณผ every ๋ฐฐ์—ด์˜ ์š”์†Œ ๋ณ€ํ˜• ์š”์†Œ ๋ณ€ํ˜•, ์‚ฌ๋ณธ ๋ฐ˜ํ™˜ map ์š”์†Œ ๋ณ€ํ˜•, ๋ฐฐ์—ด์—์„œ ํ•„์š”ํ•œ..
์Šค์ฝ”ํ”„(2) ์ฑ… ๋ฅผ ๊ธฐ๋ณธ์œผ๋กœ ๋ฐฐ์šด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋‚ด์šฉ์ž…๋‹ˆ๋‹ค. ๋ชฉ์ฐจ 1. ์ฆ‰์‹œ ์‹คํ–‰ ํ•จ์ˆ˜, IIFE 2. ํ˜ธ์ด์ŠคํŒ… 3. ์‚ฌ๊ฐ์ง€๋Œ€์™€ ์ŠคํŠธ๋ฆญํŠธ ๋ชจ๋“œ 1. IIFE : ์ฆ‰์‹œ ํ˜ธ์ถœํ•˜๋Š” ํ•จ์ˆ˜ ํ‘œํ˜„์‹ 1-1) ์ฆ‰์‹œ ์‹คํ–‰ ํ•จ์ˆ˜์˜ ๊ธฐ๋ณธ ํ˜•์‹ #์ผ๋ฐ˜์ ์ธ ํ•จ์ˆ˜ ํ‘œํ˜„์‹ const g = function ํ•จ์ˆ˜์ด๋ฆ„(){ //... } #์ฆ‰์‹œ ์‹คํ–‰ ํ•จ์ˆ˜ ํ‘œํ˜„์‹ (function () { //IIFE ๋ฐ”๋”” })() 1-2) ์ฆ‰์‹œ ์‹คํ–‰ ํ•จ์ˆ˜์˜ ์ข…๋ฅ˜ #1. ๊ธฐ๋ช… ์ฆ‰์‹œ ์‹คํ–‰ ํ•จ์ˆ˜ (function square(x) { console.log(x*x); })(2); #2. ์ต๋ช… ์ฆ‰์‹œ ์‹คํ–‰ ํ•จ์ˆ˜ (function (x) { console.log(x*x); })(2); #3. ๋ณ€์ˆ˜์— ์ฆ‰์‹œ ์‹คํ–‰ ํ•จ์ˆ˜ ์ €์žฅ (mySquare =function (x) { cons..
์Šค์ฝ”ํ”„(1) ์ฑ… ๋ฅผ ๊ธฐ๋ณธ์œผ๋กœ ๋ฐฐ์šด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋‚ด์šฉ์ž…๋‹ˆ๋‹ค. ๋ชฉ์ฐจ 1. ์Šค์ฝ”ํ”„ 2. ์Šค์ฝ”ํ”„ ์ฒด์ธ 3. ๋ณ€์ˆ˜ ์ˆจ๊ธฐ๋Š” ๋ฐฉ๋ฒ• 3๊ฐ€์ง€ 4. ํด๋กœ์ ธ 1. ์Šค์ฝ”ํ”„ : ๋ณ€์ˆ˜์˜ ์œ ํšจ ๋ฒ”์œ„(์–ด๋””๊นŒ์ง€ ์ฐธ์กฐ ๊ฐ€๋Šฅํ•œ๊ฐ€) 1-1) ์Šค์ฝ”ํ”„์˜ ์ข…๋ฅ˜ ์ „์—ญ ์Šค์ฝ”ํ”„ : ์ฝ”๋“œ ์–ด๋””์—์„œ๋“  ์ฐธ์กฐ ๊ฐ€๋Šฅ(๋‚จ์šฉx, ์˜์กดx) ์ง€์—ญ ์Šค์ฝ”ํ”„ : ํ•จ์ˆ˜ ์ฝ”๋“œ ๋ธ”๋ก์ด ๋งŒ๋“  ์Šค์ฝ”ํ”„๋กœ ํ•จ์ˆ˜ ์ž์‹ ๊ณผ ํ•˜์œ„ ํ•จ์ˆ˜์—์„œ๋งŒ ์ฐธ์กฐ ๊ฐ€๋Šฅ ํ•จ์ˆ˜ ์Šค์ฝ”ํ”„ : ํ•จ์ˆ˜ ๋‚ด๋ถ€์—์„œ ์„ ์–ธํ•œ ๋ณ€์ˆ˜๋Š” ์ง€์—ญ ๋ณ€์ˆ˜์ด๋ฉฐ ํ•จ์ˆ˜ ์™ธ๋ถ€์—์„œ ์„ ์–ธํ•œ ๋ณ€์ˆ˜๋Š” ๋ชจ๋‘ ์ „์—ญ ๋ณ€์ˆ˜ ๋ธ”๋ก ์Šค์ฝ”ํ”„ : ์ฝ”๋“œ ๋ธ”๋ก ๋‚ด๋ถ€์—์„œ ์„ ์–ธํ•œ ๋ณ€์ˆ˜๋Š” ์ง€์—ญ ๋ณ€์ˆ˜. len๊ณผ const๋กœ ์„ ์–ธ๋œ ๋ณ€์ˆ˜๋Š” ๊ทธ ๋ณ€์ˆ˜๋ฅผ ๋‘˜๋Ÿฌ์‹ผ ์•„๋ฌด ๋ธ”๋ก์˜ ์Šค์ฝ”ํ”„์— ์†ํ•จ. 1-2) ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์Šค์ฝ”ํ”„์˜ ํŠน์ง• ํ•จ์ˆ˜ ๋‹จ์œ„์˜ ์œ ํšจ๋ฒ”์œ„ : if๋ฌธ, for๋ฌธ ๋“ฑ ๊ตฌ๋ฌธ๋“ค์ด ์‚ฌ์šฉ๋˜์—ˆ์„ ๋•Œ, ..
๋ฐ์ดํ„ฐ ํƒ€์ž… & ํ•จ์ˆ˜ ์ฑ… ๋ฅผ ๊ธฐ๋ณธ์œผ๋กœ ๋ฐฐ์šด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋‚ด์šฉ์ž…๋‹ˆ๋‹ค. ๋ชฉ์ฐจ 1. ๋ณ€์ˆ˜์™€ ์ƒ์ˆ˜, ๋ฆฌํ„ฐ๋Ÿด 2. ์‹๋ณ„์ž 3. ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์˜ ๊ฐ’ - ์›์‹œ ํƒ€์ž…๊ณผ ๊ฐ์ฒด 1. ํ•จ์ˆ˜ ์„ ์–ธ 2. ํ•จ์ˆ˜ ํ‘œํ˜„์‹, ํ™”์‚ดํ‘œ ํ‘œ๊ธฐ๋ฒ• 3. ํ•จ์ˆ˜ ํ˜ธ์ถœ, (call, apply, bind) 1. ๋ณ€์ˆ˜์™€ ์ƒ์ˆ˜, ๋ฆฌํ„ฐ๋Ÿด 1-1) ๋ณ€์ˆ˜(let)์™€ ์ƒ์ˆ˜(const) : ์ดˆ๊นƒ๊ฐ’ ์ƒ๋žต๊ฐ€๋Šฅ, ์ƒ๋žตํ•˜๋ฉด undefined์œผ๋กœ ๋Œ€์ฒด๋จ let/const ๋ณ€์ˆ˜/์ƒ์ˆ˜์ด๋ฆ„; let/const ๋ณ€์ˆ˜/์ƒ์ˆ˜์ด๋ฆ„ = ์ดˆ๊นƒ๊ฐ’; let/const ๋ณ€์ˆ˜/์ƒ์ˆ˜์ด๋ฆ„1 = ์ดˆ๊นƒ๊ฐ’1, ๋ณ€์ˆ˜/์ƒ์ˆ˜์ด๋ฆ„2 = ์ดˆ๊นƒ๊ฐ’2; โ€ป ๋ณ€์ˆ˜ vs ์ƒ์ˆ˜ ์šฐ์„  ์ƒ์ˆ˜๋กœ ๋งŒ๋“ค๊ณ  ๋ณ€ํ•˜๋Š”๊ฒŒ ์ž์—ฐ์Šค๋Ÿฝ๋‹ค๊ณ  ์ƒ๊ฐ๋˜๋ฉด ๋ณ€์ˆ˜๋กœ ๋ณ€๊ฒฝ ์˜ˆ์™ธ) ์ƒ์ˆ˜x, ํ•ญ์ƒ ๋ณ€์ˆ˜์ธ ๊ฒฝ์šฐ : ๋ฃจํ”„, ์‹œ๊ฐ„์ด ์ง€๋‚˜๋ฉด์„œ ๊ฐ’์ด ๋ฐ”๋€Œ๋Š” ๊ฒฝ์šฐ 1-2) ๋ฆฌํ„ฐ๋Ÿด : ๊ฐ’์„ ..
์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๊ฐœ๋ฐœ๋„๊ตฌ - git, npm, gulp ์ฑ… ๋ฅผ ๊ธฐ๋ณธ์œผ๋กœ ๋ฐฐ์šด ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋‚ด์šฉ์ž…๋‹ˆ๋‹ค. ๋ชฉ์ฐจ git ์‹œ์ž‘ํ•˜๊ธฐ git ์ƒˆ ๋กœ์ปฌ ์ €์žฅ์†Œ, ์ƒˆ ํŒŒ์ผ, (.gitignore, README.md) ํŒŒ์ผ ๋งŒ๋“ค๊ธฐ npm ์‹œ์ž‘ํ•˜๊ธฐ npm ํŒจํ‚ค์ง€ ๊ด€๋ผ gulp ์‹œ์ž‘ํ•˜๊ธฐ git ์‹œ์ž‘ํ•˜๊ธฐ git : ํ˜•์ƒ๊ด€๋ฆฌ, ๋ฒ„์ „ ๊ด€๋ฆฌ ์‹œ์Šคํ…œ์œผ๋กœ ์—ฌ๋Ÿฌ๋ช…์ด ๊ฐœ๋ฐœํ•  ๋•Œ ์ฝ”๋“œ๊ด€๋ฆฌ๋ฅผ ํšจ์œจ์ ์œผ๋กœ ํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ•ด๋Š” ์‹œ์Šคํ…œ์ด๋‹ค. git ๋™์ž‘ ๊ณผ์ • git ์ƒˆ ๋กœ์ปฌ ์ €์žฅ์†Œ ๋งŒ๋“ค๊ธฐ git-bash์‹คํ–‰ ์ ๋‹นํ•œ ๊ฒฝ๋กœ์— ๊ด€๋ฆฌํ•  ํ”„๋กœ์ ํŠธ ๋””๋ ‰ํ† ๋ฆฌ ์ƒ์„ฑ(test) -> ํ”„๋กœ์ ํŠธ ๋ฃจํŠธ ํ”„๋กœ์ ํŠธ ๋””๋ ‰ํ† ๋ฆฌ์— $git init ์ž…๋ ฅ ".git" ํŒŒ์ผ์ด ์ƒ์„ฑ๋˜๋ฉด ์™„๋ฃŒ ์ €์žฅ์†Œ์— ์ƒˆ ํŒŒ์ผ ๋งŒ๋“ค๊ธฐ $ vim ํŒŒ์ผ ์ด๋ฆ„ # ํŒŒ์ผ ๋‚ด์šฉ ์ž‘์„ฑ $ git add ํŒŒ์ผ ์ด๋ฆ„ $ git status $ git commit -m "..