복습하자! 이벤트리스너 실습 문제 혼자서 꼭 다시 다 풀어보자.
this 개념 이해하기
다음주 동기/비동기 개념이 더 어렵다고 하니깐 꼭.. 마무리하자.클로저
- 함수 내부를 예측할 때는 선언된 위치에서 확인해보자
- 변수의 이름에 현혹되지 말자. 사람이 짓기 때문에 같은 이름을 쓸 수도 있음. 의도적으로 쓰기도 함.
순회문
- forEach문은 아이템도 가져오고 인덱스도 가져올 수 있음.
- 어떤때는 for을 쓰고 어떤때는 while을 쓸까? => 보통 for은 몇바퀴 돌 지 알때, while은 모를 때 쓴다고는 하지만 사실 취향차이임.
- for in, for of 에서 const를 쓰는 이유는? 기본 for문은 i를 const로 지정하면 오류남. 그러나 for of 와 each는 내부를 순회하는 것이기 때문에 const를 써도 무방함. i 값이 바뀌는 것이 아니니...
- const를 쓸 수 있는 상황에는 명확하게 const를 써주는 것이 좋음.
배열 메소드 구분하기
1) 배열을 변경하지 않고 정보만 추출하는 메소드
- includes
- charAt
- find
- index[n]
- indexOf
2) 배열 자체를 변경하는 메소드
- push
- pop
- reverse
- sort
- indexOf
3) 원래 배열을 변경하지 않고 새로운 배열을 생성하는 메소드
- map
- filter
- flat //배열안에 있는 배열을 풀어서 나열해주는 것..
- reduce // 배열의 왼쪽부터 두개씩 묶어서 명령한 작업을 실행한다. 배열이 나오는 것이 아니라 반환값이 나옴. 초기 값을 넣어주면 첫번째 인자에 그 상태가 들어옴.
a.reduce(function, 초기값)
This 와 call, bind, apply (이해 못함 ㅎ)
- 함수마다 하나씩 갖고있는 변수라고 생각하면 편함. 예약어로 어떤 값도 들어갈 수 있음.
- this를 활용하는 케이스는 예전보다 훨씬 줄고있음.
- this can be anything
- arrow function 에는 this 사용 불가.
- 전역에 this가 있으면 this 는 window 임.
onClick vs addEventListener
- onclick은 똑같은 것이 두번 있으면, 마지막것만 수행. 반면 addEventListener은 둘 다 실행해줌.
- addEventListener이 나중에 생김
preventDefault() , stopPropagation()
- preventDefault() : 원래 동작되는 기능을 멈추게 해줌.(이벤트에 의한 기본 동작 막기)
- stopPropagation() : 이벤트 요소의 전파를 막음. 자식 요소의 이벤트가 부모 요소에도 적용되는 것을 막아준다.
- 이벤트 버블링 => 읽어보기.
Webstorage / Indexed DB
- Webstorage
- localStorage : 같은 도메인 내에서 데이터가 남아있음. 창이 껐다 켜져도 보존됨. 그러나 데이터를 많이 넣지는 못함. 개인적인 설정과 사용자 임의 세팅에 용이
- sessionStorage : 탭이 열려있는 동안에만 데이터를 저장함. 탭이 달라지면 다름.
- Indexed DB
-- 웹브라우저에서 사용할 수 있는 좀 더 본격적인 데이터베이스
- objectStore라는 개념으로 여러 테이블을 생ㅅ어할 수 있고, 데이터를 조회/갱신/삭제 가능.
- 트랜잭션 지원
- 웹브라우저에 기본 찹재된 NoSQL 데이터베이스
==> 그러나.. 저수준 인터페이스와 노후화된 인터페이스 제공됨.
백엔드개발자