본문 바로가기

Books/모던 JS Deep Dive ✔️49

[모던 JS Deep Dive] 41장 - 타이머 41.1 호출 스케줄링 - 호출 스케줄링: 함수를 명시적으로 즉시 호출하지 않고 일정 시간 경과 이후에 호출되도록 함수 호출 예약 위한 타이머 함수 사용 (호스트 객체, 비동기 처리 방식으로 동작) - setTimeout(): 콜백 함수는 타이머 만료되면 단 한 번 호출됨 - setInterval(): 콜백 함수는 타이머 만료될 때마다 반복 호출됨 41.2 타이머 함수 - setTimeout / clearTimeout - setTimeout - 두 번째 인수로 전달받은 시간(ms)으로 단 한 번 동작하는 타이머 생성, 이후 타이머 만료되면 첫 번째 인수로 전달받은 콜백 함수 호출됨 - delay 시간은 태스크 큐에 콜백 함수 등록하는 시간을 지연할 뿐임 (타이머 만료된다고 즉시 호출 보장 X) - 생성된.. 2022. 1. 26.
[모던 JS Deep Dive] 40장 - 이벤트 40.1 이벤트 드리븐 프로그래밍 - 애플리케이션이 특정 타입의 이벤트에 대해 반응하여 어떤 일을 하고 싶으면 해당 타입 이벤트가 발생했을 때 호출될 함수를 브라우저에게 알려 호출을 위임함 - 언제 함수를 호출할지 알 수 없으므로 개발자가 명시적으로 함수를 호출하는 것이 아니라 브라우저에게 함수 호출을 위임하는 것 - 이벤트 핸들러: 이벤트 발생 시 호출될 함수 - 이벤트 핸들러 등록: 이벤트 발생 시 브라우저에게 이벤트 핸들러의 호출을 위임하는 것 - 이벤트와 그에 대응하는 함수(이벤트 핸들러)를 통해 사용자와 애플리케이션은 상호작용 가능 - 이벤트 드리븐 프로그래밍: 프로그램의 흐름을 이벤트 중심으로 제어하는 프로그래밍 방식 40.2 이벤트 타입 - 마우스 이벤트 - click: 마우스 버튼 클릭 -.. 2022. 1. 25.
[모던 JS Deep Dive] 39장 - DOM 39.0 DOM - DOM: HTML 문서의 계층적인 구조와 정보를 표현, 이를 제어할 수 있는 API, 즉 프로퍼티와 메서드를 제공하는 트리 자료구조 39.1 노드 - HTML 요소와 노드 객체 - 트리 자료구조 - 노드들의 계층 구조 - 비선형 자료구조 - DOM(Document Object Model): 노드 객체들로 구성된 트리 자료구조 - 노드 객체의 타입 (총 12개 종류) - 문서 노드 - DOM 트리 최상위에 존재하는 루트 노드, document 객체 가리킴 - 모든 JS 코드는 전역 객체 window의 document 프로퍼티에 바인딩 되어 있는 하나의 document 객체 공유 - HTML 문서당 document 객체는 유일 - DOM 트리 노드 진입 위한 엔트리 포인트 역할 - 요소 .. 2022. 1. 25.
[모던 JS Deep Dive] 38장 - 브라우저의 렌더링 과정 38.0 브라우저의 렌더링 과정 - 브라우저가 HTML, CSS, JS로 작성된 텍스트 문서를 어떻게 parsing(해석)하여 브라우저에 rendering? - parsing(구문 분석); 텍스트 문서의 문자열을 토큰으로 분해 (어휘 분석) 이후 구문 트리를 생성하는 과정 - rendering; HTML, CSS, JS로 작성된 문서를 파싱하여 브라우저에 시각적으로 출력하는 것 - 브라우저의 렌더링 과정 (Critical Rendering Path) - 브라우저는 HTML, CSS, JS, 이미지, 폰트 파일 등 렌더링에 필요한 리소스를 서버로 요청하고, 응답 받음 - 렌더링 엔진은 서버로부터 응답된 HTML, CSS 파싱하여 DOM과 CSSOM 생성, 결합 -> 렌더 트리 생성 - JS 엔진은 서버로부.. 2022. 1. 21.
반응형

티스토리툴바