본문 바로가기

전체 글171

[ JavaScript ] 이벤트 위임 Event Delegation 이벤트 위임 Event Delegation 이란? 이벤트 리스너를 하위 요소에 추가하는 대신 상위 요소에 추가하는 기법 DOM event에 적용할 수 있는 유용한 패턴 비슷한 방식으로 여러 요소를 다뤄야 할 때 사용된다 => 요소마다 핸들러를 할당하지 않고, 요소의 공통 조상에 할당해서 여러 요소 한꺼번에 다룬다 event.target : 이벤트가 발생한 가장 안쪽 요소 => 실제 어디서 이벤트가 발생했는지 알 수 있다 event.currentTarget ( = this ) : 이벤트를 핸들링하는 현재 요소(핸들러가 실제 할당된 요소) event.eventPhase : 현재 이벤트 흐름 단계(캡처링-1,타깃-2,버블링-3) 추가, 삭제가 용이해서 HTML 구조가 유연해진다 캡처링과 버블링을 활용 캡처링 .. 2023. 10. 29.
[ 자료구조 ] 해시테이블 Hash Table 보호되어 있는 글 입니다. 2023. 10. 29.
[ JavaScript ] Set이 왜 더 빠를까?(feat. 해시테이블, 시간복잡도) Set 이 왜 더 빠른가? Set 은 해시테이블 자료구조를 갖고 있다고 한다. 2023.10.29 - [Computer Science] - [ 자료구조 ] 해시테이블 Hash Table 해시테이블 자료 구조란? Key,Value System 사용하여 데이터를 저장하는 자료구조이다. 키(Key), 해시함수(Hash function), 해시(hash), 값(value), 저장소(bucket)로 이루어져 있다. 장점 단점 - 검색 속도가 빠르다 - 삽입, 삭제 작업이 O(1)이다. - 순서가 있는 배열에 어울리지 않는다. - 공간 복잡도가 높다. - 해시 함수의 의존도가 높다. - 해시 충돌이 발생할 수 있다. 데이터 관리 메서드 & 시간 복잡도 Set Array 값이 있는지 확인하기 set.has() => .. 2023. 10. 29.
Week 2. 자동차 경주 게임 보호되어 있는 글 입니다. 2023. 10. 29.
Week 1. 웹 프론트엔드 공통 피드백 보호되어 있는 글 입니다. 2023. 10. 28.
Changing Colors in an SVG Element Using CSS and JavaScript SVG 요소는 기존 이미지 포맷들과 다르게 HTML DOM 구조와 공통점이 많다. CSS 로 색 바꾸기 - 선택자 - 커스텀 속성 자바스크립트로 색 바꾸기 - querySelector, setAttribute 사용 참조 https://kirupa.com/web/changing_colors_svg_css_javascript.htm 2023. 10. 27.