모던 자바스크립트 Deep Dive

1. 변수란 무엇인가? 왜 필요한가? 변수 : 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름을 말한다. >개발자가 직접 메모리 주소를 통해 값을 저장하고 참조할 필요가 없고, 변수를 통해 안전하게 값을 접근할 수

값 : 식(표현식)이 평가되어 생성된 결과평가 : 식을 해석해서 값을 생성하거나 참조하는 것모든 값은 데이터 타입을 가진다.메모리에 비트의 나열로 저장한다.위와 같이 메모리에 저장된 값은 데이터 타입에 따라 다르게 해석될 수 있다.리터럴 : 사람이 이해할 수 있는 문자

이를 생각하고 들어가자..!데이터 타입 : 값의 종류데이터 타입 마다 확보해야 할 메모리 공간의 크기도 다르고 메모리에 저장되는 2진수도 다르며 읽어 들여 해석하는 방식도 다르다..데이터 타입을 하나씩 살펴보자..JavaScript는 모든 수를 실수로 처리한다.Java

피연산자 : 값 (1, 2, 3,...)연산자 피연산자를 연산하여 새로운 값을 만든다. (+, -, \* ...)산술 연산자 : 피연산자(값)를 대상으로 수학적 계산을 수행해 새로운 숫자 값을 만든다.불가능한 경우 : NaN을 반환한다.이항 산술 연산자 : 2개의 피연

제어문 : 조건에 따라 코드 블록을 실행(조건문)하거나, 반복 실행(반복문)할 때 사용한다. 1. 블록문 블록문 : 0개 이상의 문을 중괄호로 묶은 것 블록문은 언제나 문의 종료를 의미하는 자체 종결성을 갖기 때문에 블록문의 끝에는 세미콜론을 붙이지 않는다. 2.

개발자가 의도적으로 값의 타입을 변환하는 것을 명시적 타입 변환 또는 타입 캐스팅 이라 한다. 자바스크립트 엔진에 암묵적으로 타입이 변환 되는 것을 암묵적 타입 변환 또는 타입 강제 변환 이라 한다.속도 측정결과성능 차이가 크게 없다. 코드의 가독성과 유지보수성을 고려

객체 타입은 다양한 타입의 값을 하나의 단위로 구성한 복잡적인 자료구조다.객체는 0개 이상의 프로퍼티로 구성된 집합이다. 프로퍼티는 키와 값으로 구성된다.프로퍼티 : 객체의 상태를 나타내는 값메서드 : 프로퍼티를 참조하고 조작할 수 있는 동작객체지향 프로그래밍 : 객체

재할당 시, 메모리 공간에서 값이 바뀌는게 아니다.새로운 메모리 공간을 확보한다.재할당한 값을 저장한다.변수가 참조하던 메모리 공간을 변경한다.만약 값이 변한다면, 상태 변경을 추적하기 어렵다.데이터의 신뢰성을 보장하며 이런 특성을 불변성이라 한다.다른 언어는 문자의

일련의 과정을 문으로 구현하고 코드 블록으로 감싸서 실행 단위로 정의한 것.코드의 재사용유지보수의 편의성실수를 줄여 코드의 신뢰성 향상코드의 가독성 향상리터럴은 값을 생성하기 위한 표기법이다. -> 함수 리터럴도 평가되어 값을 생성하며, 이 값은 객체다.즉, 함수는 객

1. 스코프란? 스코프 : 모든 식별자는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유효 범위가 결정되는 것. -> 식별자가 유효한 범위를 말한다. 스코프란 자바스크립트 엔진이 식별자를 검색할 때 사용하는 규칙이라고도 할 수 있다. >

전역 변수를 반드시 사용해야 할 이유를 찾지 못한다면 지역 변수를 사용합시다변수의 생명 주기 : 메모리 공간이 확보된 시점부터 메모리 공간이 해제 되어 가용 메모리 풀에 반환되는 시점까지다.지역 변수의 생명 주기 : 함수의 생명 주기와 일치한다.전역 객체 : 코드가

