vue

Contents

vue#

if (condition) {
    // true
} else if {
    // else true
} else {
    // else true
}
switch (var) {
    case value1:
        //
        break;
    case value2:
        //
        break;
    default:
        //
}

for ๋ฌธ#

for (๋ฐ˜๋ณต๋ณ€์ˆ˜ ์ดˆ๊ธฐํ™”, ์กฐ๊ฑด, ์ฆ๊ฐ) {
    //๋ฐ˜๋ณต์—ฐ์‚ฐ
}
  • forEach()

  • for in (like python)

  • for of (ES6์— ์ถ”๊ฐ€๋œ ๊ตฌ๋ฌธ, collection iterable)

DOM#

DOM์€ ๋ฌธ์„œ ๊ฐ์ฒด ๋ชจ๋ธ(Document Object Model)๋ฅผ ๋งํ•œ๋‹ค. ์›น ํŽ˜์ด์ง€์˜ ๊ตฌ์กฐ์™€ ์ฝ˜ํ…์ธ ๋ฅผ ํ‘œํ˜„ํ•˜๋Š”๋ฐ ์‚ฌ์šฉ๋˜๋Š” ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์ธํ„ฐํŽ˜์ด์Šค์ด๋‹ค. ์›น ๋ธŒ๋ผ์šฐ์ €๋Š” ์›นํŽ˜์ด์ง€์˜ HTML, XML ๋ฌธ์„œ๋ฅผ ์ฝ๊ณ  ์ด๋ฅผ ๋ฉ”๋ชจ๋ฆฌ์— ๋กœ๋“œํ•œ ํ›„, ๊ฐ ์š”์†Œ์™€ ์ฝ˜ํ…์ธ ๋ฅผ ๊ฐ์ฒด๋กœ ๋‚˜ํƒ€๋‚ธ๋‹ค. ์ด๊ฒƒ์„ DOM์ด๋ผ๊ณ  ๋งํ•œ๋‹ค.

DOM์˜ ๋‚ด์šฉ

  1. ๋ฌธ์„œ ๊ตฌ์กฐ ํ‘œํ˜„ - ํŠธ๋ฆฌ ๊ณ„์ธต ๊ตฌ์กฐ

  2. ๊ฐ์ฒด ๋ชจ๋ธ - ํŠน์„ฑ,๋ฉ”์„œ๋“œ

  3. ๋™์  ์ƒํ˜ธ์ž‘์šฉ - ์ถ”๊ฐ€ ์ˆ˜์ • ์‚ญ์ œ ์Šคํƒ€์ผ๋ณ€๊ฒฝ

  4. ์ด๋ฒคํŠธ ์ฒ˜๋ฆฌ - ์ด๋ฒคํŠธ ๊ฐ์ง€ ๋ฐ ์ฒ˜๋ฆฌ(ํด๋ฆญ, ํ˜ธ๋ฒ„, ํ‚ค๋ณด๋“œ์ž…๋ ฅ)

  5. ํฌ๋กœ์Šค๋ธŒ๋ผ์ฃผ์–ด ํ˜ธํ™˜์„ฑ - JS๋ฅผ ํ†ตํ•ด ๋™์ผํ•œ ๋ฐฉ์‹์œผ๋กœ ์กฐ์ž‘ ๋ฐ ์ฒ˜๋ฆฌ ํ‘œ์ค€ ์ œ๊ณต

  6. ๋ฌธ์„œ ๊ตฌ์กฐ ๋ณ€๊ฒฝ - ๋ฌธ์„œ ๊ตฌ์กฐ๋ฅผ ๋™์ ์œผ๋กœ ๋ณ€๊ฒฝ ๊ฐ€๋Šฅ