본문 바로가기

독서 목록/모딥다 Modern JS Deep Dive

(36)

[모딥다] 26장 ES6 함수의 추가 기능 🥞 26.1 함수의 구분 ES6 이전의 함수 - 함수는 별다른 구분 없이 다양한 목적으로 사용됨. - 편리해보이지만 실수 유발 & 성능 면에서 손해 - 일반 함수로서 호출할 수 있는 것은 물론 생성자 함수로서 호출할 수 있었음. - 객체에 바인딩 된 함수도 일반 함수 & 생성자 함수로서 모두 호출 가능했음. ES6 이후의 함수 🥞 26.2 메서드 정확한 정의가 생김. 🍯 메서드 - 메서드 축약 표현으로 정의된 함수만을 의미. - 인스턴스를 생성할 수 없는 non-constructor -> 생성자 함수로서 호출할 수 없다. - prototype 프로퍼티가 없고 프로퍼티도 생성하지 않는다. - 자신을 바인딩한 객체를 가리키는 내부 슬롯 [[HomeObject]] 를 갖는다 -> super 키워드를 사용할 수..

[모딥다] 25장 클래스 (1) 🔮 25.1 클래스는 프로토타입의 문법적 설탕인가? 클래스를 제공한다고 해서, 기존의 프로토타입 기반 객체지향 모델을 폐지하고 새롭게 클래스 기반 모델을 제공하는 것은 아님. 사실 클래스는 함수이며, 기존 프로토타입 기반 패턴을 클래스 기반 패턴처럼 사용할 수 있도록 하는 문법적 설탕이라고 볼 수도 있다. 단, 클래스와 생성자 함수는 모두 프로토타입 기반의 인스턴스를 생성하지만, 동일하게 동작하지는 않는다. 클래스는 생성자 함수보다 엄격하며, 생성자 함수에서 제공하지 않는 기능도 제공한다. 클래스 생성자 함수 new 연산자 없이 호출하면 에러남. new 연산자 없으면 -> 일반 함수로 호출 상속을 지원하는 extends 와 super 키워드 지원 지원 안함. 호이스팅이 발생하지 않는 것 처럼 동작 함수 ..

