모던 자바스크립트 Deep Dive

프로그래밍 컴퓨터에게 실행을 요구하는 일종의 커뮤니케이션 프로그래밍에 앞서 요구사항을 명확히 이해하고 적절한 문제 해결 방안 정의가 필요하며 이 때 요구되는 능력이 문제 해결 능력이다. 0과 1밖에 알지 못하는 기게가 실행할 수 있을 정도로 정확하고 상세하게 요구

1995년, 웹페이지의 보조적인 기능을 수행하기 위해 브라우저에서 동작하는 경량 프로그래밍을 위한 목적으로 넷스케이프 커뮤니케이션즈(Netscape communications) 브렌던 아이크(Brendan Eich)에 의해 최초의 자바스크립트가 개발되었고, 현재 모든

변수는 프로그래밍 언어에서 데이터를 관리하기 위한 핵심 개념이다.프로그래밍 언어는 기억하고 싶은 값을 메모리에 저장하고, 저장된 값을 읽어들여 재사용하기 위해 변수라는 메커니즘을 제공한다.즉, 변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 메모리 공간

값(value)은 식(표현식: expression)이 평가(evaluate)되어 생성된 결과를 말한다.여기서 평가란 식을 해석하여 값을 생성하거나 참조하는 것을 의미한다.아래 코드에서 10 + 20이라는 표현식이 평가되어 30이라는 값이 변수에 저장된다.모든 값은 데이

데이터 타입은 값의 종류를 말한다.자바스크립트(ES6+)는 7개의 데이터 타입을 제공하고 원시타입과 객체타입으로 분류한다.C나 자바의 경우, 정수와 실수 를 구분해서 다양한 숫자 타입을 제공하지만 자바스크립트는 하나의 숫자 타입만 존재한다.ECMAScript 사양에 따

연산자(operator)는 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입, 지수 연산 등을 수행해 하나의 값을 만든다.이 때 연산의 대상을 피연산자(operand)라 한다.피연산자는 값으로 평가될 수 있는 표현식이어야 한다. 피연산자와 연산자의 조합으

제어문은 조건에 따라 코드 블록을 실행하거나 반복 실행할 때 사용한다.일반적으로 코드는 위에서 아래 방향으로 순차적으로 실행되지만 제어문을 사용하면 코드의 실행 흐름을 인위적으로 제어할 수 있다.코드의 실행 순서가 변경된다는 것은 직관적인 코드의 흐름을 혼란스럽게 만든

개발자가 의도적으로 값의 타입을 변환하는 것을 명시적 타입 변환(explicit coercion) 또는 타입 캐스팅(type casting)이라 한다.자바스크립트에서는 개발자의 의도와는 상관없이 표현식을 평가하는 도중에 자바스크립트 엔진에 의해 암묵적으로 타입이 자동

자바스크립트는 객체 기반의 프로그래밍 언어이며, 자바스크립트를 구성하는 거의 모든 것이 객체다. 원시 값을 제외한 나머지 값(함수, 배열, 정규 표현식 등)은 모두 객체다.원시 타입은 단 하나의 값만 나타내지만 객체 타입은 다양한 타입의 값(원시 값 또는 다른 객체)을

자바스크립트에는 6개의 원시 타입과 객체 타입으로 총 7개의 데이터 타입이 존재한다.원시 타입의 값은 변경 불가능한 값(immutable value)이다. 한번 생성된 원시 값은 읽기 전용 값으로서 변경할 수 없다.변수의 값을 변경할 수 없다는 것을 구체적으로 분석해보

