바닐라 JS(Vanila JS) 공부

서론

바닐라 자바스크립트(Vanila JS)에 대해 알아보자
리엑트를 공부하다보니 JS를 아예 모르고 넘어가면 안된다고 생각되어 찾아보았다
노마드 코너님의 강의를 듣게 되었고, 강의를 수강하면서 정리한 내용을
이곳에 포스팅하려고 한다

시작해보자

DOM

DOM이란 Document Object Model의 준말으로써
HTML 태그를 하나의 객체로 만들어 접근하는 기술이다
대표적으로 `document.getelementByID(‘id명’)을 사용하면
해당 ID에 있는 태그를 하나의 객체로 취급하고 key값으로 접근하여 사용할 수 있다

ID 뿐만 아니라 클래스 이름 등등으로 선택자를 수행할 수 있고
document.querySelector("선택자(이름)")을 사용해도 가능하다

window

window는 창 자체를 말하는 것이다
즉 window.addEventListener()을 사용하면 창에 일어나는 이벤트를 trigger 할 수 있다
window.addEventListener("resize", EventHandler)를 사용하면 창이 resize될 때마다
EventHandler 함수가 호출된다

함수를 사용할 때도
EventHandler라고 이름만 표기하면 내가 필요한 시점에 호출되는 것이고
EventHandler()라고 사용하면 지금 바로 호출하라는 의미이다
즉, 위에서 resize가 일어나지 않더라도 초기화할 때 한번은 호출된다는 의미다

추가로, addEventListener은 querySelector을 통해 불러온 DOM 객체에도 사용할 수 있다

마무리

여전히 포트폴리오를 만드는 중이다
그래도 블로그 작성하는 것을 아예 손 떼버리기에는 그래서 포스팅을 진행한다
지금 react 포트폴리오에 프로젝트에 내가 한 것들을 올려야하는데
생각보다 나를 보여줄 것이 많지 않아서 골머리를 앓고 있다