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

TIL -์ผ๊ฐ„ํ•™์Šต๊ธฐ๋ก31

3W_JS_์Šค์ฝ”ํ”„์™€ ํด๋กœ์ € -๋ณ€์ˆ˜ ์ ‘๊ทผ ๊ทœ์น™์— ๋”ฐ๋ฅธ ์œ ํšจ๋ฒ”์œ„. ์Šค์ฝ”ํ”„์˜ ์˜๋ฏธ์™€ ์ ์šฉ ๋ฒ”์œ„๋ฅผ ์ดํ•ดํ•  ์ˆ˜ ์žˆ๋‹ค ์Šค์ฝ”ํ”„์˜ ์ฃผ์š” ๊ทœ์น™์„ ์ดํ•ดํ•  ์ˆ˜ ์žˆ๋‹ค ์ค‘์ฒฉ ๊ทœ์น™ block scope์™€ function scope ์ „์—ญ ์Šค์ฝ”ํ”„์™€ ์ง€์—ญ ์Šค์ฝ”ํ”„ ์ „์—ญ ๋ณ€์ˆ˜์™€ ์ง€์—ญ ๋ณ€์ˆ˜๊ฐ„์˜ ์šฐ์„  ์ˆœ์œ„ let, const, var ์˜ ์ฐจ์ด ์ „์—ญ ๊ฐ์ฒด(window)์˜ ์ดํ•ด let vscope = 'global'; //์—ฌ๊ธฐ๋ถ€ํ„ฐ function fscope() { let vscope = 'local'; let lv = local variables'; alert(lv); } //์—ฌ๊ธฐ๊นŒ์ง€ local scope fscope(); alert(lv); ์Šค์ฝ”ํ”„ ํŠน์ง• 1. ๋ฐ”๊นฅ ์Šค์ฝ”ํ”„(์ „์—ญ = Global Scope)์˜ ๋ณ€์ˆ˜๋Š” ์•ˆ์ชฝ์—์„œ ์‚ฌ์šฉ ๊ฐ€๋Šฅํ•˜๋‹ค. 2. ์•ˆ์ชฝ ์Šค์ฝ”ํ”„(์ง€์—ญ = L.. 2021. 11. 25.
2W _JS_CSS๊ธฐ์ดˆ CSS ๋‚ด๋จธ๋ฆฟ์† css๋Š” ์กฐ์˜ค๊ธˆ ๊ทธ๋ž˜๋„ ์ž๋ฐ”์Šคํฌ๋ฆฝ์— ๋น„ํ•ด์„œ๋Š” ์ข€ ๋ค๋ฒผ๋ณผ๋งŒํ•œ, ๊ทธ๋‹ˆ๊นŒ ์‹œ๊ฐ„์ด ๋ฌดํ•œ๋Œ€๋กœ ์žˆ์œผ๋ฉด ์–ด๋–ป๊ฒŒ๋“  ๊ตฌ๊ธ€๋งํ•ด์„œ ๋ญ๋ผ๋„ ํ• ์ˆ˜์žˆ์„๊ฐ™์€ ๊ทธ๋Ÿฐ๊ฒƒ. ์™œ๋ƒํ•˜๋ฉด ๊ฐœ๋ฐœ์ž ๋„๊ตฌ๊ฐ€ ์ƒ์„ธํžˆ ํ•˜๋‚˜์”ฉ ์งš์–ด๊ฐ€๋ฉฐ ์•Œ๋ ค์ฃผ๊ณ , ์ ์šฉ ์‚ฌํ•ญ์ด ๋ฐ”๋กœ๋ฐ”๋กœ ๋ˆˆ์— ๋ณด์ด๋‹ˆ๊นŒ JS์ฒ˜๋Ÿผ ๋ฌ๋‚˜..? ์‹ถ์–ด console.log ์ฐ์–ด๋ณด๋ฉด ๊ฒฐ๊ณผ๋Œ€์‹  ์˜ค๋ฅ˜๋‚˜์˜ค๋Š” ๊ทธ๋Ÿฐ๋Š๋‚Œ ์•„๋‹ˆ๋‹ˆ๊นŒ.... ์‚ฌ์‹ค์€ ์‘์šฉ์„ ์–ด๋ ค์›Œํ•˜๋Š” ๋‚˜ํ•œํ…Œ๋Š” ๊ทธ๋ž˜๋„ ์กฐ๊ธˆ ์ธ๊ฐ„๋ฏธ ์žˆ๋Š” ์ปดํ“จํ„ฐ์˜ ์–ธ์–ด๋กœ ๋Š๊ปด์ง„๋‹ค. ์˜ค๋Š˜ ์ˆ˜์—…์ค‘์— CSS๊ฐ€ ์‹ซ์–ด ๋ฐฑ์—”๋“œ ๊ฐ€์‹œ๋Š” ๋ถ„๋“ค์ด ์žˆ๋‹ค์…”์„œ, ์˜ค! ๋‚ด๊ฐ€ ์ž์Šค ๋ฌด์„œ์›Œ ํ”„๋ก ํŠธ์—”๋“œ ๊ฐ€๊ณ ์žํ•˜๋Š” ๊ทธ๋Ÿฐ๊ฑด๊ฐ€ ๊ณต๊ฐํ–ˆ๋‹ค. ํ•˜์ง€๋งŒ, ๋„๋ง์นœ๊ณณ์—” ๋‚™์›์€ ์—†๋‹ค......๊ณ  ํ•˜๋‹ˆ ์—ด์‹ฌํžˆ JS๋ž‘ ์นœํ•ด์ ธ์•ผ์ง€ ์–ด๋ ค์›Œ์„œ ์˜คํžˆ๋ ค ์ข‹์•„~~ CSS ํ•™์Šต๋ชฉํ‘œ CSS์˜ ์‚ฌ์š”๋ชฉ์ ์„ ์ดํ•ดํ•œ๋‹ค ํ”„๋ก ํŠธ์—”.. 2021. 11. 19.
1W _JS_์กฐ๊ฑด๋ฌธ ํ•™์Šต๋ชฉํ‘œ truthy์™€ falsy ๊ฐ€ ์กฐ๊ฑด๋ฌธ์—์„œ ์ž‘๋™ํ•˜๋Š” ๋ฐฉ์‹ 0 '' undefined null NaN console.log(boolean(์œ„์˜๊ฐ’)); ์€ false๋กœ ํ™•์ธ๋จ. falsy๊ฐ’์„ ์ œ์™ธํ•œ ๊ฐ’ ๋นˆ ๊ฐ์ฒด({})๋‚˜,๋นˆ ๋ฐฐ์—ด([]) ๋˜ํ•œ true๋กœ ํ™•์ธ๋จ. ๋น„๊ต์—ฐ์‚ฐ์ž๋ฅผ ํ†ตํ•œ ์—„๊ฒฉํ•œ ๋น„๊ต(=== , !==)์— ๋Œ€ํ•ด ์ดํ•ด ==๋Š” Equal Operator ===๋Š” Strict(์—„๊ฒฉํ•œ) Equal Operator 0 ==='0' false // ๊ฐ™์€ 0 ์ด์ง€๋งŒ ํƒ€์ž…(number์™€ string)์„ ๊ตฌ๋ถ„ํ•˜๋ฏ€๋กœ ๊ฑฐ์ง“ ์ถœ๋ ฅ 0 == '0' true // ๊ฐ™์€ 0์ธ๊ฒƒ๋งŒ ํ™•์ธํ•˜๊ณ  ์ฐธ ์ถœ๋ ฅ 0 !== 0 false // ๊ฐ™์€ ํƒ€์ž…๊ณผ ๊ฐ™์€ ๋‚ด์šฉ์œผ๋กœ ์ฐธ์ผ๋•Œ !== ์—ฐ์‚ฐ์ž๋Š” ๊ฑฐ์ง“์„ ์ถœ๋ ฅํ•œ๋‹ค 0 !=='0' true // .. 2021. 11. 15.
1W _JS_ ๋ณ€์ˆ˜, ํƒ€์ž… 1. ๋ณ€์ˆ˜ (variables) https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Variables ํ•™์Šต ๋ชฉํ‘œ โ–กโ–ณโ—Ž โ–ถํ”„๋กœ๊ทธ๋ž˜๋ฐ์€ ๋ฐ์ดํ„ฐ ์ฒ˜๋ฆฌ๋ฅผ ํ•˜๋Š” ๊ฒƒ์ž„์„ ์•ˆ๋‹ค.โ—Ž โ–ถ๋ณ€์ˆ˜ ์‚ฌ์šฉ์€ ๋ฐ์ดํ„ฐ๋ฅผ ํŽธ๋ฆฌํ•˜๊ฒŒ ์ €์žฅํ•˜๊ณ  ๊บผ๋‚ด ์“ฐ๋Š” ๊ฒƒ์ž„์„ ์ดํ•ดโ—Ž - ๋ณ€์ˆ˜๋Š” ํฐ์„œ๋ž์žฅ์— ํ•œ ์„œ๋ž์˜ ์ด๋ฆ„์„ ์ ์–ด๋‘๊ณ (๋ณ€์ˆ˜์„ ์–ธ) ์ด๋ฆ„์— ํ•ด๋‹นํ•˜๋Š” ๊ฒƒ๋“ค์„ ๋„ฃ์–ด๋‘๋Š”๊ฒƒ(๋ณ€์ˆ˜ํ• ๋‹น)๊ณผ ๋น„์Šทํ•˜๋‹ค. โ–ถ๋ณ€์ˆ˜์˜ ์„ ์–ธ๊ณผ ๊ฐ’์˜ ํ• ๋‹น์— ๋Œ€ํ•ด์„œ ์„ค๋ช…ํ•˜๊ณ  ์ฝ”๋“œ๋กœ ์ž‘์„ฑโ—Ž - let https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/let / const https://developer.mozilla.org/ko/do.. 2021. 11. 10.