22-05-15

노마드코더 바닐라JS 5일차

위 사진처럼 중요한 string을 class로 저장시켜주는 습관이 중요하다.
class 입력에서 실수할 경우 console창에서 문제의 원인을 콕 집어서 알아낼 수 있기 때문.

혹시라도 h1의 class에 다른 class가 추가되거나 하게 되면 오류가 생길 것.
(쿼리셀렉터가 맨 처음에 쓰여있는 다른 클래스를 불러올 것.)
따라서 이를 방지하기 위해 .classList를 사용하고 (전체 class 목록을 참조)
.contains를 활용해 T/F로 있는지 없는지 확인하는 방식으로 코드를 안전하고 클린하게 만든다.

더 놀라운 것은 toggle을 사용하면 위처럼 코드를 더 줄일 수 있다는 것이다.
toggle은 h1에 classList 안에 clicked가 있는지 확인하고, 있으면 없애주고 없으면 추가해주는 녀석이었다.