프로그래밍 언어의 함수는 일련의 과정을 문으로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것이다.프로그래밍 언어의 함수도 입력을 받아서 출력을 내보낸다. 이때 함수 내부로 입력을 전달받는 변수를 매개변수(parameter), 함수 호출 시 입력을 인수(a

스코프란? 스코프(유효범위)는 자바스크립트를 포함한 모든 프로그래민 언어의 기본적이며 중요한 개념이다. 모든 식별자는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유효 범위가 결정된다. 즉 스코프는 식별자가 유효한 범위를 말한다.

전역 변수의 무분별한 사용은 위험하다.전역 변수를 반드시 사용해야 할 이유를 찾지 못한다면 지역 변수를 사용해야 한다.변수는 선언에 의해 생성되고 할당을 통해 값을 갖는다. 그리고 언젠가 소멸하는 생명 주기가 있다.생명 주기가 없다면 한번 선언된 변수는 프로그래밍을 종

ES5까지 변수를 선언할 수 있는 유일한 방법은 var 키워드를 사용하는 것이었다.위 과정에서 에러는 발생하지 않는다, 동일한 이름의 변수가 존재하는지 모르고 중복 선언한다면 의도치 않게 값이 변경되는 부작용이 발생한다.var 키워드로 선언한 변수는 오로지 함수의 코드

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

객체 리터럴에 의한 객체 생성 방식은 가장 일반적이고 간단한 객체 생성 방식이다. 그 외에도 생성자 함수를 사용하여 객체를 생성하는 방식이 존재하는데 이 방법들에 대해 장단점을 이해하자.new 연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환한

아래와 같은 조건을 만족하는 객체를 일급 객체라고 한다.런타임에 무명의 리터럴로 생성할 수 있다.변수나 자료구조(객체, 배열)에 저장할 수 있다.함수의 매개변수에 전달할 수 있다.함수의 반환값으로 사용할 수 있다.자바스크립트의 함수는 위의 조건을 모두 만족하므로 일급

자바스크립트는 명령형, 함수형, 프로토타입 기반 객체지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어이다. C++, 자바와 같은 클래스 기반 객체지향 프로그래밍 언어의 특징인 클래스와 상속, 캡슐화를 위한 public, private, protected 키워드

위 코드를 봤을 때 전역 스코프에도 x변수의 선언이 존재하지 않기 때문에 referenceError를 발생시킬 것 같지만 자바스크립트 엔진은 암묵적으로 전역 객체에 x 프로퍼티를 동적 생성한다.이때 전역 객체의 x 프로퍼티는 마치 전역변수처럼 사용할 수 있다. 이러한

자바스크립트 객체는 다음과 같이 크게 3개의 객체로 분류할 수 있다.표준 빌트인 객체표준 빌트인 객체는 ECMAScript 사양에 정의된 객체이므로 자바스크립트 실행 환경(브라우저나 node.js)과 관계없이 언제나 사용할 수 있다.표준 빌트인 객체는 전역 객체의 프로

실행 컨텍스트는 자바스크립트의 동작 원리를 담고 있는 핵심 개념이다.실행 컨텍스트를 바르게 이해하면 아래와 같은 다양한 자바스크립트의 핵심 동작 방식들을 이해할 수 있다.스코프 기반의 식별자와 식별자에 바인딩된 값을 관리하는 방식호이스팅이 발생하는 이유클로저의 동작 방

클로저는 자바스크립트 고유의 개념이 아니라 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어에서 사용되는 중요한 특성이다.MDN에서는 클로저에 대해 다음과 같이 정의하고 있다.A closure is the combination of a function and the

클래스는 프로토타입의 문법적 설탕인가? 자바스크립트는 프로토타입 기반 객체지향 언어이다. 비록 전통적인 다른 객체지향 언어와의 차이점은 분명히 존재하지만 자바스크립트는 강력한 객체지향 프로그래밍 능력을 지니고 있다.

ES6 이전까지 자바스크립트의 함수는 별다른 구분 없이 다영한 목적으로 사용되었다.일반적인 함수로 호출이 가능하다.new 연산자와 함께 호출하여 인스턴스를 생성할 수 있는 생성자 함수로 호출이 가능하다.객체에 바인딩되어 메서드로서 호출이 가능하다.위와 같은 다양한 목적

배열이란? 배열은 여러 개의 값을 순차적으로 나열한 자료구조이다. 배열이 가지고 있는 값을 **요소(element)** 라고 부른다. **자바스크립트의 모든 값은 배열의 요소가 될 수 있다.** 즉, 원시값은 물론 객체, 함수, 배열 등 자바스크립트에서 값으로 인정

표준 빌트인 객체인 Number 는 원시 타입인 숫자를 다룰 때 유용한 프로퍼티와 메서드를 제공한다.표준 빌트인 객체인 Number 객체는 생성자 함수 객체다. 따라서 new 연산자와 함께 호출하여 Number 인스턴스를 생성할 수 있다.Number 생성자 함수에 인수

표준 빌트인 객체인 Math는 수학적인 상수와 함수를 위한 프로퍼티와 메서드를 제공한다.Math는 생성자 함수가 아니다. 따라서 정적 프로퍼티와 정적 메서드만 제공한다.원주율 PI값을 반환한다.Math.abs메서드는 인수로 전달된 숫자의 절대값을 반환한다.절대값은 반드

로그 데이터의 시간 비교에 대한 나의 포스팅표준 빌트인 객체인 Data는 날짜와 시간을 위한 메서드를 제공하는 빌트인 객체이면서 생성자 함수다.UTC(협정 세계시)는 국제 표준시를 말하며 기술적인 표기에는 UTC가 사용된다.KST(한국 표준시)는 UTC에 9시간을 더한

정규 표현식은 일정한 패턴을 가진 문자열의 집합을 표현하기 위해 사용하는 형식 언어이다.정규 표현식은 문자열을 대상으로 패턴 매칭 기능을 제공한다. 패턴 매칭 기능이란 특정 패턴과 일치하는 문자열을 검색하거나 추출 또는 치환할 수 있는 기능을 말한다.정규 표현식을 사용

표준 빌트인 객체인 String은 원시 타입인 문자열을 다룰 때 유용한 프로퍼티와 메서드를 제공한다.표준 빌트인 객체인 String 객체는 생성자 함수 객체다. 따라서 new 연산자와 함께 호출하여 String 인스턴스를 생성할 수 있다.String 생성자 함수에 인수

심벌이란 ? 심벌은 ES6에서 도입된 7번째 데이터 타입으로 변경 불가능한 원시 타입의 값이다. 심벌 값은 다른 값과 중복되지 않는 유일무이한 값이다. 따라서 주로 이름의 충돌 위험이 있는 유일한 프로퍼티 키를 만들기 위해 사용한다. 프로퍼티 키로 사용할 수 있

ES6에서 도입된 이터레이션 프로토콜은 순회 가능한 데이터 컬렉션(자료구조)을 만들기 위해 ECMAScript 사양에 정의하여 미리 약속한 규칙이다.ES6에서는 순회 가능한 데이터 컬렉션을 이터레이션 프로토콜을 준수하는 이터러블로 통일하여 for...of 문, 스프레드

ES6에서 도입된 스프레드 문법(전개 문법) ...은 하나로 뭉쳐 있는 여러 값들의 집합을 펼쳐서 개별적인 값들의 목록을 만든다.사용할 수 있는 대상은 for...of 문으로 순회할 수 있는 이터러블에 한정된다.스프레드 문법 ...이 연산자가 아니기 때문에 변수에 할당

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

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