평행우주 : world 1

브라우저 렌더링 과정 1. 브라우저는 HTML, CSS, 자바스크립트, 이미지, 폰트 파일 등 렌더링에 필요한 리소스를 요청하고, 서버로부터 응답 받는다 2. 브라우저의 렌더링 엔진은 서버로부터 응답된 HTML과 CSS을 파싱하여 DOM과 CSSOM을 생성하고 이들을 결합해 렌더 트리를 생산한다 3. 브라우저의 자바스크립트 엔진은 서버로부터 응답된 자바스크립트를 파싱하여, AST를 생성하고 바이트 코드로 변환하여 실행한다 이때, 자바스크립트는 DOM API를 통해 DOM이나 CSSOM을 변경할 수 있다. 변경된 DOM과 CSSOM은 다시 렌더 트리로 결합된다 4. 렌더 트리를 기반으로 HTML요소의 레이아웃(위치와 크기)을 계산하고 브라우저 화면에 HTML요소를 페인팅한다 브라우저의 핵심 기능 필요한 리..

내장 고차함수 이해하기 🕸 filter 배열의 각 요소가 특정 논리(함수)에 따르면, 사실(boolean)일 때 따로 분류 (filter). 코드 filter는 조건에 맞는 데이터만 분류(filtering) 할 때 사용 const cartoons = [ { id: 1, bookType: 'cartoon', title: '식객', subtitle: '어머니의 쌀', createdAt: '2003-09-09', genre: '요리', artist: '허영만', averageScore: 9.66, }, { id: 2, // .. 이하 생략 }, // ... 이하 생략 ]; // 단행본의 모음 const isCreatedAt2003 = function (cartoon) { const fullYear = new ..

콜백 함수란 자바스크립트의 함수는 일급 객체이므로, 함수의 매개변수를 통해 함수를 전달할 수 있다. 함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수를 콜백함수라고 하며, 매개 변수를 통해 함수의 외부에서 콜백 함수를 전달받은 함수를 고차함수라고 한다. 고차 함수란 고차 함수(higher order function)는 함수를 인자(argument)로 받을 수 있고, 함수의 형태로 리턴할 수 있는 함수. 고차함수는 콜백함수를 자신의 일부분으로 합성한다. 콜백 함수를 전달받은 고차 함수는, 함수 내부에서 이 콜백 함수를 호출(invoke) 할 수 있다. 고차함수는 매개변수를 통해 전달받은 콜백함수의 호출시점과 실행 여부를 조건에 따라 결정할 수 있다. 콜백함수는 고차 함수에 의해 호출되며, 이때 고차..

First-class citizen 특별한 대우를 받는 함수 다음과 같은 조건을 만족하는 객체를 일급객체라고 한다 무명의 리터럴로 생성할 수 있다. 즉, 런타임에 생성이 가능하다 변수나 자료구조(객체, 배열 등)에 저장할 수 있다 함수의 매개변수에 전달될 수 있다 함수의 반환값으로 사용될 수 있다 자바스크립트의 함수는 위의 조건을 모두 만족하므로 일급 객체이고 다음과 같은 특징을 갖는다. 함수가 일급 객체라는 것은 함수를 객체와 동일하게 사용할 수 있다는 의미 객체는 값이므로 함수는 값과 동일하게 취급될 수 있다 따라서 자바스크립트에서 함수는 값을 사용할 수 있는 곳 (변수 할당문, 객체의 프로퍼티 값, 배열의 요소, 함수 호출의 인수, 함수 반환문)이라면 어디서든지 리터럴로 정의할 수 있다. 함수를 변..

w

변수 이름은 어디에 등록될까? 변수이름을 비롯한 모든 식별자는 실행 컨텍스트에 등록된다. 실행 컨텍스트란? 자바스크립트 엔진이 소스코들를 평가하고 실행하기 위해 필요한 환경을 제공하고 코드의 실행 결과를 실제로 관리하는 영역 자바스크립트 엔진은 실행 컨텍스트를 통해 식별자와 스코프를 관리 변수 이름과 변수 값은 실행 컨택스트 내에 키/값 형식인 객체로 등록되어 관리된다 자바스크립트 엔진이 변수를 관리하는 매커니즘은 13장(스코프), 23장*실행컨택스트)에서 자세리 살펴본다