728x90 300x250 2024/0210 이벤트 위임과 바인딩 방식의 차이 $(document).on('click', id, function) / $(id).click(function() { }); $(document).on('click', id, function) 와 $(id).click(function() { });는 모두 jQuery를 사용하여 클릭 이벤트를 처리하는 방식이다. 이 두 가지 방식의 주요 차이점은 이벤트 위임(Event Delegation)과 바인딩(Binding)의 차이다. 1. 이벤트 위임 $(document).on('click', id, function)방식은 이벤트 위임을 사용한다. 여기서 'document'는 이벤트가 바인딩될 요소를 나타낸다. 이벤트는 'document'에서 발생하고, 그 후에 이벤트가 발생한 요소의 'id'에 따라 필터링된다. 따라서 동적으로 생성된 요소에도 이벤트가 적용된다. 이 방식은 요소를 생성 및 제거할 때유용하며, 한 번에 많은 요소에 이벤트.. 2024. 2. 18. 바인딩(Binding)이란? 바인딩(Binding)은 프로그래밍에서 다양한 객체나 데이터를 특정 속성이나 변수오 연결하는 과정을 이미한다. 이는 두 가지 의미로 사용될 수 있다. 1. 데이터 바인딩(Data Binding) : 웹 개발에서 주로 사용되는 용어로, UI와 데이터를 동기화하는 과정을 가리킨다. 이는 데이터의 변경이 UI에 반영되고, UI의 변경이 데이터에 반영되는 것을 의미한다. 예를 들어, 사용자가 입력한 내용이 데이터 모델에 자동으로 반영되고, 데이터 모델의 변경이 화면에 자동으로 반영되는 것이 데이터 바인딩이다. 2. 이벤트 바인딩 : 이벤트 바인딩은 이벤트 핸들러를 특정 요소에 연결하는 것을 의미한다. 에를 들어 사용자가 버튼을 클릭했을 때 발생하는 클릭 이벤트와 이를 처리하는 함수를 연결하는 과정이 이벤트 바인.. 2024. 2. 17. ES6 클래스 상속에서의 constructor ES6에서는 클래스와 extends키워드를 사용하여 좀 더 명싱적이고 간결한 형태로 구현할 수 있다. ES6의 클래스 상속을 사용하는 경우, 자식클래스의 인스턴스가 자신을 생성한 생성자 함수를 참조하는 'constructor'속성은 자식 클래스를 가리킨다. class Parent { constructor() { // ... } } class Child extends Parent { constructor() { super(); // ... } } const myChild = new Child(); console.log(myChild.constructor); // Child 생성자 함수를 참조 ES6클래스 상속에서 특별히 자식 클래스를 가리키도로 설계되었기 때문에 myChild.constructor는 Chi.. 2024. 2. 14. Lottie 사용법 보호되어 있는 글 입니다. 2024. 2. 12. 이전 1 2 3 다음 728x90 반응형