๋ชฉ๋ก2022/01/30 (6)
whatisthis?
ํด์ ๊ฒ์ - ํ ์คํธ ๊ธฐ๋ฐ RGP skill html / css javascript javaScript. ์๋ ํ ์คํธ RPG ๊ฒ์ ์๋ ํ ์คํธ RPG ๊ฒ์ index.html ํ ์คํธ RPG style.css * { margin: 0; box-sizing : border-box; } html { font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; font-s.. mywebproject.tistory.com ์ง๋ ์ค์ต์ผ๋ก ํด๋ดค๋ ์๋ ํ ์คํธ RPG ๊ฒ์์ ํ ๋๋ก ์ ์ํ์. - ์๋ํ ์คํธ RPG๊ฒ์์ ๊ฒ์๊ณผ ์ฌ์ฉ์์ interaction์ด '์ด๋ฆ ์ ๋ ฅ' ํ๋๋ฐ์ ์์๋ค๋ฉด, ์ด๋ฒ์ ์ ์ํ ๊ฒ์์ 'ํด(turn)'์ ๊ฐ๋ ..
ํจ์ํ ํ๋ก๊ทธ๋๋ฐ - ๊ฐ์ฒด์งํฅ ํ๋ก๊ทธ๋๋ฐ(OOP)๊ณผ๋ ๋ค๋ฅด๋ค. - ํจ์ํ ํ๋ก๊ทธ๋๋ฐ์ 'ํจ์๋ฅผ ๊ธฐ๋ฐ'์ผ๋ก ๋์๊ฐ๋ค. - ์๋ฐ์คํฌ๋ฆฝํธ๋ ๊ธฐ๋ณธ์ ์ผ๋ก ๊ฐ์ฒด์งํฅ์ด๋ฏ๋ก, ์๋ฒฝํ๊ฒ ํจ์ํ ํ๋ก๊ทธ๋๋ฐ์ ํ ์๋ ์๋ค. ์ ์ถ๋ ฅ์ด ์์ํ ํจ์์ฌ์ผ ํ๋ค. ๋ถ์์ฉ(๋ถ์ฐ๋ฌผ)์ด ์์ด์ผ ํ๋ค. ํจ์์ ๋ฐ์ดํฐ๋ฅผ ์ค์ ์ผ๋ก ์๊ฐํ๋ค. (๊ฐ์ฒด๋์ ๋ค๋ฆ) ๐ก ์ ์ถ๋ ฅ์ด ์์ํ๋ค? (= ์์ํจ์) >> ํ๋ ์ด์์ ์ธ์๋ฅผ ๋ฐ๊ณ , ๋ฐ์ ์ธ์๋ฅผ ์ฒ๋ฆฌํ์ฌ ๊ฒฐ๊ณผ ๋ฆฌํดํด์ผํจ. - ์ธ์ ์ ์ธํ ๋ค๋ฅธ ๋ณ์๋ ์ฌ์ฉํด์ X. - ๋ฐ์ ์ธ์๋ง์ผ๋ก ๊ฒฐ๊ณผ ๋์ถํด์ผํจ. โ ์๋ฐ์คํฌ๋ฆฝํธ์์๋ this๋ผ๋ ๊ฐ๋ ๋๋ฌธ์ ์์ํจ์๋ฅผ ์ฌ์ฉํ๊ธฐ ํ๋ค๋ค. ๐ก ๋ถ์์ฉ์ด ์๋ค? - ํ๋ก๊ทธ๋๋จธ๊ฐ ๋ฐ๊พธ๋ ค๋ ๋ณ์ ์ธ์๋ ๋ฐ๋์ด์๋ X. - ์๋ณธ Data๋ ๋ถ๋ณ. >> ํจ์ํ ํ๋ก๊ทธ๋๋ฐ..
์๋ฐ์คํฌ๋ฆฝํธ ๋์์ธ ํจํด - ์๋ฐ์คํฌ๋ฆฝํธ ์ฑ์ ๋ง๋ค ๋ ์์ฃผ ์ฌ์ฉ๋๋ ํจํด 1) ๋ชจ๋ ํจํด (=IIFE) - ๋น๊ณต๊ฐ ๋ณ์๋ฅผ ๋ง๋๋ ๊ฒ. (์๋ js์๋ ์๋ ๊ธฐ๋ฅ์) javaScript. IIFE(์ฆ์ ํธ์ถ ํจ์ ํํ์) IIFE ์ฆ์ ์คํ ํจ์ ํํ(IIFE, Immediately Invoked Function Expression)์ ์ ์ธํ์๋ง์ ์ฆ์ ์คํ๋๋ Javascript Function ๋ฅผ ๋งํ๋ค. ๋ค๋ฅธ ๋ง๋ก ๋ชจ๋ ํจํด(Module Pattern)์ด๋ผ๊ณ ๋ ํจ. SYNTAX (function (.. mywebproject.tistory.com ์ฆ์ ์คํ ํจ์ ํํ(IIFE, Immediately Invoked Function Expression)์ ์ ์ธํ์๋ง์ ์ฆ์ ์คํ(=ํธ์ถ)๋๋ Javasc..
์๋ฐ์คํฌ๋ฆฝํธ์์๋ ์ผ๋ฐ String / Number / Boolean ๊ฐ์ ๋ค์๊ณผ ๊ฐ์ด ๋ณต์ฌ(copy)ํ ์ ์๋ค. const string = 'hello'; const copy = string; copy; // 'hello' function sayHello() { console.log('hello'); } const copyFunc = sayHello; ์๋ฐ์คํฌ๋ฆฝํธ์์๋ null๊ณผ undefined ๋ฅผ ์ ์ธํ ๋ชจ๋ ํ์ ์ด ๊ฐ์ฒด์ด๋ฏ๋ก '๊ฐ์ฒด' = ํจ์, ๋ฐฐ์ด, ์ผ๋ฐ ๊ฐ์ฒด๋ ๋ณต์ฌํ ์ ์๋ค. โ ๋จ, ๋ณต์ฌ๋ ๊ฐ์ ์กฐ์ํ ๋ ์ฐจ์ด๊ฐ ์๋ค. let string = 'hello'; let copy = string; copy = 'bye'; // ๋ณต์ฌ๋ณธ์ ๊ฐ์ ๋ฐ๊ฟ์ค string; // 'hello' ใ ก ์๋ณธ์ ..
์ง๋ ๊ฐ์์์๋ ์ซ์ / ๋ฐฐ์ด / ๋ฌธ์์ด์ ๋ํ ๋ฉ์๋๋ฅผ ๋ฐฐ์ ์๋ค. (์> Number.toFixed() / Array.join() / String.split() ๋ฑ) javaScript. (9) ๋ฐฐ์ด(Array) ๋ฐฐ์ด์ ๊ดํ Method 1) ๋ฐฐ์ด.length let array= [1, 2, 3, 4]; array.length; // 4 ๋ฐฐ์ด์ ๊ธธ์ด๋ฅผ ์๋ ค์ค๋ค. ๋ฐฐ์ด์ ์์๊ฐ ์ถ๊ฐ/์ ๊ฑฐ ๋ ๋ ๋ง๋ค ์๋์ผ๋ก ๋ฐ๋๋ค. let array = [1, 2, 3, 4, 5]; array.length; /.. mywebproject.tistory.com javaScript. (8) ์ซ์์ Math ๊ฐ์ฒด ์ซ์(Number) - ์ซ์ ๋ํ ์์ ๋ํผ ๊ฐ์ฒด (new Number()) ๊ฐ ์กด์ฌํ๊ณ , ๋ฉ์๋๋ฅผ ๊ฐ์ง ์ ์..
javaScript. (20) Event Listener / Callback ๐ Event Listener - ํด๋น ์ด๋ฒคํธ์ ๋ํด ๋๊ธฐ์ค์ธ ๊ฒ. (์์ Listening ์ค) - ์ด๋ฒคํธ๊ฐ ๋ฐ์ํ์๋ ๋ฑ๋กํ๋ ์ด๋ฒคํธ ๋ฆฌ์ค๋๊ฐ ์คํ๋จ. window.onload = function () { alert('I\'m loaded'); }; - ๋ํ์ ์ธ ์ด๋ฒค.. mywebproject.tistory.com ์ง๋ ํฌ์คํ ์์ Callback์ ๋ํ ์ดํด๊ฐ ์ ์๋๋ ๊ฒ ๊ฐ์ ์ถ๊ฐ๋ก Callback์ ๋ํด ํฌ์คํ ํด๋ณด๊ฒ ๋ค. ์ฝ๋ฐฑ์ ๋ํด ์ค๋ช ํ๊ธฐ์ ์์, ๋น๋๊ธฐ ์ฒ๋ฆฌ๊ฐ ๋ฌด์์ธ์ง์ ๋ํด ๋จผ์ ์์๋ณด์. ๋น๋๊ธฐ๋ ๋๊ธฐ์์ ๋ฐ๋๋๋ ๊ฐ๋ ์ผ๋ก, ๋์ ๋น๊ตํด๋ณด๋ฉด ๋ค์๊ณผ ๊ฐ๋ค. Syncronous (๋๊ธฐ์) ์์ฒญ์ ๋ณด๋ธ ํ ํด๋น ์์ฒญ์..