[10/28/2022] Today, I Learned

자바스크립트의 기본 개념과 동작 원리를 정확히 이해하는 것이 중요!

개인적인 공부를 하면서 중요한 내용을 정리한 형식이기 때문에 오류가 있을 수 있습니다.
피드백 주시면 정말 감사하겠습니다.

오늘 배운 내용

• DOM
• 이벤트

알고 있던 내용

• DOM은 HTML 문서의 계층적 구조와 정보를 표현하며 이를 제어할 수 있는 API, 즉 프로퍼티와 메서드를 제공하는 트리 자료구조다
• id 값은 HTMl 문서 내에서 유일한 값이어야 하며, class 어트리튜브와는 달리 공백 문자로 구분하여 여러개의 값을 가질 수 없다
• getElementById 메서드는 언제나 단 하나의 요소 노드를 반환한다

몰랐던 내용

• innerText 프로퍼티는 CSS에 순종적이다 예를 들어, innerText 프로퍼티는 CSS에 의해 비표시로 지정된 요소 노드의 텍스트를 반환하지 않는다
• innerText 프로퍼티를 사용한 DOM 조작은 구현이 간단하고 직관적이라는 장점이 있지만 크로스 사이트 스트립팅 공격에 취약한 단점도 있다
• 요소 노드의 초기 상태는 어트리뷰트 노드가 관리하며, 요소 노드의 최신 상태는 DOM 프로퍼티가 관리한다
  
• 첫 번째로 바인딩된 이벤트 핸들러는 두 번째 바인딩된 이벤트 핸들러에 의해 재할당되어 실행되지 않는다
  
• 이벤트 핸들러 내부의 this는 이벤트 객체의 currentTarget 프로퍼티와 같다
• 화살표 함수로 정의한 이벤트 핸들러 내부의 this는 상위 스코프의 this를 가리킨다
• 이벤트 핸들러는 비동기 처리 방식으로 동작하지만 dispatchEvent 메서드는 이벤트 핸들러를 동기 처리 방식으로 호출한다