함수의 코드 블록만을 지역 스코프로 인정하기 때문에 함수 외부에서 var 키워드로 선언한 변수는 코드 블록 내에서 선언해도 모두 전역 변수가 된다.변수 호이스팅에 의해 var 키워드로 선언한 변수는 변수 선언문 이전에 undefined로 참조할 수 있다. 만일 중복 선

1. 내부 슬롯과 내부 메서드 프로퍼티 어트리뷰트를 알기 전 알아야 할 키워드 내부 슬롯과 내부 메서드는 자바스크립트 엔진의 구현 알고리즘을 설명하기 위해 ECMAScript 사양에서 사용하는 의사 프로퍼티와 의사 메서드다. Essential Internal Me

1. Object 생성자 함수 생성자 함수 : new 연산자와 함께 호출하여 객체(인스턴스)를 생성하는 함수 인스턴스 : 생성자 함수에 의해 생성된 객체 Javascript는 Object, String, Number, Boolean, Function, Array..

무명의 리터럴로 생성할 수 있다. 즉, 런타임에 생성이 가능하다.변수나 자료구조에 저장할 수 있다.함수의 매개변수에 전달할 수 있다.함수의 반환값으로 사용할 수 있다.함수가 일급 객체라는 것은 함수를 객체와 동일하게 사용=> 객체는 값이므로, 함수는 값과 동일하게 취급

자바스크립트는 명령형, 함수형, 프로토타입 기반, 객체지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어다. > >자바스크립트를 이루고 있는 거의 "모든 것"이 객체다 1. 객체지향 프로그래밍 객체지향 프로그래밍 : 객체의 상태를 나타내는 데이터와 상태 데이터

자바스크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러를 발생시킨다.strict mode보다 strict mode가 제한하는 오류는 물론 코딩 컨벤션을 설정

표준 빌트인 객체ECMAScript 사양에 정의된 객체이며, 자바스크립트 실행환경과 상관없이 언제나 사용할 수 있다.별도의 선언 없이 전역 변수처럼 언제나 참조할 수 있다. 호스트 객체클라이언트 사이드 Web API를 호스트 객체로 제공하고, Node.js 환경에서는

메서드가 자신이 속한 객체의 프로퍼티를 참조하려면 자신이 속한 객체를 가리키는 식별자를 참조 할 수 있어야 한다.생성한 객체의 경우 메서드 내부에서 메서드 자신이 속한 객체를 가리키는 식별자를 재귀적으로 참조할 수 있다.getDiameter 메서드가 호출되는 시점에는

4가지 타입의 소스코드는 실행 컨텍스트를 생성한다.소스코드의 타입에 따라 실행 컨텍스트를 생성하는 과정과 관리 내용이 다르다.전역 변수를 관리하기 위해 전역 스코프를 생성해야한다.var 키워드로 선언된 전역 변수, 함수 선언문으로 정의된 전역 함수를 전역 객체의 프로퍼

클로저는 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어에서 사용되는 중요한 특성이다. 1. 렉시컬 스코프 렉시컬 스코프 : 자바스크립트 엔진은 함수를 어디에 정의했는지에 따라 상위 스코프를 결정한다. 렉시컬 환경의 "외부 렉시컬 환경에 대한 참조"에 저장할

자바스크립트는 프로토타입 기반 객체지향 언어다.클래스는 생성자 함수와 매우 유사하게 동작하지만 몇 가지 차이가 있다.클래스를 new 연산자 없이 호출하면 에러가 발생한다. 하지만 생성자 함수를 new 연산자 없이 호출하면 일반 함수로서 호출된다.클래스는 상속을 지원하는

ES6 이전의 모든 함수는 일반 함수로서 호출 할 수 있는 것은 물론 생성자 함수로서 호출할 수 있다. 모든 함수는 사용 목적에 따라 명확한 구분이 없으므로 호출 방식에 특별한 제약이 없고 생성자 함수로 호출되지 않아도 프로토타입 객체를 생성한다.이러한 문제를 해결하기

배열 : 여러 개의 값을 순차적으로 나열한 자료구조요소 : 배열이 가지고 있는 값인덱스 : 배열의 요소는 배열에서 자신의 위치를 나타내는 0 이상의 정수배열의 길이를 나타내는 length 프로퍼티를 갖는다.배열은 객체 타입이다.일반 객체과 배열의 구별되는 특징자료구조에

