본문 바로가기

programming study/JavaScript

 (186)
25장. 클래스(1) 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 25.1 클래스는 프로토타입의 문법적 설탕인가? JavaScript는 프로토타입 기반의 객체지향 언어 클래스는 프로토타입 기반의 패턴을 클래스 기반 패턴처럼 사용할 수 있도록 하는 문법적 설탕 + 새로운 객체 생성 매커니즘 클래스와 생성자 함수와의 차이 클래스는 new 연산자 없이 호출하면 Error 클래스는 extends, super 와 같은 키워드 제공 클래스는 호이스팅이 발생하지 않는 것처럼 동작(TDZ) 클래스는 기본적으로 strict mode가 지정되어 실행 클래스의 constructor와 프로토타입 메서드, 정적 메서드는 열거 불가 25.2 클래스 정의 클래스는 일급 객체 무명의 리..
24장 클로저(3) 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 24.5 캡슐화와 정보 은닉 캡슐화 : 프로퍼티와 메서드를 하나로 묶는 것 정보 은닉 : 캡슐화를 하여, 객체의 특정 프로퍼티, 메서드를 감출 목적으로 사용 객체의 상태가 변경되는 것을 방지해 정보를 보호, 결합도를 낮춤 JavaScript의 모든 프로퍼티와 메서드는 기본적으로 외부에 공개됨(public) 함수의 지역 변수는 외부에서 참조 및 접근 불가(private) 24.6 자주 발생하는 실수 var의 경우 함수 레벨 스코프 특성상 클로저 생성이 안되는 경우가 있음 let 키워드로 교체하면 해결 var funcs = []; ​ // i는 전역변수 취급되어 최종적으로 3이 할당 for (va..
24장 클로저(2) 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 24.4 클로저의 활용 상태를 안전하게 변경하고 유지하기 위해 사용 상태를 은닉 특정 함수에서만 상태 변경 허용 가변 데이터를 피하고 불변성을 지향하는 함수형 프로그래밍에서 적극 사용 됨 예시 const counter = (function(){ // 즉시 실행 함수 // 클로저를 반환하여 식별자 counter에 할당 let num = 0; // 이 함수의 생명 주기가 끝나도 렉시컬 환경을 기억함 return { increase() { return ++num; } decrease() { return --num; } } }()); 함수형 프로그래밍에서의 예시 // 고차함수 // 함수를 인수를 전달..
24장 클로저(1) 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 24.0 클로저란? MDN: 클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합 클로저는 함수를 일급 객체를 취급하는 함수형 프로그래밍 언어에서 중요한 특성 중첩함수에서 외부 함수의 변수를 참조할 때, 외부 함수의 생명 주기가 다했음에도 불구하고 외부 함수의 식별자를 참조 가능한 것 24.1 렉시컬 스코프 함수를 어디에 정의했는지에 따라 상위 스코프를 결정하는 것 정적 스코프 스코프의 실체는 실행 컨텍스트의 렉시컬 환경 렉시컬 환경은 외부 렉시컬 환경에 대한 참조를 포함 상위 렉시컬 환경과 연결 함수가 정의된 시점에서 외부 렉시컬 환경에 대한 참조가 정해짐 정의된 시점읜 상위 스코프 ===..
23장 실행 컨텍스트(5) 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 23.6 실행 컨텍스트의 생성과 식별자 검색 과정 23.6.1 전역 객체 생성 전역 코드 평가 이전에 전역 객체가 생성 빌트인 전역 프로퍼티 빌트인 전역 함수 표준 빌트인 객체 동작 환경에 따라 클라이언트 사이드 Web API(DOM, BOM, Canvas ..) 특정 환경을 위한 호스트 객체 전역 객체 또한 Object.prototype을 상속 받음 23.6.2 전역 코드 평가 1. 전역 실행 컨텍스트 생성 비어있는 전역 실행 컨텍스트를 생성 실행 컨텍스트 스택에 푸시 이 시점에서 전역 실행 컨텍스트는 컨텍스트의 최상위 즉, 실행 중인 실행 컨텍스트 2. 전역 렉시컬 환경 생성 전역 렉시컬 ..
23장 실행 컨텍스트(4) 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 23.5 렉시컬 환경 식별자, 식별자에 바인딩된 값, 상위 스코프에 대한 참조를 기록하는 자료구조 객체 형태의 스코프(전역, 함수, 블록 스코프)를 생성하여 식별자를 키로 등록하고 바인딩된 값을 관리 23.5.1 실행 컨텍스트의 컴포넌트 실행 컨텍스트는 아래와 같은 컴포넌트로 구성 LexicalEnviroment VariableEnviroment 생성 초기에는 두 컴포넌트 모두 하나의 동일한 렉시컬 환경을 참조 이후 두 컴포넌트는 내용이 달라질 수 있음 23.5.2 렉시컬 환경의 컴포넌트 환경 레코드(Enviroment Record) 스코프에 포함된 식별자를 등록하고 식별자에 바인딩된 값을 관..
23장 실행 컨텍스트(3) 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 23.4 실행 컨텍스트 스택 생성된 실행 컨텍스트는 stack 자료구조로 관리 이를 실행 컨텍스트 스택이라 함 소스 코드 평가 -> 실행 컨텍스트 생성 -> 실행 컨텍스트 스택에 푸시 실행 컨텍스트 스택의 최상위에 존재하는 실행 컨텍스트는 언제나 실행중인 실행 컨텍스트 1. 전역 코드의 평가와 실행 전역 코드 평가 전역 실행 컨텍스트 생성 실행 컨텍스트 스택에 푸시 전역 변수, 전역 함수는 전역 실행 컨텍스트에 등록 전역 코드 실행 변수는 할당, 함수는 호출 2. 함수 코드의 평가와 실행 코드 제어권 함수로 이동 함수 코드 평가 함수 실행 컨텍스트 생성 실행 컨텍스트 스택에 푸시 지역 변수, ..
23장 실행 컨텍스트(2) 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 23.3 실행 컨텍스트의 역할 1. 전역 코드 평가 전역 코드 실행하기 위한 준비 선언문만 먼저 실행 전역 변수와 전역 함수가 실행 컨텍스트가 관리하는 전역 스코프에 등록 var 키워드 전역 변수, 함수 선언문 전역 함수는 전역 객체의 프로퍼티와 메서드가 됨 2. 전역 코드 실행 런타임이 시작되어 전역 코드가 순차적으로 실행 변수에 값 할당 함수가 호출되면 전역 코드의 실행 일시 중단하여 함수 내부 진입 3. 함수 코드 평가 함수 코드를 실행하기 위한 준비 매개변수와 지역 변수 선언문이 먼저 실행 매개변수와 지역 변수가 실행 컨텍스트가 관리하는 지역 스코프에 등록 함수 내부에서 지역 변수처럼 ..

티스토리툴바