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

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

(5)
[JS] Object ๋ณ€์ˆ˜ ๋ฐ์ดํ„ฐ ์ถ”๊ฐ€, ๋ฌธ์ž์—ด(String)์„ ์ด์šฉํ•œ ๋™์  ์ ‘๊ทผ ๋ฐฉ๋ฒ• ๐Ÿฅธ JavaScript Object ๊ฐ์ฒด ๋ฌธ์ž์—ด์„ ์ด์šฉํ•ด ๋™์ ์œผ๋กœ ๋ฐ์ดํ„ฐ ์ถ”๊ฐ€, ์‚ญ์ œํ•˜๊ธฐ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์˜ Object ๊ฐ์ฒด๋Š” key, value ํ˜•ํƒœ๋„ ๋ฐ์ดํ„ฐ๋ฅผ ์ €์žฅํ•ฉ๋‹ˆ๋‹ค. ๐Ÿค” ํ”„๋กœํผํ‹ฐ ์ ‘๊ทผ๋ฒ•์œผ๋กœ ๋ฐ์ดํ„ฐ ์ถ”๊ฐ€, ๋Œ€์ฒด ํ•˜๊ธฐ var object = {}; object.arr = [];// obect์— arr๊ฐ€ ์—†๋‹ค๋ฉด ๋นˆ ๋ฐฐ์—ด([])์„ ์ถ”๊ฐ€, ์กด์žฌํ•œ๋‹ค๋ฉด ๋Œ€์ฒด console.log(object); // { arr: [] } object.arr.push('first');// object ์•ˆ์˜ arr์— ๋ฌธ์ž์—ด 'first' ์ถ”๊ฐ€ console.log(object.arr); // [ 'first' ] object.arr = [];// ๊ธฐ์กด์— ์žˆ๋Š” arr๋ฅผ ๋นˆ ๋ฐฐ์—ด๋กœ ๋Œ€์ฒด console.log(object.arr); /..
[JS] ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์˜ ์ƒ์†๊ณผ prototype ์ด๋ฒˆ์— ํšŒ์‚ฌ์—์„œ ๋ฐฐ์น˜๋ฐ›์€ ํŒ€์€ ๋ชจ๋ฐ”์ผ ์„œ๋น„์Šค ํŒ€์ด์—ˆ๋‹ค. ๋„ค์ดํ‹ฐ๋ธŒ ์•ฑ ์•„๋ž˜์— ์›น ๋ทฐ๋ฅผ ์ œ๊ณตํ•˜๋Š”๋ฐ ๋‹น๋ถ„๊ฐ„์€ ํ”„๋ก ํŠธ ๋ถ€๋ถ„์„ ๋‹ค๋ฃจ๊ฒŒ ๋  ๊ฒƒ ๊ฐ™๋‹ค. JS๋Š” DOM ์กฐ์ž‘ ์™ธ์—๋Š” ๋‹ค๋ค„๋ณผ ๊ธฐํšŒ๊ฐ€ ์—†์—ˆ๊ธฐ์— ์ด๋ฒˆ์— prototype์— ๋Œ€ํ•œ ๊ฐœ๋…๋„ ์ฒ˜์Œ ์•Œ๊ฒŒ ๋˜์—ˆ๋‹ค. JS๋Š” prototype ๊ธฐ๋ฐ˜ ์–ธ์–ด๋ผ๊ณ  ๋ถˆ๋ฆฐ๋‹ค๋Š”๋ฐ ๊ธฐ๋ณธ๋„ ๋ชฐ๋ž๋˜ ๊ฑฐ์‹œ์˜€๋‹ค... ํ•œ ๋™์•ˆ JS๋ฅผ ์—ด์‹ฌํžˆ ๊ณต๋ถ€ํ•ด์•ผํ•  ๊ฒƒ ๊ฐ™๋‹ค. prototype์€ JS์—์„œ ๊ฐ์ฒด์˜ ์ƒ์†์„ ๋‹ค๋ฃจ๋Š” ๊ฐ„๋‹จํ•˜๋ฉด์„œ, ์ค‘์š”ํ•œ ๊ฐœ๋…์ด์—ˆ๋‹ค. ์‚ฌ์‹ค JS๋„ ์ด๋Ÿฐ ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•œ๋‹ค๋Š” ๊ฒƒ์— ๋†€๋ผ๊ธฐ๋„ ํ–ˆ๋‹ค. ๋˜ ์—ญ์‹œ JS๋‹ต๊ฒŒ ๊ต‰์žฅํžˆ ์‹ฌํ”Œํ–ˆ๋‹ค. ๐Ÿง ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๊ฐ์ฒด ์ƒ์„ฑ function MyObject(์ธ์ž) { this.property1 = ... this.property2 = ์ธ์ž } class MyOb..
[JavaScript] String-boot ์›น ์†Œ์ผ“(WebSocket)์„ ์ด์šฉํ•œ ์‹ค์‹œ๊ฐ„ ์ฑ„ํŒ… ๊ตฌํ˜„ - Session Storage ํ™œ์šฉํ•˜๊ธฐ ์†Œ๊ฐœ ์™œ WebSocket์„ ์‚ฌ์šฉํ•˜์˜€๋‚˜? Spring-boot WebSocket ์‚ฌ์šฉ๋ฒ•(์„ค์ •๋ฒ•) ์ˆœ์ˆ˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ ์ž‘์„ฑํ•ด๋ณด๊ธฐ ๋ฐœ์ƒํ•œ ๋ฌธ์ œ์™€ ํ•ด๊ฒฐ ๋ฐฉ๋ฒ• ใ„ด HTTP session ๊ฐ€์ ธ์˜ค๊ธฐ -> interception ์‚ฌ์šฉ ใ„ด DB๋ฅผ ์‚ฌ์šฉํ•˜์ง€ ์•Š๊ณ  ๊ธฐ์กด ๋ฉ”์‹œ์ง€ ์ €์žฅํ•˜๊ธฐ -> Session Storage ์‚ฌ์šฉํ•˜๊ธฐ ์ตœ๊ทผ ์ž‘์„ฑ ์ค‘์ธ ๊ฐœ์ธ ํ”„๋กœ์ ํŠธ์—์„œ ์›น์— ์ ‘์†ํ•œ ํด๋ผ์ด์–ธํŠธ์™€ ์‹ค์‹œ๊ฐ„ ์ฑ„ํŒ…์„ํ•˜๋Š” ๊ธฐ๋Šฅ์„ ๊ตฌํ˜„ํ•ด๋ณด๋ ค๊ณ  ํ–ˆ๋‹ค. ๐Ÿค” ์™œ WebSocket์„ ์‚ฌ์šฉํ•˜์˜€๋‚˜? ์—ฌ๊ธฐ์„œ ๋งํ•˜๋Š” ์›น ์†Œ์ผ“์€ Spring Framework์˜ STOMP๊ฐ€ ์•„๋‹Œ ์ˆœ์ˆ˜ JavaScript๋ฅผ ํ™œ์šฉํ•œ ์˜ˆ์ œ ์ž…๋‹ˆ๋‹ค. jquery๋„ ์‚ฌ์šฉํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. WebSocket์ด ํ•„์š”ํ–ˆ๋˜ ์ด์œ  ์•ž์„œ๋งํ–ˆ๋“ฏ ์‹ค์‹œ๊ฐ„ ๋ผ์ด๋ธŒ ์ฑ„ํŒ… ๊ธฐ๋Šฅ์„ ๊ตฌํ˜„ํ•˜๊ณ  ์‹ถ์—ˆ๋‹ค. ํ•˜์ง€๋งŒ, ๊ธฐ..
์ž๋ฐ” ์Šคํฌ๋ฆฝํŠธ ๊ธฐ์ดˆ / ๊ธ€์ž์ˆ˜ ๊ณ„์‚ฐ๊ธฐ ๊ธ€์ž์ˆ˜ ๊ณ„์‚ฐ๊ธฐ ๋งŒ๋“ค๊ธฐ with ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ํ•„์š”์ง€์‹ 1. getElementById๋ฅผ ์ด์šฉํ•ด ใ„ด DOM(Document Object Model)์˜ id ๊ฐ€์ ธ์˜ค๊ธฐ 2. onkeydown ์ด๋ฒคํŠธ HTML ์ฝ”๋“œ ์ž๊ธฐ์†Œ๊ฐœ // ์ œ๋ชฉ ์ž…๋ ฅ ์ž…๋ ฅํ•˜์„ธ์š” (0/200) ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์ฝ”๋“œ
์ž๋ฐ” ์Šคํฌ๋ฆฝํŠธ ๋…ํ•™ ๊ธฐ์ดˆ / ์ฝ”๋“œ ๋œฏ์–ด ๋ณด๊ธฐ #1 / ๋žœ๋˜ ๋ฒˆํ˜ธ ์ƒ์„ฑ๊ธฐ DOCTYPE html> ๋ฒˆํ˜ธ ์ƒ์„ฑ๊ธฐ ์›น ํŽ˜์ด์ง€ ์ด๋ฆ„ ๋žœ๋ค ๋ฒˆํ˜ธ ์ถ”์ฒจ๊ธฐ ํŽ˜์ด์ง€ ์ƒ๋‹จ ์ œ๋ชฉ var lotto = []; lotto ๋ผ๋Š” ์ด๋ฆ„์˜ array(๊ธ€์ž๋‚˜ ์ˆซ์ž๋ฅผ ๋‹ด๋Š” ๊ณต๊ฐ„) ์ƒ์„ฑ while (lotto.length 0 ์ด์ƒ 46๋ฏธ๋งŒ์˜ ์‹ค์ˆ˜๋ฅผ ์ƒ์„ฑ parseInt() -> () ์•ˆ์˜ ๊ฐ’์„ '์ •์ˆ˜'๋กœ ๋ณ€ํ™˜ if (lotto.indexOf(num) == -1) { ์กฐ๊ฑด๋ฌธ if๋ฅผ ์‚ฌ์šฉ, '(์กฐ๊ฑด)'์„ ๋งŒ์กฑํ•˜๋Š” ๋™์•ˆ '{๋‚ด์šฉ}'์„ ์ง„ํ–‰ ์กฐ๊ฑด lotto.indexOf(num) -> ๋ณ€์ˆ˜ num์ด lotto array ์•ˆ์— ์กด์žฌ ๋ช‡ ๋ฒˆ์งธ ํ•ญ๋ชฉ ๋‚˜ํƒ€๋ƒ„ ์กด์žฌํ•˜์ง€ ์•Š์œผ๋ฉด -1 ๋žœ๋ค์œผ๋กœ ์ƒ์„ฑ๋œ ์ˆซ์ž๊ฐ€ ์ค‘๋ณต์ ์œผ๋กœ array์— ๋“ค์–ด๊ฐ€์ง€ ์•Š๊ฒŒ ํ•ด์ฃผ๊ธฐ ์œ„ํ•จ lotto.push(num); ์กฐ๊ฑด์„ ๋งŒ์กฑํ•œ๋‹ค๋ฉด lotto array..

728x90