JavaScript는 싱글 스레드 언어로, 한 번에 하나의 작업만 처리할 수 있다. 그러나 비동기 작업(예: setTimeout, 이벤트 리스너, AJAX 요청 등)을 통해 병렬적으로 실행되는 작업처럼 보이게 한다. 이를 가능하게 하는 핵심 요소가 Event Loop이다.주요 구성 요소Memory Heap:변수와 객체가 저장되는 메모리 공간.Call Stack:JavaScript가 실행되는 작업 순서를 관리하는 스택 구조.함수 호출이 쌓이고, 실행이 끝나면 제거된다.Web APIs:브라우저 또는 Node.js에서 제공하는 비동기 기능(setTimeout, DOM 이벤트, HTTP 요청 등)을 처리하는 환경.Callback Queue:비동기 작업이 완료된 후 실행 대기 중인 콜백 함수가 저장되는 큐.Eve..

let a = 'a'; // 전역 변수function functionB() { let c = 'c'; // functionB의 지역 변수 c = "c"; // c 값을 다시 설정 console.log(a, b, c); // b는 functionB 내부에서 선언되지 않았으므로 에러 발생 가능}function functionA() { let b = 'b'; // functionA의 지역 변수 functionB(); // functionB 호출 console.log(a, b); // functionA 내에서 a는 전역 변수, b는 functionA의 지역 변수}functionA(); // functionA 호출 코드 실행 결과이 코드 실행 시, 에러가 발생한다.1. 전역..

클로저(Closure)는 자바스크립트의 함수가 자신이 선언된 위치의 환경(Scope)을 기억하는 특성을 말한다. 이 특성 덕분에, 함수 내부에 정의된 내부 함수(Inner Function)는 외부 함수(Outer Function)의 변수와 환경에 접근할 수 있다. 외부 함수가 실행을 완료하더라도 내부 함수는 외부 함수의 변수와 환경을 유지한다.특징내부 함수는 외부 함수의 변수에 접근 가능:외부 함수가 실행을 끝낸 뒤에도 내부 함수는 외부 함수의 변수와 상태를 기억한다.변수의 유효 범위를 확장:클로저는 함수가 호출될 때마다 독립적인 환경을 생성하므로 변수 상태를 유지하거나 보호할 수 있다.function outerFunction(outerVariable) { return function innerFu..

Critical Render Path는 브라우저가 HTML, CSS, JavaScript 등의 리소스를 사용해 웹 페이지를 화면에 렌더링하는 과정이다. 1. HTML Parsing (DOM Tree 생성)HTML 문서를 파싱하여 DOM(Document Object Model) 트리를 생성.DOM은 HTML 문서의 계층적 구조를 표현한다.예: 요소가 다른 요소를 포함하는 관계 등.2. CSS Parsing (CSSOM Tree 생성)CSS 문서를 파싱하여 CSSOM(CSS Object Model) 트리를 생성.CSSOM은 스타일 정보를 구조화한 객체 모델이다.예: 색상, 크기, 위치 등의 스타일 정보.3. Render Tree 생성DOM과 CSSOM을 결합하여 렌더 트리(Render Tree)를 생성...

// 1. 배열 선언const locations = ['서울', '부산', '경기도', '대구'];// 2. for 루프를 사용한 반복 출력console.log("/FOR");for (let i = 0; i for: 기본 반복문으로 인덱스와 요소를 함께 처리하기 적합forEach: 배열의 각 요소와 추가 정보를 쉽게 접근할 수 있다.map: 변환된 배열을 반환하며, 여기서는 단순 출력에 사용되었다.

1. 원시 타입 (Primitive Types)예시: Boolean, String, Number, null, undefined, Symbol원시 타입의 데이터는 변경할 수 없는(immutable) 성질을 가지며, Call Stack에 값 자체로 저장된다. let isFinished = true라고 선언하면, isFinished는 Call Stack에 true라는 값으로 저장된다.2. 참조 타입 (Reference Types)예시: Object, Array참조 타입의 데이터는 Call Stack에 직접 저장되지 않고, Heap 메모리의 주소가 저장된다. Call Stack에는 이 참조 주소가 담겨, 실제 값이 위치한 곳을 가리키게 된다.const enemies = ["Jack Welker", "Gus Fr..