[모딥다] 24장 클로저 클로저는 JS 고유의 개념이 아니다. 함수형 프로그래밍 언어에서 사용하는 중요한 특징이다. 고유의 개념이 아니기 때문에 ECMAScript 사양에 등장하지 않는다. MDN 에서는 아래와 같이 설명한다. 클로저는 함수와 함수가 선언된 렉시컬 환경과의 조합이다. 여기서 기억해야 할 키워드는 : "함수가 선언된 렉시컬 환경" 이다. function out() { const x = 10; function inner() { console.log(x); //10 } inner(); } out(); 중첩함수 내부에서, 자신을 포함하고 있는 외부 함수의 변수에 접근할 수 있다. 만약 inner 함수가 out 함수의 내부에서 정의된 중첩함수가 아니라면, inner 함수를 out 함수 내부에서 호출한다 하더라도, out ..

[모딥다] 23장 실행 컨텍스트 실행 컨텍스트 : JS 의 동작 원리를 담고 있는 핵심 개념. 🥽 23.1 소스코드의 타입 구분하는 이유 : 소스코드의 타입에 따라 실행 컨텍스트를 생성하는 과정과 관리 내용이 다르기 때문. 소스코드의 타입 실행 컨텍스트 전역 코드 전역에 존재하는 소스코드. 전역 실행 컨텍스트 함수 코드 함수 내부에 존재하는 소스코드 함수 실행 컨텍스트 eval 코드 빌트인 전역 함수인 eval 함수에 인수로 전달되어 실행되는 소스코드 (stric mode 에서 스코프 생성) eval 실행 컨텍스트 모듈 코드 모듈 내부에 존재하는 소스코드 모듈 실행 컨텍스트 🥽 23.2 소스코드의 평가와 실행 소스 코드 평가 - 실행 컨텍스트 생성 & 변수, 함수 등의 선언문만 먼저 실행 -> 생성된 변수, 함수 식별자를 스코프에 등록..

[모딥다] 22장 this 🍾 22.1 this 키워드 생성자 함수를 정의하는 시점에는 아직 인스턴스를 생성하기 이전이므로, 생성자 함수가 생성할 인스턴스를 가리키는 식별자를 알 수 없다. 따라서 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 특수한 식별자가 필요하다. => this 제공 this : 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수. : this 를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있음. - JS 엔진에 의해 암묵적으로 생성됨 - this가 가리키는 값, 즉 this 바인딩은 함수 호출 방식에 의해 동적으로 결정됨. this 바인딩 this 와 this 가 가리킬 객체, 즉, 식별자와 값을 연결하는 것. this 는 객체의 프로..

[모딥다] 21장 빌트인 객체 🚀 21.1 자바스크립트 객체의 분류 📌 JS의 객체 3가지 1. 표준 빌트인 객체 - ECMAScript 사양에 정의된 객체를 말하며, 앱 전역의 공통 기능을 제공함. - 실행 환경에 상관없이 언제나 사용할 수 있음 2. 호스트 객체 - 실행환경에서 추가호 제공되는 객체 (윈도우 - DOM, BOM, Canvas..., NodeJs -고유의 API) 3. 사용자 정의 객체 - 기본 제공되는 것이 아닌, 사용자가 직접 정의한 객체 🚀 21.2 표준 빌트인 객체 JS 는 Object, String, Number 등등 40여개의 표준 빌트인 객체를 제공함. 이 중 String, Number, Boolean, Function, Array, Date 는 생성자 함수로 호출해 인스턴스를 생성할 수 있다. (이 때..

[모딥다] 20장 Strict Mode 🌽 20.1 strict mode란? 선언하지 않은 변수의 경우 ReferenceError가 생길 것 같지만, 사실 아님. JS가 암묵적으로 전역 객체에 변수-> 프로퍼티를 동적으로 생성함. => 암묵적 전역 암묵적 전역은 오류 발생의 원인이 될 확률이 높음. 그러니 변수 선언 키워드를 꼭 같이 사용해야함. 하지만 실수는 언제나 발생하는데 -> 이런 잠재적 오류를 발생시키기 어려운 개발 환경을 만드는게 더 근본적인 해결책임. strict mode (엄격 모드) - ES5 부터 추가됨. - JS 의 문법을 좀 더 엄격히 적용 -> 오류를 발생시킬 가능성이 높거나, -> JS 엔진의 최적화 문제에 작업을 일으킬 수 있는 코드에 대해 => 명시적인 에러를 발생시킴. ESLint - strict mode 와 유..

[모딥다] 19장 (2) 프로토타입 🍒 19.8 오버라이딩과 프로퍼티 섀도잉 프로토타입 프로퍼티와 같은 이름의 프로퍼티를 인스턴스에 추가하면 -> 덮어쓰는 것이 아니라 인스턴스 프로퍼티로 추가한다. 인스턴스 메서드가 프로토타입 프로퍼티를 오버라이딩 했고, 프로토타입 메서드는 가려진다. => 이렇게 상속 관계에 의해 프로퍼티가 가려지는 현상 :: 프로퍼티 섀도잉 📌 오버라이딩 : 상위 클래스가 가지고 있는 메서드를 하위 클래스가 재정의하려 사용하는 방식 📌 오버로딩 : 함수의 이름은 동일하지만, 매개변수의 타입 or 개수가 다른 메서드를 구현하고, 매개변수에 의해 메서드를 구별하여 호출하는 방식. JS 는 오버로딩은 지원하지 않지만 arguments 객체를 사용하여 구현할 수는 있다. 프로토타입의 메서드를 삭제하려고 시도 -> 인스턴스 메서..

이전 1 2 3 4 5 다음

728x90

티스토리툴바