Number 객체는 생성자 함수 객체다. 따라서 new 연산자와 함께 호출하여 인스턴스 생성할 수 있다.PrimitiveValue는 접근할 수 없음. 이는 \[NumberData]를 가리킨다.변환할 수 없다면 NaN1과 1보다 큰 숫자 중에서 가장 작은 숫자와의 차이와

Math는 정적 프로퍼티와 정적 메서드만 제공한다.원주율(PI) 값을 반환한다.인수로 전달받은 숫자의 절대값을 반환한다.인수로 전달받은 숫자의 소수점 이하를 반올림한 정수를 반환한다.인수로 전달받은 숫자의 소수점 이하를 올림한 정수를 반환한다.인수로 전달받은 숫자의 소

Date : 날짜와 시간을 위한 메서드를 제공하는 빌트인 객체이면서 생성자 함수이다.UTC : 국제 표준시KST : 한국 표준시 (UTC + 9시간)1970년 1월 1일 00:00:00(UTC)을 기점으로 Date 객체가 나타내는 날짜와 시간까지의 밀리초를 나타낸다.기

정규 표현식 : 일정한 패턴을 가진 문자열의 집합을 표현하기 위해 사용하는 형식 언어다.패턴 매칭 기능 : 특정 패턴과 일치하는 문자열을 검색하거나 추출 또는 치환할 수 있는 기능대부분의 프로그래밍 언어와 코드에디터에 내장되어 있다.문자열을 대상으로 패턴 매칭 기능을

String 인스턴스 생성할 수 있다.new 연산자와 함께 호출시 \[Primitivevalue] 내부에 인수로 전달받은 문자열을 할당한 String 래퍼 객체를 생성한다.유사 배열 객체이며 이터러블이다.문자열이 아닐경우 문자열로 강제 변환 후, \[StringData

심벌 : ES6에서 도입된 7번째 데이터 타입으로 변경 불가능한 원시 타입의 값이다.심벌 값은 Symbol 함수를 호출하여 생성해야 한다.생성된 심벌 값은 외부로 노출되지 않아 확인할 수 없으며, 다른 값과 절대 중복되지 않는 유일무이한 값이다.new 연산자와 함께 호

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

스프레드 문법(전개 문법) : 하나로 뭉쳐 있는 여러 값들의 집합을 펼쳐서 개별적인 값들의 목록으로 만든다.사용할 수 있는 대상 : for ... 문으로 순회할 수 있는 이터러블에 한정된다.스프레드 문법의 결과는 값이 아니다. 이는 스프레드 문법이 피연산자를 연산하여

디스트럭처링 할당 : 구조화된 배열과 같은 이터러블 또는 객체를 destructuring 하여 1개 이상의 변수에 개별적으로 할당하는 것을 말한다.배열 디스트럭처링 할당의 대상은 이터러블이어야 하며, 할당 기준은 배열의 인덱스다.할당 기준은 프로퍼티 키다. 즉, 순서는

Set 객체는 중복되지 않는 유일한 값들의 집합이다. 배열과 유사하지만 다음과 같은 차이가 있다.Set은 수학적 집합을 구현하기 위한 자료구조다. -> 교집합, 합집합, 차집합, 여집합 등을 구현할 수 있다.Set 생성자 함수는 이터럴블을 인수로 전달받아 Set 객체를

자바스크립트가 가장 많이 사용 되는 분야는 웹페이지/애플리케이션의 클라이언트 사이드다.웹 애플리케이션의 클라이언트 사이드 자바스크립트는 브라우저에서 HTML, CSS와 함께 실행된다.따라서 브라우저 환경을 고려할 때 더 효율적인 클라이언트 사이드 자바스크립트 프로그래밍

DOM : HTML 문서의 계층적 구조와 정보를 표현하며 이를 제어할 수 있는 API, 즉 프로퍼티와 메서드를 제공하는 트리 자료구조다. 1. 노드 HTML 요소와 노드 객체 HTML 요소의 어트리뷰트 -> 어트리뷰트 노드로 변환 HTML요소의 텍스트 콘텐츠 ->