# 20210318(목)

## 2021-03-18

### 1. 학습 날짜

* 2021-03-18

### 2. 학습 시간

* 12:00 \~ 16:00

### 3. 학습 범위 및 주제

* 자바스크립트의 이벤트
* 자바스크립트에서의 문과 식

### 4. 학습 목표

* 자바스크립트에서 이벤트를 이해한다. 버블링 문제를 해결하는 방법에 대해 알아본다.
* 자바스크립트에서의 문과 식에 대해 알아보고 정리해보자.

### 5. 학습 정리

* [자바스크립트의 이벤트](https://simian114.gitbook.io/blog/undefined/javascript/root-...-...-click)
* [자바스크립트에서 문과 식](https://simian114.gitbook.io/blog/undefined/javascript/root-...-...-click)

### 6. 상세 학습 내용

* 어제 자바스크립트의 이벤트를 학습하면서 계속 이해가가지 않았던게, 아주 깊속한 곳에서 click 이벤트가 발생하면 이 이벤트가 발생한 객체의 부모를 통하면서 계속 버블링이 되는데 부모에서는 이를 어떻게 끊을지에 대한 방법이었다.
  * 기본적인 방법으로 stopPropagation 메서드가 존재하지만, 이 메서드는 추천되지 않는 방법이라고 공식문서에서도 나와있었다.
  * 그렇다면 도대체 어떻게 해야할까?
  * 그 방법은 해당 객체마다 조건을 사용해서 만약 자식노드에서 발생한 이벤트와 같은 종류가 자신에게서 등록되어 있다면 해당 이밴트가 왔을 때 조건문을 사용해서 거르는 방법이 있었다.
  * 가장 쉬운 방법으로는 자신의 tag 와 event.target.tagName 이 같으면 이벤트를 실행하는 방법이 있다.
  * 이 방법의 문제는 자신의 자식에서 발생한 이벤트도 자신이 처리를 해야한다면, 문제가 생긴다. 왜냐면 해당 방법은 자신이 직접 눌러져야지만 발동되기 때문이다.
  * 이를 해결하기 위한 방법으로 몇 가지 방법이 더 있지만 여기서 정리하지는 않겠다.
* 자바스크립트의 문과 식
  * 얼마전에 모의 면접을 영상으로 볼 기회가 있었는데, 해당 질문이 나왔었다. 그리고 이 질문은 질문 자체를 이해하지 못했어가지고 한번 알아봐야겠다라고 생각을 했고 마침 시간이 붕떠서 잠깐 알아봤다.
  * 식은 모든게 **값** 으로 귀결된다.
  * 문은 인터프리터에게 전달될 명령문이다. 명령문이기 때문에 그 값으로는 존재할 수가 없게 된다. 따라서 아래와 같은 라인에서는 에러가 발생한다.

    ```
    let a = if (true) 3;
    ```

    * 실패하는 이유는 if 는 **제어문** 이기 때문에 어떤 값으로 존재할 수가 없게 된다.

### 7. 오늘 학습 내용에 대한 개인적인 총평

* 흠.. 오늘 하루는 놀았다.

### 8. 다음 학습 계획

* html, css 학습
* 자바스크립트의 문고 식 정리하기