웹 (프론트엔드 취준 당시 공부했던 글)/Javascript

[javascript] - 이벤트 캡처링, 버블링, 이벤트 위임(event delegation)

2023.04.09

이벤트 캡처링과 버블링 이벤트는 캡처링단계와 버블링 단계를 밟으며 감지가 됩니다. JSFiddle 내부 Result 탭에서 box나 button을 누르면 alert기능이 캡처링과 버블링 과정을 거치며 발생합니다. 발생할 때마다 모든 요소에 alert기능을 집어넣었기 때문에 Button을 자칫 클릭하실 경우 alert를 10번이나 누르셔야 하니 주의하시기 바랍니다 ㅋㅋ 가장 내부의 Button을 클릭하면 발생하는 일은 body -> html -> form -> div -> button 순으로 캡처링이 발생하고, button -> div -> form -> html -> body 캡처링과 역순으로 버블링이 발생합니다. el.addEventListener('click', () => alert(`capturin..

자바스크립트에서 함수 (function)를 정리해보자 - 1

2023.01.16

이미 공부한 내용을 빠르게 복기하기 위한 노트로, 이 글을 작성하였다. 먼저 이 글은 Arrow function은 다루지 않는데, Arrow Function은 this 바인딩과 함께 깊게 다루고 싶은 내용이기 때문에 일단 제꼈다. 글의 목차 더보기 1. 함수 파라미터 파라미터 기본값 rest 파라미터 2. 콜백 함수 일급 객체, 일급 함수, 고차 함수 3. 객체에서 함수 정의 객체에서 key와 함수 매개변수가 일치하는 경우 4. 생성자 함수 생성자 함수 생성 방법 5. 즉시 실행 함수 즉시 실행 함수의 실행 방법 1. 함수 파라미터 파라미터 기본값 function add(a = 1, b = 1) { return a + b; } add(); // 2 각 매개변수에 값을 설정할 수 있다. 기본값을 설정하지 ..

[javascript] - 이벤트 캡처링, 버블링, 이벤트 위임(event delegation)

자바스크립트에서 함수 (function)를 정리해보자 - 1

티스토리툴바