7장 클래스7-1. 클래스와 인스턴스의 개념 이해음식은 과일의 상위 클래스, 과일은 음식의 하위클래스하위 개념은 상위 개념을 포함하면서 더 구체적인 개념을 가짐클래스는 하위로 갈수록 상위 클래스의 속성을 상속하면서 더 구체적인 요건이 추가/변경됨인스턴스(instance) : 어떤 클래스의 속성을 지니는 실존하는 개체사례 : 어떤 조건에 부합하는 구체적인 예시한 인스턴스는 하나의 클래스만을 바탕으로 만들어짐위 사진에서 감귤, 오렌지, 레몬 등이 해당프로그래밍에서는 클래스가 먼저 정의돼야만 그로부터 공통적인 요소를 지니는 개체들을 생성할 수 있음7-2. 자바스크립트의 클래스자바스크립트는 프로토타입 기반의 언어이므로 클래스의 개념 존재 X프로토타입 체이닝에 의한 참조로 클래스와 유사한 기능을 구현한 것인스턴스..

6장 프로토타입클래스 기반 언어 : 상속을 사용자바스크립트프로토타입(prototype) 기반 언어어떤 객체를 원형(prototype)으로 삼고 이를 참조함으로써 상속과 비슷한 효과6-1. 프로토타입의 개념 이해6-1-1. constructor, prototype, instancevar instance = new Constructor();어떤 생성자 함수를 new 연산자와 함께 호출하면Constructor에서 정의된 내용을 바탕으로 새로운 인스턴스 생성새롭게 생성된 인스턴스에는 __proto__ 라는 프로퍼티가 자동으로 부여이 프로퍼티는 Constructor의 prototype 이라는 프로퍼티를 참초🔍 prototype 과 __proto__prototype객체인스턴스가 사용할 메서드 저장생성자 함수로부터..

05장 클로저5-1. 클로저의 의미 및 원리 이해💡 클로저(Closure)Closure : 닫혀있음, 폐쇄성, 완결성자바스크립트 고유 개념 X, 함수형 프로그래밍 언어의 보편적인 특성A closure is the combination of a function and the lexical environment within which that function was declared.클로저는 함수와 그 함수가 선언될 당시의 lexical environment의 상호관계에 따른 현상 (MDN)lexicalEnvironment 중에서도 outerEnvironmentReference에 해당lexicalEnvironment의 environmentRecord와 outerEnvironmentReference에 의해 변..

4장 콜백 함수4-1. 콜백 함수란?콜백 함수 (callback function)다른 코드의 인자로 넘겨주는 함수(with 제어권)함수의 제어권이 위임받은 코드에게 있음제어권 - 호출 시점, 인자callback : 부르다, 실행하다 call + 뒤돌아오다, 되돌다 back → 되돌아 호출해달라.콜백 함수를 위임받은 코드가 자체적인 내부 로직에 의해 콜백 함수를 적절한 시점에 실행4-2. 제어권4-2-1. 호출 시점콜백 함수 예제 - setInterval()var intervalID = scope.setInterval(func, delay[, param1, param2, ...]);scope : window 객체 (생략하고 함수처럼 사용)delay(밀리초)마다 func 실행하며 리턴값 없음반복적으로 실행되..

3장 this3-1. 상황에 따라 달라지는 thisjs에서 this는 실행 컨텍스트가 생성될 때 함께 결정됨함수를 호출할 때 결정3-1-1. 전역 공간에서의 this전역 공간에서의 this : 전역 객체전역 컨텍스트를 생성하는 주체가 전역 객체브라우저 환경 this: windowNode.js: globalvar a = 1;console.log(a); // 1console.log(window.a); // 1console.log(this.a); // 1전역변수 선언 시 js 엔진은 전역객체의 프로퍼티로 할당js의 모든 변수는 특정 객체의 프로퍼티로서 동작하기 때문특정 객체란 실행 컨텍스트의 LE실행 컨텍스트는 변수를 수집해서 LE의 프로퍼티로 저장전역 컨텍스트 LE는 전역 객체를 그대로 참조console에 ..

2장 실행 컨텍스트실행할 코드에 제공할 환경 정보들을 모아놓은 객체2-1. 실행 컨텍스트란?🔍 스택후입선출stack overflow : Stack 영역의 메모리가 지정된 범위를 넘어갈 때 발생🔍 큐선입선출실행 컨텍스트동일한 환경에 있는 코드들을 실행할 때 필요한 환경 정보들을 모아 컨텍스트 구성동일한 환경전역공간, 함수 등이를 콜 스택(call stack)에 쌓아 올리고가장 위에 쌓여있는 컨텍스트와 관련 있는 코드들을 실행하여 전체 코드의 환경과 순서를 보장실행 컨텍스트와 콜 스택// ---------------------------- (1) var a = 1; function outer() { function inner() { console.log(a); // undefined var a = ..

01장 데이터 타입1-1. 데이터 타입의 종류기본형Number, String, booleannull, undefinedSymbol(ES6)값이 담긴 주솟값을 바로 복제불변성참조형ObjectArrayFunction, Date, RegExpMap, WeakMap, Set, WeakSet(ES6)모두 객체의 하위 분류에 속함값이 담긴 주솟값들로 이루어진 묶음을 가리키는 주솟값을 복제1-2. 데이터 타입에 관한 배경지식1-2-1. 메모리와 데이터비트는 고유한 식별자를 통해 위치를 확인비트 → 바이트(8비트)자바, C언어 등 정적 타입 언어는 메모리의 낭비를 최소화하기 위해 데이터 타입별로 할당할 메모리 영역이 다름js는 메모리 용량이 월등히 커진 상황에서 등장메모리 공간에 엄격하지 않아 형변환에 대한 복잡도가 ..

❓ Optional chaining이란 옵셔널 체이닝은 중첩된 객체의 속성에 대해 안전하게 접근할 수 있도록 도와주는 연산자이다. ✅ 점 표기법을 통해 객체 프로퍼티 접근하기 일반적으로 객체의 프로퍼티는 점 표기법을 통해서 접근한다. 아래 코드를 살펴보자. // 1번 const user1 = { name: 'Captain', cat: { name: 'Crew', breed: 'British Shorthair', } } console.log(user1.cat.name); // Crew // 2번 const user2 = { name: 'Young', } console.log(user2.cat); // undefined console.log(user2.cat.name); // TypeError: Cannot..