DOM & BOM
dom tree의 최상위모델 : document
BOM의 최상위 모델 : window 객체는 생략하여 사용 가능
history객체 - 브라우저가 접근했던 url 히스토리 제어
location객체 - 웹문서 url 정보
screen객체 - 사용자의 디스플레이 정보
navigator객체 - 실행중인 브라우저에 대한 정보 확인. 크로스 브라우징 이슈 해결 시 사용
*스크립트파일에 defer 속성 추가하여 last.js용 사용
this
this (호출 대상) - window(기본값)
bind메서드 - this 설정. bind는 한 번만 가능.
화살표 함수의 this
-외부 scope에서 this를 계승받는다
API
privite api & public api
동기 & 비동기
단순하고 비효율적 & 기다리지 않고 효율적
결과를 기다리고 다음 동작을 수행해야 할 때 동기로.
이벤트 전파. 버블링 & 캡처링
이벤트 실행 시 최상단에서 대상 요소까지 캡쳐링, 최상단까지 버블링이 이루어진다.
addEventListener는 버블링이 기본값. true옵션값을 추가하면 캡처링으로 진행됨.
event.stopPropagation();메서드로 이벤트의 전파를 중지시킬 수 있다.
event.preventDefault();메서드는 버튼의 submit기능이나 a태그의 기본 동작을 막을 수 있다.
array API
map(): 배열의 값을 새로운 값으로 콜백
some(): 배열의 값이 조건과 하나 이상 같으면 true를 반환
every(): 배열에 주어진 요소가 모두 같으면 true를 반환
filter(): 배열의 조건에 맞는 요소만 반환
reduce(): 배열의 조건에 맞는 누적값을 결과로 반환
모듈시스템(ES6)
script type='module'로 선언하여 사용.
장점: 유지보수, 네임스페이스화, 재사용성
import, export (default)
*(실제로 사용하면서 자세히 공부해야 할 듯)
