전체 글(26)
-
[JS] 챌린지 마무리 도중 문제 발생
동적으로 리스트를 생성하는 과정에서 일반 버튼을 아이콘으로 대체했는데, 아이콘을 직접적으로 클릭하면 해당 이벤트가 발생하지 않고, 버튼으로 둘러싼 가장자리 부분을 클릭해야만 온전히 리스트가 사라진다 본래 li 밑에 span과 button을 묶고 button 클릭 시 parentElement인 li가 사라지도록 만들었는데, i를 클릭 시에는 부모인 버튼만 사라지고 li가 사라지지 않는다 function paintToDo(newToDo) { const li = document.createElement("li"); li.id = newToDo.id; const span = document.createElement("span"); span.innerText = newToDo.text; const button =..
2022.05.20 -
[JS] 쓰로틀링과 디바운싱
https://www.zerocho.com/category/JavaScript/post/59a8e9cb15ac0000182794fa https://www.zerocho.com/category/JavaScript/post/59a8e9cb15ac0000182794fa www.zerocho.com 위의 글 참조. 함수호출 또는 쿼리호출이 특정 함수에 의해 굉장히 빈번할 경우 문제가 된다 AJAX콜 횟수를 한정시켜서 쿼리호출이 빈번하게 이루어져 속도저하 문제나 비용문제가 발생할 수 있는 것을 방지한다 유료 API 사용 시 쿼리 하나가 다 돈이라는 소리에 이건 유용할 거 같아 남겨둔다 //================================================= // onresize() (metho..
2022.05.13 -
[CSS] flexbox의 이해를 돕는 게임
https://flexboxfroggy.com/#ko Flexbox Froggy A game for learning CSS flexbox flexboxfroggy.com 24단계까지 클리어 완료! 마지막 단계 해답. 더보기 flex-flow: column-reverse wrap-reverse; align-items: center; justify-content: center; align-content: space-between; wrap-reverse가 해답이었다
2022.05.12 -
[JS] 객체(Objects) 내부의 함수(Function)
https://bigtop.tistory.com/42 [JavaScript] 자바스크립트 메서드 (Method) 가볍게 이해하기 메서드(method)란? 때로는 메소드라고 불리기도 하는 메서드는 어떤 객체가 가지고 있는 어떤 동작을 말한다. 언어마다 조금씩 의미가 다르긴 하지만 자바스크립트에서는 일반적으로 객체 안에 bigtop.tistory.com (참고한 링크) 오늘 노마드클론코딩 챌린지 중 이미 생성된 객체 안에 이벤트핸들러를 넣어서 처리하라는 과제를 받았다 객체 안에 뭔가를 쓰려고 하니 자꾸 에러가 나서 일단 따로 이벤트핸들러를 작성한 후에 이 객체 안에 이벤트핸들러를 넣는 방법을 고민해봤는데, 알고 보니 이 과제는 js의 method를 알려주려는 목적이 있었던 듯하다 const superEven..
2022.05.12 -
바닐라 JS 강의 이론 부분 정리 #2
1. 소스파일 중 background.js 부분 const images = [ "0.jpg", "1.jpg", "2.jpg", "3.jpg", "4.jpg", "5.jpg", "6.jpg" ]; const chosenImage = images[Math.floor(Math.random() * images.length)]; // 난수발생 함수(브라우저포함) Math.floor(Math.random() * images.length) // 소수점 이하를 floor( 내림/바닥 ) / round ( 반올림 ) / ceil ( 올림/천장 ) // Math.random() * 난수발생범위(images.length) // 해당 부분의 의미는 images의 길이만큼 난수를 발생시킨 후(실수 부분을 모두 발생시킴) // ..
2022.05.06 -
바닐라 JS 강의 이론 부분 정리 #1
// js 이론 // 일반적으로 변수선언 시 값의 변화를 줄 수 없는 const 사용, 값의 변화가 필요할 때(반복문 등) let 사용 // var는 사용하지 않음 // 변수선언 또는 함수사용 시 notAtAll 처럼 띄어쓰기되는 부분을 대문자로 처리하는 것이 관례 // python의 경우 not_at_all로 사용을 하는 것이 관례 // boolean (논리연산) true / false const amIFat = true; let something; console.log(amIFat); console.log(something); //================================================================================================..
2022.05.06