이번 글에서는 자바스크립트의 제너레이터(Generator) 에 대해 마저 알아보겠습니다.제너레이터 정의제너레이터 객체는 제너레이터 함수에 의해 반환되며, 이터러블 프로토콜과 이터레이터 프로토콜을 모두 따릅니다. 쉽게 말해, 제너레이터는 반복문에서 사용할 수 있고 동시에 next()를 호출해 값을 하나씩 꺼낼 수도 있는 객체입니다.제너레이터의 장점먼저, 제너레이터를 사용하는 이유부터 살펴보겠습니다.메모리 효율성: 필요한 시점에만 값을 생성하므로 메모리를 절약할 수 있습니다.Iterable 정의 간소화: Iterable을 간단히 작성할 수 있습니다.https://goto-helloworld.tistory.com/146 와 비교하면, 왜 간단한지 이해가 가능합니다. 상태 제어 용이: yield를 통해 실행을 ..

Generator에 대해서 MDN은 The Generator object is returned by a generator function and it conforms to both the iterable protocol and the iterator protocol.이렇게 설명합니다. iterable, iterator protocal이 무엇인지 모르니, 우선 해당 프로토콜들을 이해 해보는 시간을 가져봅시다!혹시 아신다면, https://goto-helloworld.tistory.com/147 넘어가주세요.The Iterable Protocol (이터러블 프로토콜)이터러블 프로토콜은 “이 객체를 반복문에서 사용할 수 있는지”를 결정하는 규칙입니다.객체가 이터러블이 되려면 [Symbol.iterator] 메..

클로저는 함수와 그 함수가 선언될 당시의 렉시컬 환경(Lexical Environment)에 대한 참조를 함께 저장하는 구조이다.내부 함수가 실행될 때, 이 참조를 통해 자신이 선언될 당시 주변 스코프의 변수들에 접근할 수 있으며,외부 함수의 실행이 완료된 후에도 해당 변수들이 메모리에 남아있어 접근이 가능하다. 더보기렉시컬 환경"함수나 블록이 선언될 때, 그 위치에서 접근 가능한 변수들이 담긴 객체" ✅ 렉시컬 환경의 구성1️⃣ 환경 레코드 (Environment Record)현재 스코프(블록/함수 등)에서 선언된 변수(예: var, let, const)를 저장하는 객체.2️⃣ 외부 렉시컬 환경에 대한 참조 (Outer Lexical Environment Reference)상위(외부) 스코프의 렉시컬 ..

this는 JavaScript에서 함수가 호출될 때 결정되는 특별한 키워드이다. JavaScript에서 this는 함수가 어떻게 호출되었는지에 따라 바인딩된다. 선언 위치가 아닌 호출 시점에 따라 결정되므로, 예상과 다른 동작이 발생하기 쉽다. 1. 호출 방식에 따라 달라지는 thisconst obj = { name: 'obj', logThis: function () { console.log(this.name); }};obj.logThis(); // 'obj'const extracted = obj.logThis;extracted(); // undefinedconst wrapper = { name: 'wrapper', call: obj.logThis };wrapper.call(); // 'wra..

실행 컨텍스트(Execution Context)는 자바스크립트 동작의 기반이다.this, 호이스팅처럼 JS에서 특이하게 느껴지는 대부분의 개념과 밀접하게 연결되어 있다.1. 실행 컨텍스트란?실행 컨텍스트는 ECMAScript 엔진이 코드의 실행 상태를 추적하기 위해 사용하는 내부 구조이다. 실행 컨텍스트는 항상 스택으로 관리되며, 새로운 코드(함수, 모듈 등)로 제어가 넘어가면 새로운 컨텍스트가 생성되고 스택에 쌓인다. 2. 실행 컨텍스트의 생성과 구조자바스크립트 엔진은 코드를 실행하기 전에 평가(creation) 단계를 거쳐 실행 컨텍스트를 생성하고, 이후 실행(execution) 단계에서 코드를 실제로 수행한다. ✅ 평가 단계 (Creation Phase)실행 컨텍스트 객체가 생성된다.LexicalE..