[JavaScript] TIL : DOM - 함수 넘기기와 Node (20/09.02)

Checkpoint : DOM 을 진행했다.

1. 이벤트에 함수를 넘길(할당) 때, 함수명 뒤에 실행괄호() 를 붙이느냐 마느냐에 대한 이슈가 동기들 사이에서 핫(?)했다.
   지난 번 TWIL : DOM 글에서 Javascript파일에서 함수를 할당하는 코드를 작성한 것을 보면, 실행괄호를 붙이지 않은 것을 볼 수 있다.

function callTheCat() {
  return "Hey, Cat!"
};

// 1)이벤트 속성에 바로 함수를 할당.
document.querySelector("#id이름").onclick = callTheCat;

// 2)addEventListner 메소드를 이용해 함수를 할당.
document.querySelector("#id이름").addEventListner("click", callTheCat);

실행괄호를 붙이지 않은 이유는,
실행괄호를 붙여 callTheCat() 으로 넘기게 될 경우, 함수 callTheCat 자체가 아닌
함수 실행값 "Hey, Cat!"을 넘기는 꼴이기 때문이다.
그러니, 코드 작성시 이 점을 인지하고 주의해야할 것!




2. Node란?
DOM을 이용해 요소를 탐색하다 보면, 결과값이 NodeList로 나오는 경우를 볼 수 있는데, Node는 무엇일까?
2-1. Node는 DOM에서, (나는 DOM을 공부 중이니 일단 DOM에서만 한정한다. 다른 많은 타입에서 또한 적용된다.) 가장 시조의 타입이다.
DOM은 Node객체를 그대로 상속받는다.
2-2. Node는 요소들이 부모 자식, 형제 자매로 이루어져있는 구조를 나타내며, 그래서 속성도 이를 기반으로 검색하는 메소드들이 많이 존재한다.
2-3. 내가 써놓고도 말이 어렵다. 그래도 Node가 DOM보다 상위개념이라는 것에 일단 놀랐다. 신기하다.
+) Checkpoint를 진행하고도 조금 어려워 mdn과 생활코딩을 참고했다. 얘도 틈틈히 계속 살펴봐야지 .. ㅎㅎ ..
( mdn reference : Node )
( 생활코딩 : Node 객체 )