LIKELION๐Ÿฆ TIL(2022-06-17)

Ryuยท2022๋…„ 6์›” 17์ผ
0

๋ฉ‹์Ÿ์ด ์‚ฌ์ž์ฒ˜๋Ÿผ

๋ชฉ๋ก ๋ณด๊ธฐ
3/12
post-thumbnail

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๊ธฐ๋ณธ

  1. ๋žœ๋ค ๋ฒˆํ˜ธ ์ƒ์„ฑ
    parseInt(Math.random()*50+1); -> 1~50๊นŒ์ง€์˜ ์ˆซ์ž ๋žœ๋ค์œผ๋กœ ์ƒ์„ฑํ•ฉ๋‹ˆ๋‹ค.
  2. for ๋ฌธ๊ณผ while ๋ฌธ
  3. ๋ฐฐ์—ด
    (1) ๋ฐฐ์—ด์˜ ๊ธธ์ด ๊ตฌํ•˜๊ธฐ : var array = []; array.length;๋กœ ๊ตฌํ•  ์ˆ˜ ์žˆ๋‹ค.
  4. ์ •๋ ฌ
    (1) array.sort(); -> ์‚ฌ์ „ ์ˆœ ์ •๋ ฌ์„ ์˜๋ฏธํ•œ๋‹ค.
    (2) array.sort((a,b)=>a-b); -> ์˜ค๋ฆ„์ฐจ์ˆœ ์ •๋ ฌ์„ ์˜๋ฏธํ•œ๋‹ค. b-a ๋กœ ๋ฐ”๊พธ๋ฉด, ๋‚ด๋ฆผ์ฐจ์ˆœ ์ •๋ ฌ.
    (3) array.push(); -> ๋ฐ์ดํ„ฐ ์ถ”๊ฐ€ ๊ฐ€๋Šฅ.

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๊ฐ์ฒด

var array = {
  1 : {"text" : "hello", "name" : "velog", "sex" : "male", "hobby" : "soccer"}
  // ๊ฐ์ฒด๋Š” ์ด๋Ÿฐ ์‹์œผ๋กœ key - value ๊ฐ’์œผ๋กœ ๊ตฌ์„ฑ๋œ๋‹ค ! 
}

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์‚ผํ•ญ์—ฐ์‚ฐ์ž

(num > 10) ? num += 3 : num -= 3; 
// ๊ธฐ์กด ๋ฐ˜๋ณต๋ฌธ์„ ํ†ตํ•ด ๊ธธ์–ด์ง€๋Š” ์ฝ”๋“œ๋ฅผ ์‚ผํ•ญ์—ฐ์‚ฐ์ž๋กœ ํ•œ ์ค„์— ์ ์„ ์ˆ˜ ์žˆ๋‹ค!

DOM

  • Document Object Model ์„ ์˜๋ฏธํ•œ๋‹ค.
  • ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋Š” ๋ชจ๋“  ๊ฒƒ์ด ๊ฐ์ฒด๋‹ค..
  1. document.getElementById("[id๊ฐ’]"); -> id ๊ฐ’ ํƒœ๊ทธ๋ฅผ ๊ฐ€์ ธ์˜จ๋‹ค.
    ๋‹จ, '๊ฐ’'์„ ๊ฐ€์ ธ์˜ค๋ ค๋ฉด ๋’ค์— .value ๋ฅผ ๋ถ™์—ฌ์•ผ ํ•จ.
    .innerHTML์€ ๊ฐ€์ ธ์˜จ HTML ํƒœ๊ทธ์˜ ๊ฐ’์„ ์ˆ˜์ •ํ•˜๊ณ  ์‹ถ์„ ๋•Œ ์‚ฌ์šฉํ•œ๋‹ค. .value ์™€ ๋‹ค๋ฅด๊ฒŒ 'ํƒœ๊ทธ' ๋„ ์ธ์‹ํ•œ๋‹ค.

ํ•จ์ˆ˜์™€ ์ด๋ฒคํŠธ ํ•ธ๋“ค๋Ÿฌ

ํ•จ์ˆ˜

  • ํ•จ์ˆ˜๋Š” ๋ฐ˜๋ณต๋˜๋Š” ์ž‘์—…์„ ํ•˜๋‚˜๋กœ ๋ฌถ์–ด์คŒ์œผ๋กœ์จ, ์ฝ”๋“œ๋ฅผ ํšจ์œจ์ ์œผ๋กœ ๋งŒ๋“œ๋Š” ๋งค์šฐ ์ค‘์š”ํ•œ ๊ธฐ๋Šฅ์ด๋‹ค.
  • function count() {
      ๋ช…๋ น๋ฌธ1;
      ๋ช…๋ น๋ฌธ2;
    } 

์ด๋ฒคํŠธ ํ•ธ๋“ค๋Ÿฌ

  • ์ด๋ฒคํŠธ๊ฐ€ ๋ฐœ์ƒํ•˜๋ฉด(ํ‚ค๋ณด๋“œ ๋ˆ„๋ฅด๊ธฐ, ๋งˆ์šฐ์Šค ํด๋ฆญ ๋“ฑ) ์ด์— ๋Œ€ํ•œ ๊ฒฐ๊ณผ๋ฅผ ์ฒ˜๋ฆฌํ•˜๋Š” 'ํ•จ์ˆ˜'๋ฅผ ์ด๋ฒคํŠธ ํ•ธ๋“ค๋Ÿฌ๋ผ๊ณ  ๋ถ€๋ฅธ๋‹ค.
    ์ฆ‰, ์ด๋ฒคํŠธ๊ฐ€ ๋ฐœ์ƒํ•˜๋ฉด ~ํ•ด๋ผ ๋ผ๋Š” ๋œป.
  • ์‹ค์ œ๋กœ, <button onclick = 'ํ•จ์ˆ˜๋ช…();' ~></button> ์ด๋Ÿฐ ์‹์œผ๋กœ ์“ฐ์ธ๋‹ค.

JQuery

JQuery์˜ ์žฅ์ ?

  1. ๊ธฐ์กด js ์ฝ”๋“œ๋ณด๋‹ค ๊ฐ„๊ฒฐํ•ด์ง„ ๋ฌธ๋ฒ•
  2. ํŽธ๋ฆฌํ•œ API ์ œ๊ณต
  3. ํฌ๋กœ์Šค ๋ธŒ๋ผ์šฐ์ง• (๋ชจ๋“  ๋ธŒ๋ผ์šฐ์ €์—์„œ ๋™์ผํ•œ ๊ธฐ๋Šฅ์œผ๋กœ ๋™์ž‘ํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•จ)

์‚ฌ์šฉ๋ฒ•

  • $('#click').click(hello); -> ๋‹ค์Œ์€ click ์ด๋ฒคํŠธ ํ•ธ๋“ค๋Ÿฌ๋ฅผ ๋“ฑ๋กํ•˜๋Š” ์ฝ”๋“œ๋‹ค. hello๋Š” ํ•จ์ˆ˜์ž„.

  • $('#click').click(function() { console.log('hello'); }); -> ๋‹ค์Œ๊ณผ ๊ฐ™์ด ์ต๋ช…ํ•จ์ˆ˜๋กœ๋„ ๊ฐ€๋Šฅ.

profile
Strengthen the core.

0๊ฐœ์˜ ๋Œ“๊ธ€