Week 3. Vanila JS에 관한 문제들을 풀고 부족한 부분 확인하기.
🧐 <8 / 17 화>
-
this
스코프 개념을 잘 알아야 this를 이해할 수 있음. 공부하기!
👉🏻 가깝지만 먼 당신... this 에서 this를 간파했다(?) 사실 1시간이면 정리 끝낼 수 있을거라 생각했는데 생각보다 오래 걸려서 오히려 내가 간파당했다 🙀. -
즉시실행함수
즉시실행함수는window(전역)를 침범하지 않음.
즉시실행 함수를 통해 외부에선 접근을 못하는 내부 함수를 만들어 private한 효과를 줄 수 있음. -
arrow function
arrow function의 this는 자신보다 상위 함수의 스코프를 가리킴.
👉🏻 가깝지만 먼 당신... this 에서 정리완료 -
클로저
내부 함수가 외부 함수의 변수를 참조해, 외부 함수의 수명이 끝나도 내부 함수가 외부 함수의 변수를 사용할 수 있는 것. 오직 내부 함수로만 해당 변수를 사용할 수 있음.
문제를 풀어봤는데, 답이 이거다!라고 확언할 수가 없어서 부족한 부분을 메꿔야겠다고 생각했다.
위에 정리한 글들은 내가 부족하다고 판단한 키워드이다. 평소에도 this에 대해 대충 알고 넘어갔기 때문에 오늘 정리해서 Article을 올려보도록 하겠다.
🧐 <8 / 18 수>
함수형 + 컴포넌트 방식으로 생각하기.
생성자 함수,클래스render 함수,state,setState
일전에 리액트를 통해 상태 관리에 대해 배우고, 컴포넌트 방식으로 코드를 짜는 것에 낯설음을 느꼈었다.
오늘 강의에선 리액트와 마찬가지로 vanila JS를 사용해 상태 관리를 하고, 컴포넌트 방식으로 모듈화(?)를 했는데 생각보다 어려웠다. 비단 리액트뿐 아니라 가장 기본이 되는 vanila js로도 상태관리가 되는구나... 컴포넌트화 시킬 수 있구나...
근데 너무 어렵구나 ㅜ....
태생적으로 익숙하지 않은 것엔 기쁨보단 두려움을 먼저 느끼지만,
함수형 프로그래밍과 마찬가지로 부딪히다보면 어느순간 조금씩 이해가 되는 순간들이 온다.
익숙하지 않은 것이지 못하는 것이 아니다 👏
🧐 <8 / 19 목>
컴포넌트 방식으로 생각하기
다른 곳에 영향을 주지않는 컴포넌트로 나뉘어서 생각하는 것. 👉🏻 재사용 가능
- 해당 컴포넌트에 필요한 기능들만 넣어야 함.
Client Side에서 데이터 저장하기
cookielocalStoragesessionStorageJSON.stringify,JSON.parse
🧐 <8 / 20 금>
Module
import `export default 모듈 이름` from `모듈 이름`;모듈 이름 내에 export default로 내보내진 것을 가져온다.
import * as `아무 이름` from `모듈 이름`;모듈 이름에서 export된 모든 것을 가져온다.
as 뒤에 아무 이름은 아무거나 지어도 ok.
import {export 꺼내기 as 이름바꾸기, export 꺼내기 as 이름바꾸기} from `모듈 이름`;가져온 모듈에서 export된 것중 몇개만 꺼낼 수 있다.
'import' and 'export' may appear only with 'sourceType: module' ⚠️ 오류발생!
해결: 요기
index.js 파일이 모듈을 불러오는 기능을 하기 때문에 type='module'을 지정해주고 다른 파일들의 모듈을 import 하는 식으로 사용한다.
- 비동기
-promise,async,await
