자바스크립트에서 함수가 선언된 렉시컬 스코프를 기억하고, 그 스코프 밖에서도 해당 스코프에 접근할 수 있는 함수(개념)를 말한다. 함수와 그 함수가 선언된 환경을 함께 묶은 개념으로 내부 함수가 외부 함수의 변수에 접근하거나 저장된 값을 유지할 수 있는 특성을 제공한다. 주요 특징 간단히 요약1. 변수 접근: 내부 함수가 외부 함수의 변수에 접근할 수 있다.2. 변수 유지: 외부 함수 실행이 종료되어도 내부 함수는 외부 함수의 변수를 참조한다.3. 데이터 은닉: 클로저를 사용하여 데이터를 외부에서 직접 접근할 수 없도록 보호할 수 있다. 예시function 외부함수(외부매개변수) { return function 내부함수(내부매개변수) { console.log(`외부함수: ${외부매개..

브라우저 구조에 대해 간략히 공부해보자. 1. User Interface (사용자 인터페이스) 사용자가 접근할 수 있는 모든 영역을 말한다. 즉, 페이지를 보여주는 창(사이트)을 제외한 나머지 모든 부분을 말한다. ex: 주소표시줄, 이전이나 다음 혹은 새로고침 버튼등. 2. Browser Engine (브라우저 엔진) User Interface와 Rendering Engine 두 사이의 동작을 제어한다. (연결 부분이 된다.) 자료 저장소(Data Storage)를 참조하고 있어서 로컬에 데이터 저장 및 읽기 등의 작업을 할 수 있다. 3. Rendering Engine (렌더링 엔진) 웹 서버로 부터 받은 자원을 브라우저 상에 표시하기 위한 작업을 한다. 즉, *HTML과 CSS을 파싱하는 동작을 한..

"프론트엔드 전반" 포스팅을보고 공부하면서 요약해보자! CSR(Client Side Rendering)과 SSR(Server Side Rendering) SPA (Single Page Application) 하나의 HTML 파일을 기반 자바스크립트를 이용해 동적으로 화면의 컨텐츠를 바꾸는 방식 MPA (Multiple Page Application) 사용자가 페이지를 요청할 때마다 웹 서버가 요청한 UI와 필요한 데이터를 HTML로 파싱해서 보여주는 방식 전통적인 방식 SPA - CSR MPA - SSR CSR SSR 브라우저의 렌더링 과정 원리 렌더링엔진이 HTML, CSS, Javasript 렌더링 시에 CRP(Critical Rendering PAth) 프로세스로 진행 과정 HTML 파싱, DOM(..
ES10, ES2020 간단하게 알고가기 ES2019(ES10)의 변화 Object.fromEntries Object.entries의 반대 기능 Object.entries는 객체를 2차원 배열로 만들어준다. 2차원 배열을 객체로 만들어준다. 배열말고 Map같은 것도 지원 Array.prototype.flat Array.prototype.flatMap 다중 배열을 펼치는 기능 기본 1단계 펼침 숫자 인수를 넣어 몇 번 연달아 펼칠치 결정 가능 String.prototype.trimStart String.prototype.trimEnd String.prototype.trimLeft String.prototype.trimRight 공백 제거 가능 하위호환을 위해 같은 역할을 하는 메서드를 두개 만들었다고 한다..