킹바구니 🦜

1. 기본 예시 // 컨트롤 + o키 눌렀을 때 $(document).keydown(function(event) { if(event.keyCode === 79 && event.ctrlKey) { alert('안녕하세요'); } }); 2. 브라우저 기본 이벤트 삭제 // 컨트롤 + o키 눌렀을 때 $(document).keydown(function(event) { if(event.keyCode === 79 && event.ctrlKey) { alert('안녕하세요'); if (event.preventDefault) event.preventDefault(); if (event.stopPropagation) event.stopPropagation(); } }); 컨트롤 o같은 경우 파일첨부창이 뜨는데, 이를..

1. selector가 기준 2. $(this)쓰는데 뭔가 안될 때 확인해봐야할 것 // 이건 된다 $("button").click(function() { console.log($(this).attr("id")); }) // 이건 자바스크립트 함수라서 this를 인식 못한다. function something() { // no console.log($(this).attr("id")); // ok console.log($(event.target).attr("id")); } 쓰고있는 곳이 함수 안인지 그냥 제이쿼리 명령언지에 따라서 $(event.target)나 $(this) 이렇게 따로 써줘야 먹힘. 3. $("selector")는 기본적으로 여러 selector을 선택하긴하는데.. // 3개 전부 가리킴..

이걸 나도 뭐라 해야할지 모르겠어서 검색할때도 애먹었는데 var theme1 = "테마 1번입니다"; var theme2 = "테마 2번입니다"; var num = prompt('원하는 테마 번호는?'); 예를들어 prompt에 2를 입력하면 theme2에 대한 내용이 출력되도록 하는걸 하고싶었는데, console.log(`theme${num}`); console.log(theme+num); console.log('theme'+num); 이런식으로 하면 변수로 인식하지 못하고 텍스트로 인식해버려서 어떻게 하나 싶었는데 방법은 1. eval 사용하기 (그런데 비추인것 같음) // var theme1 = "테마 1번입니다"; // var theme2 = "테마 2번입니다"; // var num = promp..

node.js를 활용하여 jwt로 로그인해보기 1. 터미널에서 아래와 같이 입력하여 설치 npm init npm i express dotnev jsonwebtoekn npm i --sav-dev nodemon 한줄씩 설치해주면 된다. 2. package.json에서 아래와같이 변경 server.js 파일 하나 만들고 앞으로 실행할때는 터미널에 npm run devStart라고 써주면 된다. 3. server.js에 아래와같이 써주기 const express = require('express'); const app = express(); const posts = [ { username: 'hobs', title: 'Post 1' }, { username: 'kate', title: 'Post 2' } ];..

예를들어 이것처럼 한 form안에 추가하기/수정하기와 같은 각각 다른 행동을 해야하는 경우 어떻게 해줘야할지 모르겠어서 찾아보다가 발견함. 추가하기 수정하기 이렇게 작성하면 된다. --------------------------------- 1. 원래 코드 추가하기 수정하기 이렇게 되어있다보니 무슨 button을 누르든 /add에 대한 내용으로 처리됨. 2. action 지우고 location 추가 추가하기 수정하기 그랬더니 저렇게 에러가 뜸. /add로 페이지가 가지도 않음. 3. type을 변경 추가하기 수정하기 안가면 type을 바꿔달라길래 submit에서 button으로 바꿔줬더니 url은 /add로 이동하는데 여전히 에러가 뜸. 참고한 곳 https://kutar37.tistory.com/ent..

slice let text = '300px' //-200px, 1cm... text.slice(-text.length, -2); // 300 이렇게하면 뒤에서부터 두자리만 빼고 나머지를 가져올 수 있다. style.left, offsetHeight, clientHeight // let img = document.querySelector('img'); console.log(img.offsetHeight) // 154 console.log(img.clientHeight) // 150 console.log(window.getComputedStyle(img).height) // 150px style.left는 img.style.left = '100px' 이런식으로 변경할 때 쓰는 것 같고, 특정 수치를 구할때는..

1. 폴더에 json파일 저장 그런데 확장자는 .js로 저장해야함 ※엑셀파일을 json파일로 만들기 1. 엑셀파일 저장 후 아래 링크에서 불러오기 beautifytools.com/excel-to-json-converter.php 2. json 파일을 폴더에 저장 저장할때 확장자명을 .js로 저장 3. json파일에서 수정 및 export { "Sheet1": [ { "symbol": "AAVE", "name": "에이브" }, { "symbol": "ADA", "name": "에이다" }, { "symbol": "ADP", "name": "어댑터 토큰" } ] } 위에 있는 파일에서 export default [ { "symbol": "AAVE", "name": "에이브" }, { "symbol": "A..

let red = { fruits: 'apple' }; let yellow = { fruits: 'banana' }; const say = function() { console.log(`${this.fruits} is good!`); }; // 각각의 object가 하나의 say를 쓰고 싶다면? 1. call say.call(red) // apple is good!; say.call(yellow) // banana is good!; 이렇게 쿨하게 가져다가 쓸 수 있다. 1-1) 만약 function에 인자가 있다면 let red = { fruits: 'apple' }; const say = function(country) { console.log(`${this.fruits}(from ${country})..

자바스크립트에서 this는 그 상황마다 가리키는 값이 다름. 1. window 2. 자기 자신 3. 앞에 붙은 object 4. ??? 이렇게 크게 3가지로 나뉨 1. 일반적인(global scope) 상황에서 this는 window를 가리킴. this.room = 'window table'; // 콘솔창에 this만 쳐도 자동으로 window가 출력. 2. object안에서 this는 자기 자신을 가리킴. this.table = 'window table'; let myRoom = { table: 'my table', }; console.log(this.table) // window table console.log(myRoom.table) // my table console.log(this.myRoom...

1. var와 let의 차이점 var: 예전 자바스크립트에서 사용되던 변수. let: ES6 자바스크립트부터 사용할 수 있는 변수. var 특징 1) 호이스팅이 됨. console.log(v); // undefined console.log(l); // l is not defined var v = 'var'; let l = 'let'; 2) 함수형 스코프를 가지고 있음. function aa() { if(true) { var v = 'var'; let l = 'let'; }; console.log(v); // 'var' console.log(l); // l is not defined }; aa(); var는 함수 내에서 최상단으로 올라가 선언됨. let은 생성된 그곳(if문) 안에서만 활동 가능함. 그래서..