본문 바로가기

JavaScript

(98)
[Deep dive] 36장 디스트럭처링 할당 디스트럭처링 할당(destructuring assignment) - 구조화된 배열과 같은 이터러블 또는 객체를 destrucuturing(비구조화)하여 1개 이상의 변수에 개별적으로 할당 - 배열과 같은 이터러블 또는 객체 리터럴에서 필요한 값만 추출하여 변수에 할당할 떄 유용 36.1 배열 디스트럭처링 할당 - 배열 디스트럭처링 할당은 배열의 각 요소를 배열로부터 추출하여 1개 이상의 변수에 할당 - 배열 디스트럭처링 할당의 대상(할당문의 우변)은 이터러블이어야 하며, 할당 기준은 배열의 인덱스 - 할당 연산자 왼쪽에 할당받을 변수를 선언해야함, 이때 변수는 배열 리터럴 형태로 선언 const arr = [1,2,3]; //변수 one,two,three를 선언하고 배열 arr을 디스트럭처링하여 할당 c..
[Deep dive] 35장 스프레드 문법 스프레드 문법(spread syntax) - ...은 하나로 뭉쳐 있는 여러 값들의 집합을 펼쳐서 개별적인 값들의 목록으로 만듬 - 스프레드 문법을 사용할 수 있는 대상은 for ... of문으로 순회할 수 있는 이터러블에 한정 - 스프레드 문법의 결과는 값들의 목록이므로 변수에 할당 불가 // ...[1,2,3]은 [1,2,3]을 개별 요소로 분리 console.log(...[1,2,3]); //1 2 3 //문자열은 이터러블 console.log(...'Hello'); //H e l l o //Map과 Set은 이터러블 console.log(...new Map([['a','1'],['b','2']])); //[ 'a', '1' ] [ 'b', '2' ] console.log(...new Set([1,..
[Deep dive] 34장 이터러블 34.1 이터레이션 프로토콜 - 순회 가능한(iterable) 데이터 컬렉션을 만들기 위해 ESMAScript 사양에서 정의하여 미리 약속한 규칙 - 순회 가능한 데이터 컬렉션을 이터레이션 프로토콜을 준수하는 이터러블로 통일하여 for...of문, 스프레드 문법, 배열 디스트럭처링 할당의 대상으로 사용할 수 있도록 일원화 34.1.1 이터러블 - 이터러블 프로토콜을 준수한 객체 - Symbol.iterator를 프로퍼티 키로 사용한 메서드를 직접 구현 or 프로토타입 체인을 통해 상속받은 객체 const isIterable = v => v !== null && typeof v[Symbol.iterator] === 'function'; //배열,문자열,Map,Set 등은 이터러블 isIterable([])..
[Deep dive] 33장 7번째 데이터 타입 Symbol 33.1 심벌이란? 심벌(symbol) - ES6에서 도입된 7번쨰 데이터 타입으로 변경 불가능한 원시 타입의 값 - 심벌 값은 다른 값과 중복되지 않는 유일무이한 값 - 이름의 충돌 위험이 없는 유일한 프로퍼티 키를 만들기 위해 사용 33.2 심벌값의 생성 33.2.1 Symbol 함수 - 심벌값은 Symbol 함수를 호출하여 생성 - 심벌 값은 외부로 노출되지 않아 확인할 수 없으며, 다른 값과 절대 중복되지 않는 유일무이한 값 //Symbol 함수를 호출하여 유일무이한 심벌 값을 생성 const mySymbol = Symbol(); console.log(typeof mySymbol); //symbol //심벌 값은 외부로 노출되지 않아 확인할 수 없음 console.log(mySymbol); //S..
[Deep dive] 32장 String 32.1 String 생성자 함수 - String 생성자 함수에 인수를 전달하지 않고 new 연산자와 함께 호출하면 [[StringData]] 내부 슬롯에 빈 문자열을 할당한 String 래퍼 객체를 생성 - String 생성자 함수의 인수로 문자열을 전달하면서 new 연산자와 함께 호출하면 [[StringData]] 내부 슬롯에 인수로 전달받은 문자열을 할당한 String 래퍼 객체를 생성 - String 래퍼 객체는 length 프로퍼티와 인덱스를 나타내는 숫자 형식의 문자열을 프로퍼티 키로, 각 문자를 프로퍼티 값으로 갖는 유사 배열 객체 이자 이터러블 - 문자열은 원시 값이므로 변경 불가 - String 생성자 함수의 인수로 문자열이 아닌 값을 전달하면 인수를 문자열로 강제 변환한 후, [[Str..
[Deep dive] 31장 RegExp 31.1 정규 표현식이란? 정규 표현식(regular expression) - 일정한 패턴을 가진 문자열의 집합을 표현하기 위해 사용하는 형식 언어 (formal language) - 문자열을 대상으로 패턴 매칭 기능 제공 - 패턴 매칭 기능 : 특정 패턴과 일치하는 문자열을 검색하거나 추출 또는 치환할 수 있는 기능 - 정규 표현식을 사용하면 반복문과 조건문 없이 패턴을 정의하고 테스트하는 것으로 간단히 체크 31.2 정규 표현식의 생성 1) 정규 표현식 리터럴 - 패턴과 플래그로 구성 const target = 'Is this all there is?'; //패턴:is //플래그: i => 대소문자를 구별하지 않고 검색 const regexp = /is/i; //test 메서드는 target 문자열에..
[Deep dive] 30장 Date 30.1 Date 생성자 함수 - 표준 빌트인 객체인 Date는 날짜와 시간을 위한 메서드를 제공하는 빌트인 객체이면서 생성자 함수 - UTC (협정 세계시 Coordinated Universal Time) : 국체 표준시 - KST (한국 표준시 Korea Standard Time) : UTC + 9시간 - Date 생성자 함수로 생성한 Date 객체는 내부적으로 날짜와 시간을 나타내는 정수값을 가짐 - 1970년 1월 1일 00:00:00(UTC)을 기점으로 Date 객체가 나타내는 날짜와 시간까지의 밀리초를 나타냄 30.2 Date 메서드 메서드명 설명 Date.now UTC을 기점으로 현재시간까지 경과한 밀리초를 숫자로 반환 Date.parse UTC을 기점으로 인수로 전달된 지정시간까지의 밀리초..
[Deep dive] 29장 Math - 표준 빌트인 객체인 Math는 생성자 함수가 아니다 - Math는 정적 프로퍼티와 정적 메서드만 제공 29.1 Math 프로퍼티 29.1.1 Math.PI - 원주율 PI값 반환 29.2 Math 메서드 29.2.1 Math.abs - 인수로 전달된 숫자의 절대값(absolute value)를 반환 29.2.2 Math.round - 인수로 전달된 숫자의 소수점 이하를 반올림한 정수를 반환 Math.round(1.4); //1 Math.round(1.6); //2 Math.round(-1,4); //-1 Math.round(-1.6); //-2 Math.round(); //NaN 29.2.3 Math.ceil - 인수로 전달된 숫자의 소수점 이하를 올림한 정수를 반환 Math.ceil(1.4); //..