Web/JavaScript(36)
-
[JavaScript] 모던 자바스크립트 Deep Dive 25장 - 클래스
클래스는 프로토타입의 문법적 설탕인가? 클래스와 생성자 함수의 몇 가지 차이 클래스를 new 연산자 없이 호출하면 에러가 발생한다. 하지만 생성자 함수를 new 연산자 없이 호출하면 일반 함수로서 호출된다. 클래스는 상속을 지원하는 extends와 super 키워드를 제공한다. 하지만 생성자 함수는 extend와 super 키워드를 지원하지 않는다. 클래스는 호이스팅이 발생하지 않는 것처럼 동작한다. 하지만 함수 선언문으로 정의된 생성자 함수는 함수 호이스팅이, 함수 표현식으로 정의한 생성자 함수는 변수 호이스팅이 발생한다. 클래스 내의 모든 코드에는 암묵적으로 strict mode가 지정되어 실행되며 strict mode를 해제할 수 없다. 하지만 생성자 함수는 암묵적으로 strict mode가 지정되..
2022.08.09 -
[JavaScript] 모던 자바스크립트 Deep Dive 24장 - 클로저
렉시컬 스코프 자바스크립트 엔진은 함수를 어디서 호출했는지가 아니라 함수를 어디에 정의했는지에 따라 상위 스코프를 결정한다. 이를 렉시컬 스코프(정적 스코프)라 한다. 함수 객체의 내부 슬롯 [[Environment]] 렉시컬 스코프를 가능하게 하기 위해 함수는 상위 스코프를 기억해야 한다. 이를 위해 함수는 자신의 내부 슬롯 [[Environment]]에 자신이 정의된 환경, 즉 상위 스코프의 참조를 저장한다. const x = 1; function foo(){ const x = 10; // 상위 스코프는 함수 정의 환경(위치)에 따라 결정된다. // 함수 호출 위치와 상위 스코프는 아무런 관계가 없다. bar(); } // 함수 bar는 자신의 상위 스코프, 즉 전역 렉시컬 환경을 [[Environm..
2022.08.08 -
[JavaScript] 모던 자바스크립트 Deep Dive 23장 - 실행 컨텍스트
소스코드의 타입 소스코드의 타입 설명 전역 코드 전역에 존재하는 소스코드를 말한다. 전역에 정의한 함수, 클래스 등의 내부 코드는 포함되지 않는다. 함수 코드 함수 내부에 존재하는 소스코드를 말한다. 함수 내부에 중첩된 함수, 클래스 등의 내부 코드는 포함되지 않는다. eval 코드 빌트인 전역 함수인 eval 함수에 인수로 전달되어 실행되는 소스 코드를 말한다. 모듈 코드 모듈 내부에 존재하는 소스코드를 말한다. 모듈 내부의 함수, 클래스 등의 내부 코드는 포함되지 않는다. 소스코드의 평가와 실행 모든 소스코드는 실행에 앞서 평가 과정을 거치며 코드를 실행하기 위한 준비를 한다. 자바스크립트 엔진의 2개의 소스코드 평가 과정 1. 소스코드의 평가: 실행 컨텍스트를 생성하고 변수, 함수 등의 선언문만 먼..
2022.08.04 -
[JavaScript] 모던 자바스크립트 Deep Dive 22장 - this
this 키워드 this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. this 바인딩은 함수 호출 방식에 의해 동적으로 결정된다. 함수 호출 방식과 this 바인딩 함수 호출 방식 일반 함수 호출 메서드 호출 생성자 함수 호출 Function.prototype.apply/call/bind 메서드에 의한 간접 호출 일반 함수 호출 기본적으로 this에는 전역 객체가 바인딩된다. function foo(){ console.log("foo is this: ", this); // window function bar(){ console.log("bar is this: ", thi..
2022.08.04 -
[JavaScript] 모던 자바스크립트 Deep Dive 21장 - 빌트인 객체
자바스크립트 객체의 분류 표준 빌트인객체: ECMAScript 사양에 정의된 객체, 자바스크립트 실행 환경과 관계없이 언제나 사용 가능하고 별도의 선언이 필요 없다. 호스트 객체: ECMAScript 사양에 정의되어 있지 않지만 자바스크립트 환경에서 추가로 제공하는 객체를 말한다. 사용자 정의 객체: 표준 빌트인 객체와 호스트 객체처럼 기본 제공되는 객체가 아닌 사용자가 직접 정의한 객체를 말한다. 표준 빌트인 객체 자바스크립트는 Object, String, Number, Boolen, Symbol, Date, Math, RegExp(정규표현식), Array, Map/Set, Fuction, JSON, Error 등 40여 개의 표준 빌트인 객체를 제공 Math, JSON, Reflect을 제외한 표준 ..
2022.07.29 -
[JavaScript] 모던 자바스크립트 Deep Dive 20장 - strict mode
strict mode란? 자바스크립트의 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 잡업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러를 발생시키는 것 strict mode의 적용 전역의 선두 또는 함수의 몸체의 선두에 'use strict';를 추가한다. 전역의 선두에 추가하면 스크립트 전체에 strict mode가 적용 'use strict'; function foo(){ x = 10; // ReferenceError: x is not defined } foo(); function foo(){ 'use strict'; x = 10; // ReferenceError: x is not defined } foo(); function foo(){ x ..
2022.07.29