๐ป ๊ณต๋ถ ๊ธฐ๋ก/๐๏ธ JavaScript
-
๐ ์ด๊ธฐ ์ฝ๋ ๋ฐ๋ณต๋ฌธ์ ํตํด์ ํ์ผ์ ๋ํ ์ ๋ณด๋ฅผ formData๋ก ๋ฃ๊ณ , ๋ค๋ฅธ ํจ์ ์คํ์ ์ํด ํ์ํ ๋ณ์๊ฐ์ ์ ์ํ์ฌ ํจ์ ์คํ์ ํ์ํ ๋ฐ์ดํฐ๋ฅผ ๋ณด๋ผ ์๊ฐ์ด์์ผ๋, chatFilePattern์ ๋ณ์๊ฐ์ด ๊ณ ์ ์ ์ผ๋ก ๋ค์ด๊ฐ๋ฉด์ ์๊ธด ๋ถ๋ถ์ ๋ํด์ ์์ ํ๊ณ , ์์ ํ ์ฝ๋์ ๋ํ ๋ฆฌ๋ทฐ๋ฅผ ์งํํ๋ค. for (const file of files) { chatFilePattern = firstNum + "" + countFileNumber++ formData.append("files", file); formData.append("chatFileNumber", chatFilePattern); // Base64 ์ด๋ฏธ์ง ๋ณํ const reader = new FileReader(); reader.readAsDat..
JS/Refactoring | ํด๋ก์ , ์ฝ๋ฐฑ๐ ์ด๊ธฐ ์ฝ๋ ๋ฐ๋ณต๋ฌธ์ ํตํด์ ํ์ผ์ ๋ํ ์ ๋ณด๋ฅผ formData๋ก ๋ฃ๊ณ , ๋ค๋ฅธ ํจ์ ์คํ์ ์ํด ํ์ํ ๋ณ์๊ฐ์ ์ ์ํ์ฌ ํจ์ ์คํ์ ํ์ํ ๋ฐ์ดํฐ๋ฅผ ๋ณด๋ผ ์๊ฐ์ด์์ผ๋, chatFilePattern์ ๋ณ์๊ฐ์ด ๊ณ ์ ์ ์ผ๋ก ๋ค์ด๊ฐ๋ฉด์ ์๊ธด ๋ถ๋ถ์ ๋ํด์ ์์ ํ๊ณ , ์์ ํ ์ฝ๋์ ๋ํ ๋ฆฌ๋ทฐ๋ฅผ ์งํํ๋ค. for (const file of files) { chatFilePattern = firstNum + "" + countFileNumber++ formData.append("files", file); formData.append("chatFileNumber", chatFilePattern); // Base64 ์ด๋ฏธ์ง ๋ณํ const reader = new FileReader(); reader.readAsDat..
2023.05.26 -
๐ ํด๋ก์ ํจ์ ํด๋ก์ ๋ ํจ์์ ํจ์๊ฐ ์ ์ธ๋ ์ดํ์ ํ๊ฒฝ์ ์กฐํฉ์ด๋ค. ํด๋ก์ ๋ฅผ ์ดํดํ๋ ค๋ฉด JS๊ฐ ์ด๋ป๊ฒ ๋ณ์์ ์ ํจ๋ฒ์๋ฅผ ์ง์ ํ๋์ง๋ฅผ ์ดํดํด์ผํ๋ค. ๐ ์ดํ์ ๋ฒ์ ์ง์ (Lexical scoping) function init() { var name = "Mozilla"; // name์ init์ ์ํด ์์ฑ๋ ์ง์ญ ๋ณ์์ด๋ค. function displayName() { // displayName() ์ ๋ด๋ถ ํจ์์ด๋ฉฐ, ํด๋ก์ ๋ค. alert(name); // ๋ถ๋ชจ ํจ์์์ ์ ์ธ๋ ๋ณ์๋ฅผ ์ฌ์ฉํ๋ค. } displayName(); } init(); ๐ let๊ณผ const๋ฅผ ์ฌ์ฉํ ๋ฒ์ ์ง์ if (Math.random() > 0.5) { var x = 1; } else { var x = 2; } consol..
JavaScript | ํด๋ก์ ํจ์๐ ํด๋ก์ ํจ์ ํด๋ก์ ๋ ํจ์์ ํจ์๊ฐ ์ ์ธ๋ ์ดํ์ ํ๊ฒฝ์ ์กฐํฉ์ด๋ค. ํด๋ก์ ๋ฅผ ์ดํดํ๋ ค๋ฉด JS๊ฐ ์ด๋ป๊ฒ ๋ณ์์ ์ ํจ๋ฒ์๋ฅผ ์ง์ ํ๋์ง๋ฅผ ์ดํดํด์ผํ๋ค. ๐ ์ดํ์ ๋ฒ์ ์ง์ (Lexical scoping) function init() { var name = "Mozilla"; // name์ init์ ์ํด ์์ฑ๋ ์ง์ญ ๋ณ์์ด๋ค. function displayName() { // displayName() ์ ๋ด๋ถ ํจ์์ด๋ฉฐ, ํด๋ก์ ๋ค. alert(name); // ๋ถ๋ชจ ํจ์์์ ์ ์ธ๋ ๋ณ์๋ฅผ ์ฌ์ฉํ๋ค. } displayName(); } init(); ๐ let๊ณผ const๋ฅผ ์ฌ์ฉํ ๋ฒ์ ์ง์ if (Math.random() > 0.5) { var x = 1; } else { var x = 2; } consol..
2023.05.26 -
์๋ฒ ์ฐ์ ์๋ฒ ์ชฝ ๊ธฐ๋ฅ์ ๋จผ์ ์๊ฐํด๋ด ์๋ค. ํํธ๋ฅผ ๋๋ฅด๋ฉด 1) ์ด๋ค ํฌ์คํธ๋ฅผ 2) ๋๊ฐ ๋๋ ๊ณ 3) ์ข์์์ธ์ง ์ข์์ ์ทจ์์ธ์ง๋ฅผ ์์์ผ๊ฒ ์ฃ ? ์์ ๋ก ๋ง๋ค ๋ค๋ฅธ ๋ฐ์๋ค(โญ, ๐)์ ์๊ฐํ๋ฉด ์ด๋ ์์ด์ฝ์ ๋๋ ๋์ง๋ ์์์ผ๊ฒ ๋ค์. DB์ ์ ์ฅํ ๋๋ 1) ๋๊ฐ 2) ์ด๋ค ํฌ์คํธ์ 3) ์ด๋ค ๋ฐ์์ ๋จ๊ฒผ๋์ง ์ธ ์ ๋ณด๋ง ๋ฃ์ผ๋ฉด ๋๊ณ , ์ข์์์ธ์ง, ์ทจ์์ธ์ง์ ๋ฐ๋ผ ํด๋น ๋ํ๋จผํธ๋ฅผ insert_one()์ ํ ์ง delete_one()์ ํ ์ง ๊ฒฐ์ ํด์ฃผ์ด์ผํฉ๋๋ค. if action_receive =="like": db.likes.insert_one(doc) else: db.likes.delete_one(doc) ์ข์์ ์ปฌ๋ ์ ์ ์ ๋ฐ์ดํธํ ์ดํ์๋ ํด๋น ํฌ์คํธ์ ํด๋น ํ์ ์ ๋ฐ์์ด ๋ช ๊ฐ์ธ์ง๋ฅผ ์ธ์ ๋ณด๋ด์ฃผ์ด์ผํฉ๋๋ค...
Ajax/JQuery | ์ข์์ ๊ธฐ๋ฅ์๋ฒ ์ฐ์ ์๋ฒ ์ชฝ ๊ธฐ๋ฅ์ ๋จผ์ ์๊ฐํด๋ด ์๋ค. ํํธ๋ฅผ ๋๋ฅด๋ฉด 1) ์ด๋ค ํฌ์คํธ๋ฅผ 2) ๋๊ฐ ๋๋ ๊ณ 3) ์ข์์์ธ์ง ์ข์์ ์ทจ์์ธ์ง๋ฅผ ์์์ผ๊ฒ ์ฃ ? ์์ ๋ก ๋ง๋ค ๋ค๋ฅธ ๋ฐ์๋ค(โญ, ๐)์ ์๊ฐํ๋ฉด ์ด๋ ์์ด์ฝ์ ๋๋ ๋์ง๋ ์์์ผ๊ฒ ๋ค์. DB์ ์ ์ฅํ ๋๋ 1) ๋๊ฐ 2) ์ด๋ค ํฌ์คํธ์ 3) ์ด๋ค ๋ฐ์์ ๋จ๊ฒผ๋์ง ์ธ ์ ๋ณด๋ง ๋ฃ์ผ๋ฉด ๋๊ณ , ์ข์์์ธ์ง, ์ทจ์์ธ์ง์ ๋ฐ๋ผ ํด๋น ๋ํ๋จผํธ๋ฅผ insert_one()์ ํ ์ง delete_one()์ ํ ์ง ๊ฒฐ์ ํด์ฃผ์ด์ผํฉ๋๋ค. if action_receive =="like": db.likes.insert_one(doc) else: db.likes.delete_one(doc) ์ข์์ ์ปฌ๋ ์ ์ ์ ๋ฐ์ดํธํ ์ดํ์๋ ํด๋น ํฌ์คํธ์ ํด๋น ํ์ ์ ๋ฐ์์ด ๋ช ๊ฐ์ธ์ง๋ฅผ ์ธ์ ๋ณด๋ด์ฃผ์ด์ผํฉ๋๋ค...
2023.01.02 -
ํ์ผ ์ ๋ก๋ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ํ์ผ ์ ๋ก๋ scripts $(document).ready(function () { bsCustomFileInput.init() listing() }) AJax /* POST ์์ฒญ ajax ์ฝ๋ */ function post_posting() { // ๊ณ ์ id let ํจ์๋ก ์ ์ let picture = $('#post_picture').val() let comment = $('#post_comment').val() let pic = $('#pic')[0].files[0] let form_data = new FormData() form_data.append("picture_give", picture) form_data.append("pic_give", pic) form_data...
Ajax/JQuery | ์ฌ์ง ์ ๋ก๋ํ์ผ ์ ๋ก๋ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ํ์ผ ์ ๋ก๋ scripts $(document).ready(function () { bsCustomFileInput.init() listing() }) AJax /* POST ์์ฒญ ajax ์ฝ๋ */ function post_posting() { // ๊ณ ์ id let ํจ์๋ก ์ ์ let picture = $('#post_picture').val() let comment = $('#post_comment').val() let pic = $('#pic')[0].files[0] let form_data = new FormData() form_data.append("picture_give", picture) form_data.append("pic_give", pic) form_data...
2023.01.02 -
Element select input text๋ textarea ์์๋ฅผ ๋๋๊ทธํ ๋ฏ์ด ์ ํํ๊ธฐ ์ํด ์ฌ์ฉ select | selectAll ์๊ฐํํ ์์ ์ ํ d3.select("body") .selectAll("p") // ์คํ selectAll ์ ๊ฒฐ๊ณผ๊ฐ
Element select();Element select input text๋ textarea ์์๋ฅผ ๋๋๊ทธํ ๋ฏ์ด ์ ํํ๊ธฐ ์ํด ์ฌ์ฉ select | selectAll ์๊ฐํํ ์์ ์ ํ d3.select("body") .selectAll("p") // ์คํ selectAll ์ ๊ฒฐ๊ณผ๊ฐ
2023.01.02 -
HTML์ event ์ข ๋ฅ ๊ฐ์ Javascript์ Module Pattern์ ์ฌ์ฉํ์ฌ ํด๋น ์คํฌ๋ฆฝํธ๋ฅผ ์ฌ์ฌ์ฉ ํ ์ ์๋ ์ฅ์ ๋ค๋ฅธ ์์ค์ ์์ด์ง ์๊ณ , ํด๋น ๋ชจ๋์ ํตํด์ ์์ ํ ๊ธฐ๋ฅ์ ์ ๊ณต ์ข ๋ฅ onabort ์ด๋ฏธ์ง ๋ก๋ฉ์์ ์ดํํ์์ ๋(๋ค๋ฅธ ์ฐ๊ฒฐ๋ก ์ด๋) onactivate ๊ฐ์ฒด์ activeElement ์์ฑ์ ์ค์ ํ์์ ๋ onafterprint ๊ด๋ จ๋ ๋ฌธ์๋ฅผ ์ธ์ํ๊ฑฐ๋ ์ธ์ ๋ฏธ๋ฆฌ๋ณด๊ธฐ๋ฅผ ํ ์ฆ์ onbeforeactivate ๊ฐ์ฒด์ activeElement ์์ฑ์ด ์ค์ ๋๊ธฐ ๋ฐ๋ก ์ ์ onbeforecopy ์ ํ๋ ๋ด์ฉ์ด ์์คํ ํด๋ฆฝ๋ณด๋(clipboard)๋ก ๋ณต์ฌํ๊ธฐ ๋ฐ๋ก ์ ์ onbeforecut ์ ํ๋ ๋ด์ฉ์ด ์์คํ ํด๋ฆฝ๋ณด๋(clipboard)๋ก ์๋ผ๋ด๊ธฐ ๋ฐ๋ก ์ ์ onbeforedea..
Event | HTML์ event ์ข ๋ฅHTML์ event ์ข ๋ฅ ๊ฐ์ Javascript์ Module Pattern์ ์ฌ์ฉํ์ฌ ํด๋น ์คํฌ๋ฆฝํธ๋ฅผ ์ฌ์ฌ์ฉ ํ ์ ์๋ ์ฅ์ ๋ค๋ฅธ ์์ค์ ์์ด์ง ์๊ณ , ํด๋น ๋ชจ๋์ ํตํด์ ์์ ํ ๊ธฐ๋ฅ์ ์ ๊ณต ์ข ๋ฅ onabort ์ด๋ฏธ์ง ๋ก๋ฉ์์ ์ดํํ์์ ๋(๋ค๋ฅธ ์ฐ๊ฒฐ๋ก ์ด๋) onactivate ๊ฐ์ฒด์ activeElement ์์ฑ์ ์ค์ ํ์์ ๋ onafterprint ๊ด๋ จ๋ ๋ฌธ์๋ฅผ ์ธ์ํ๊ฑฐ๋ ์ธ์ ๋ฏธ๋ฆฌ๋ณด๊ธฐ๋ฅผ ํ ์ฆ์ onbeforeactivate ๊ฐ์ฒด์ activeElement ์์ฑ์ด ์ค์ ๋๊ธฐ ๋ฐ๋ก ์ ์ onbeforecopy ์ ํ๋ ๋ด์ฉ์ด ์์คํ ํด๋ฆฝ๋ณด๋(clipboard)๋ก ๋ณต์ฌํ๊ธฐ ๋ฐ๋ก ์ ์ onbeforecut ์ ํ๋ ๋ด์ฉ์ด ์์คํ ํด๋ฆฝ๋ณด๋(clipboard)๋ก ์๋ผ๋ด๊ธฐ ๋ฐ๋ก ์ ์ onbeforedea..
2023.01.02 -
HTML / JavaScript form ํ๊ทธ ์ค์์ event ๋ฅผ ์ค์ ํ ๋ onsubmit : form์ ๊ฐ์ ์ ์กํ๊ธฐ ์ ์ ์ด๋ค ์์ ์ ํ๊ฒ ํ ์ ์์ onsubmit="return ํจ์()" return์ ์ถ๊ฐํ๋ฉด submit์ ํ๊ธฐ ์ ์ ํจ์๋ฅผ ๋จผ์ ์คํํ๊ณ , ๊ฒฐ๊ณผ(true, false)์ ๋ฐ๋ผ submit์ด ๋ฐ์ return์ ์ฌ์ฉํ์ง ์์ผ๋ฉด ์ ํจ์ฑ ๊ฒฐ๊ณผ์ ์๊ด์์ด ํจ์๋ฅผ ์คํ : formํ๊ทธ๋ฅผ ์ง์นญํ๋ this๋ฅผ ์ด์ฉํด object๋ก ์ ์ํ๊ณ , ๊ฐ input์ name๋ณ๋ก ํด๋นํ๋ ๊ฐ ๋ฑ์ ์ ๋ณด๋ฅผ ์ด์ฉํ ์ ์๋ค.
Event | onsubmit returnHTML / JavaScript form ํ๊ทธ ์ค์์ event ๋ฅผ ์ค์ ํ ๋ onsubmit : form์ ๊ฐ์ ์ ์กํ๊ธฐ ์ ์ ์ด๋ค ์์ ์ ํ๊ฒ ํ ์ ์์ onsubmit="return ํจ์()" return์ ์ถ๊ฐํ๋ฉด submit์ ํ๊ธฐ ์ ์ ํจ์๋ฅผ ๋จผ์ ์คํํ๊ณ , ๊ฒฐ๊ณผ(true, false)์ ๋ฐ๋ผ submit์ด ๋ฐ์ return์ ์ฌ์ฉํ์ง ์์ผ๋ฉด ์ ํจ์ฑ ๊ฒฐ๊ณผ์ ์๊ด์์ด ํจ์๋ฅผ ์คํ : formํ๊ทธ๋ฅผ ์ง์นญํ๋ this๋ฅผ ์ด์ฉํด object๋ก ์ ์ํ๊ณ , ๊ฐ input์ name๋ณ๋ก ํด๋นํ๋ ๊ฐ ๋ฑ์ ์ ๋ณด๋ฅผ ์ด์ฉํ ์ ์๋ค.
2023.01.02