모던 자바스크립트 딥다이브

제목에서 보듯이 원시 타입과 객체 타입으로 구분 하는 이유가 무엇일까요,,?원시 타입과 객체 타입은 근본적으로 다르다는 의미일 것입니다.원시 타입의 값은 변경 불가능한 값(immutable value)입니다.객체 타입은 변경 가능한 값(mutable value)입니다.

객체란..?{}안에 0개의 프로퍼티로 구성된 집합이다.프로퍼티는 키와 값으로 구성된다.자바스크립트에는 원시 타입의 값과 객체 타입으로 나뉜다.원시 타입의 값은 변경 불가능한 값(immutable value)이지만, 객체 타입의 값 즉, 객체는 변경 가능한 값(mutab

현재 '모던 자바스크립트 Deep Dive'를 통해 자바스크립트를 학습하고 있습니다. 본 포스트는 해당 내용에 대한 정리를 목적으로 합니다.자바스크립트 엔진이 10 + 20이라는 식의 의미를 해석하면 + 연산을 수행하기 위해 먼저 + 연산자의 좌변화 우변의 숫자 값,

함수는 자바스크립트에서 가장 중요한 핵심 개념이다. 다른 핵심 개념인 스코프, 실행 컨텍스트, 클로저, 생성자 함수에 의한 객체 생성, 메서드, this, 프로토타입, 모듈화 등이 모두 함수와 깊은 관련이 있다. 함수는 자바스크립트를 정확히 이해하고 사용하기 위해 피해

자신이 선언된 위치에 의해 자신이 유효한 범위, 즉 다른 코드가 변수 자신을 참조할 수 있는 범위가 결정된다.스코프는 식별자가 유효한 범위를 말한다.var키워드로 선언한 변수와 let,const로 선언한 변수의 스코프는 다르게 동작한다.자바스크립트 엔진은 이름이 같은

ES5까지 변수를 선언할 수 있는 유일한 방법은 var 키워드를 사용하는 것이었다.var 키워드로 선언한 변수는 중복 선언이 가능하다.var 키워드로 선언한 x 변수와 y 변수는 중복 선언되었다.중복 선언하면 초기화문 유무에 따라 다르게 동작한다. 초기화 문이 있는 경

내부 슬롯과 내부 메서드는 자바스크립트 엔진의 구현 알고리즘을 설명하기 위해 ECMAScript 사양에서 사용하는 의사 프로퍼티와 의사 메서드 이다. 이중 대괄호(\[ ... ])로 감싼 이름들이 내부 슬롯과 내부 메서드이다.내부 슬롯과 내부 메서드는 직접적으로 접근하

new 연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환한다.빈 객체를 생성한 이후 프로퍼티 또는 메서드를 추가하여 객체를 완성할 수 있다.생성자 함수에 의해 생성된 객체를 인스턴스라 한다.Object 생성자 함수를 사용해 객체를 생성하는 방식

무명의 리터럴로 생성할 수 있다. 즉 런타임에 생성이 가능하다.변수나 자료구조(객체, 배열 등)에 저장할 수 있다.함수의 매개변수에 전달할 수 있다.함수의 반환값으로 사용할 수 있다.위와 같은 조건을 만족하는 객체를 일급 객체라고 한다.함수가 일급 객체라는 것은 함수를

프로토 타입 자바스크립트는 명령형, 함수형, 프로토타입 기반 객체지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어다. 자바스크립트를 이루고 있는 거의 모든 것이 객체다. 원시 타입의 값을 제외한 나머지 값들(함수, 배열, 정규표현식 등)은 모두 객체다. 객체지

표준 빌트인 객체ECMAScript 사양에 정의된 객체를 말하며, 자바스크립트 실행 환경(브라우저 또는 Node.js 환경)과 관계없이 언제나 사용할 수 있다. 전역 객체의 프로퍼티로서 제공되며 별도의 선언 없이 전역 변수처럼 ㅇ너제나 참조할 수 있다.호스트 객체ECM

자기 참조 변수생성자 함수 내부에서는 프로퍼티 또는 메서드를 추가하기 위해 자신이 생성할 인스턴스를 참조할 수 있어야 한다.생성자 함수로 인스턴스를 생성하려면 먼저 생성자 함수가 존재해야 한다.생성자 함수 정의new 키워드로 인스턴스 생성생성자 함수 정의 부분에서는 자

자바스크립트의 동작 원리를 담고 있는 핵심 개념이다. 실행 컨텍스트를 이해하면 자바스크립트가 스코프를 기반으로 식별자와 식별자에 바인딩된 값을 관리하는 방식과 호이스팅이 발생하는 이유, 클로저의 동작 방식, 태스트 큐와 함께 동작하는 이벤트 핸들러와 비동기 처리의 동작

클로저는 자바스크립트 고유의 개념이 아니다. 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어에서 사용되는 중요한 특성이다.이 같은 현상이 발생하는 이유는 자바스크립트가 렉시컬 스코프를 따르는 프로그래밍 언어이기 때문이다.렉시컬 스코프자바스크립트 엔진은 함수를 어디에

객체를 1개만 만들때는 객체리터럴은 사용하자

ES6 이전의 함수는 동일한 함수라도 다양한 형태로 호출할 수 있다.ES6 이전의 모든 함수는 일반 함수로서 호출할 수 있는 것은 물론 생성자 함수로서 호출할 수 있다. ES6 이전의 모든 함수는 callable이면서 constructor다.callable과 const

밀집 배열동일한 크기의 메모리 공간이 빈틈없이 연속적으로 나열된 자료구조희소 배열 \- 배열의 요소가 연속적으로 이어져 있지 않는 배열자바스크립트는 문법적으로 희소 배열을 허용하지만 사용하지 않는 것이 좋다.희소 배열은 lenght와 배열 요소의 개수가 일치하지

Number 생성자 함수에 인수를 전달하지 않고 new 연산자와 함께 호출하면 \[\[NumberData]] 내부 슬롯에 0을 할당안 Number 래퍼 객체를 생성한다.ES5에서는 \[NumberData]를 \[PrimitiveValue]라 불렀다.new 연산자와 함께

Math는 생성자 함수가 아니다. 따라서 Math는 정적 프로퍼티와 정적 메서드만 제공한다.원주율 PI 값을 반환한다.인수로 전달된 숫자의 절대값을 반환한다. 절대값은 반드시 0 또는 양수이어야 한다.인수로 전달된 숫자의 소수점 이하를 반올림한 정수를 반환한다.인수로

Date 생성자 함수를 인수 없이 new 연산자와 함께 호출하면 현재 날짜와 시간을 가지는 Date 객체를 반환한다. Date 생성자 함수에 연, 월, 일, 시, 분, 초, 밀리초를 의미하는 숫자를 인수로 전달하면 지정된 날짜와 시간을 나타내는 Date 객체를 반환한다

표준 빌트인 객체인 String 객체는 생성자 함수 객체다. 따라서 new 연산자와 함께 호출하여 String 인스턴스를 생성할 수 있다.String 생성자 함수에 인수를 전달하지 않고 new 연산자와 함께 호출하면 \[\[StringData]] 내부 슬롯에 빈 문자열

심벌은 ES6에서 도입된 7번째 데이터 타입으로 변경 불가능한 원시 타입의 값이다. 심벌 값은 다른값과 중복되지 않은 유일무이한 값이다.주로 이름의 충돌 위험이 없는 유일한 프로퍼티 키를 만들기 위해 사용한다.심벌 값은 Symbol 함수를 호출하여 생성한다. 이때 생성

ES6에서 도입된 이터레이션 프로토콜은 순회 가능한 데이터 컬렉션을 만들기 위해 ECMAScript 사양에 정의하여 미리 약속한 규칙이다.ES6 이전의 순회 가능한 데이터 컬렉션, 즉 배열, 문자열, 유사 배열 객체, DOM 컬렉션 등은 통일된 규약 없이 각자 나름의

스프레드 문법(전개 문법) ...은 하나로 뭉쳐 있는 여러 값들의 집합을 펼쳐서(전재, 분산하여, spread) 개별적인 값들의 목록으로 만든다.스프레드 문법을 사용할 수 있는 대상은 Array, String, Map, Set, DOM 컬렉션 등등 for...of 문으

구조 분해 할당은 구조화된 배열과 같은 이터러블 또는 객체를 구조 파괴하여 1개 이상의 변수에 개별적으로 할당하는 것을 말한다.배열의 각 요소를 배열로부터 추출하여 1개 이상의 변수에 할당한다.배열 디스트럭처링 할당의 대상(할당문의 우변)은 이터러블이어야 하며, 할당

Set 객체는 중복되지 않은 유일한 값들의 집합이다. Set 객체는 배열과 유사하지만 다음과 같은 차이가 있다.Set 객체의 특성은 수학적 집합의 특성과 일치한다. Set은 수학적 집합을 구현하기 위한 자료구조다. Set을 통해 교집합, 차집합, 여집합 등을 구현할 수

브라우저가 HTML, CSS, 자바스크립트로 작성된 텍스트 문서를 어떻게 파싱(해석)하여 브라우저에 렌더링하는지 살펴보자.파싱(parsing)파싱은 프로그래밍 언어의 문법에 맞게 작성된 텍스트 문서를 읽어 들여 실행하기 위해 텍스트 문서의 문자열을 토큰으로 분해하고,