[Wed/11/24/2021] Today I Learned

 

1.  Todo List

- Optional Chaining 이해 : 만약 참조가 nullish(null 또는 undefined)라면, 에러가 발생하는 것 대신에 표현식의 리턴 값은 undefined가 된다. 함수 호출에서 사용될 때, 만약 주어진 함수가 존재하지 않는다면, undefined를 리턴한다.

따라서 참조가 누락될 가능성이 있는 경우 연결된 속성으로 접근할 때 더 짧고 간단한 표현식이 생성된다. 어떤 속성이 필요한지에 대한 보증이 확실하지 않는 경우 객체의 내용을 탐색하는 동안 도움이 될 수 있다.

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Optional_chaining

 

- Element.closest 이해 : 현재 element에서 가장 가까운 조상을 반환, 만약 조상이 없다면 null값을 반환 

https://developer.mozilla.org/en-US/docs/Web/API/Element/closest

 

- 지금까지 구현한 기능들을 클래스로 구현 시도 (내일 더 할 예정)

 

2. Hello Coding Algorithm

Chapter 3. 재귀 정독

재귀 함수에서 호출 스택 사용 부분을 특히 중점적으로 정독하였다. 

직접 코드를 쳐 보고, 종이에 스택 자료구조와 재귀를 써 가면서 익히니까 이해가 된 것 같긴 하다.

하지만 아직도 재귀를 활용해서 알고리즘을 푸는 것은 쉽지 않은 일이라, 많은 연습을 해야겠다.

그래도 재귀를 함수의 call stack과 연관지어서 생각하지 못했었는데 이번 장을 읽으면서 그 부분이 어느정도 정리가 되었다. 물론 더 공부를 해야겠지만. 

 

3. 스마트 드롭다운 메뉴 만들기

마우스로 해당 메뉴에 hover되면 0.5초에 한 번씩 mousemove를 감지해서 횟수를 기록해준다. 

- setTimeout 활용하여 비동기 구현 연습 

- DOMContentLoaded 익히기 

- Throttling 구현하기 

https://ko.javascript.info/onload-ondomcontentloaded#ref-390

DOMContentLoaded, load, beforeunload, unload 이벤트

https://www.zerocho.com/category/JavaScript/post/59a8e9cb15ac0000182794fa

(JavaScript) 쓰로틀링과 디바운싱

 

4. 웹개발 툴 기능 익히기 

https://youtu.be/q_rBbcTiSC4

드림코딩 엘리 채널에 올라온 최근 영상을 보면서 개발자 도구의 몰랐던 기능들을 알아갔다.

CSS Overview, Shadow, font, flexbox, grid 등을 손쉽게 조작하고 화면에서 바로 확인할 수 있다.

한 번씩 직접 써보면서 익혀보았고, 아직 익숙해지려면 좀 더 시간이 필요할 것이다. 

다음에 프로젝트를 할 때 유용하게 써봐야겠다. 

---

하루의 대부분의 시간을 앉아서 보내니 자세가 한 번 나빠지면 어깨, 목, 허리 통증이 심해진다.

그리고 눈이 정말 많이 나빠졌다는 게 확연하게 느껴진다. 

공부를 지속할 수 있도록, 건강 관리를 잘 해야겠다는 생각을 매번 하고 있다. 

문제를 해결할 때 바로 누군가에게 정답을 물어보는 게 아닌, 스스로 답을 찾아가는 과정이 어렵기도 하지만 즐거울 때가 많다. 그리고 결국 문제는 스스로 풀어야 문제 해결 능력도 길러질테니.