본문 바로가기

programming study/JavaScript

(186)
36장. 디스트럭처링 할당 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 배열, 이터러블 또는 객체의 구조를 파괴하여 변수에 할당하는 것 필요한 값만 추출하여 변수에 할당할 때 유용 36.1 배열 디스트럭처링 할당 할당 기준은 인덱스 할당할 변수에 기본값 설정 가능 할당할 값이 기본값에 우선 Rest 요소 사용 가능 마지막에 위치해야 함 const cats = ['siru', 'nunu', 'mango']; ​ // 디스트럭처링 할당 const [cat1, cat2, cat3 = 'hoho'] = cats; ​ // Rest요소 // pet1을 할당 후, 나머지 인덱스들의 요소를 pets에 할당(배열) const [pet1, ...pets] = cats; 36.2 ..
34장. 이터러블(2) 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 34.2 빌트인 이터러블 Array String Map Set TypedArray arguments DOM Collection 34.3 for ... of 문 객체의 프로토타입 체인 상에 존재하는 모든 프로토타입 프로퍼티 중에서 프로퍼티 어트리뷰트 [[Enumerable]] 값이 true인 프로퍼티를 순회하며 열거 프로퍼티 키가 심벌인 것은 열거하지 않음 내부적으로 next 메서드를 호출하여 순회 next 메서드가 반환한 이터레이터 리절트 객체의 value 값을 for ... of문 변수에 할당 for (const cat of ['siru', 'nunu', 'mango']) { console...
34장. 이터러블(1) 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 34.1 이터레이션 프로토콜 순회 가능한 데이터 컬렉션을 만들기 위한 ECMAScript 사양에 정의하여 미리 약속한 규칙 ES6 이전 통일된 규약 없음 각자 구조를 가지고 순회 가능 ES6 이후 순회 가능한 데이터 컬렉션을 이터레이션 프로토콜을 준수하는 이터러블로 통일 일원화 이터러블 프로토콜 Symbol.iterator를 프로퍼티 키로 사용한 메서드를 직접 구현 또는 프로토타입 체인을 통해 상속 받은 Symbol.iterator 메서드를 호출 시 이터레이터 프로토콜을 준수한 이터레이터 반환 이를 준수한 객체를 이터러블이라고 함 for...of 문, 스프레드 문법, 배열 디스트럭처링 할당 가..
33장. 7번째 데이터 타입 Symbol 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 33.1 심벌이란? 변경 불가능한 원시 타입의 값 다른 값과 중복되지 않는 유일무이한 값 33.2 심벌 값의 생성 33.2.1 Symbol 함수 Symbol 함수를 호출하여 생성 리터럴로 생성할 수 없음 심벌 값은 외부로 노출되지 않음 암묵적으로 문자열, 숫자 타입으로 변환되지 않음 불리언으로는 암묵적으로 타입 변환 심벌 또한 래퍼 객체를 생성 33.2.2 Symbol.for / Symbol.keyFor 메서드 Symbol.for: 인수로 전달 받은 문자열을 키로 사용하여 키와 심벌 값의 쌍들이 저장되어 있는 전역 심벌 레지스트리에서 키와 일치하는 심벌 값 검색 검색 성공 시 : 검색된 심벌 ..
32장. String 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 원시 타입인 문자열을 다룰 때 유용한 프로퍼티와 메서드 제공 32.1 String 생성자 함수 new 연산자와 함께 호출하여 String 인스턴스 생성 가능 인수 전달하지 않고 호출하면, [[StringData]] 내부 슬롯에 빈 문자열을 할당한 String 래퍼 객체 생성 인수를 전달하면, [[StringData]] 내부 슬롯에 문자열을 할당한 String 래퍼 객체 생성 String 래퍼 객체는 유사 배열 객체, 이터러블 length 프로퍼티, 인덱스를 가짐 new 없이 인수를 전달하면, 문자열을 반환 32.2 length 프로퍼티 접근시, 문자 개수 반환 32.3 String 메서드 원본..
31장. RegExp(2) 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 31.4 플래그 정규 표현식의 검색 방식을 설정하기 위해 사용 총 6개 존재 i(Ignore case): 대소문자 구별하지 않음 g(Global): 대상 문자열 내에서 패턴과 일치하는 모든 문자열 전역 검색 m(Multi line): 행이 바뀌어도 검색 31.5 패턴 문자열의 일정한 규칙을 표현 /(슬래시)로 열고 닫음 메타문자: 특별한 의미를 가지는 문자 31.5.1 문자열 검색 패턴으로 지정한 문자열을 검색 메서드를 사용하여 검색 수행 const regExp = /siru/; ​ const target = 'siru is babo'; ​ regExp.test(target); // true ..
31장. RegExp(1) 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 31.1 정규 표현식이란? 정규표현식: 일정한 패턴을 가진 문자열의 집한을 표현하는 형식 언어 대부분의 프로그래밍 언어와 코드 에디터에 내장 자바스크립트는 펄의 정규 표현식 문법을 도입(ES3) 패턴 매칭 기능 : 특정 패턴과 일치하는 문자열 검색 또는 치환할 수 있는 기능 유효성 검사에 사용(휴대전화, 이메일, 아이디 형식, 비밀번호 형식 등) 31.2 정규 표현식의 생성 정규 표현식 리터럴 패턴과 플래그로 구성 RegExp 생성자 함수 사용하여 객체 생성 변수를 사용ㅎ해 동적으로 RegExp 객체 생성 가능 // 패턴 : cat // 플래그 : i const regexp = /cat/i; ..
30장. Date(2) 본 내용은 모던 자바스크립트 Deep Dive - 자바스크립트의 기본 개념과 동작 원리를 토대로 작성하였습니다. 30.2 Date 메서드 30.2.1 Date.now 1970년 1월 1일 00:00:00(UTC) 기점으로 현재 시간까지 경과한 밀리초 숫자로 반환 30.2.2 Date.parse 1970년 1월 1일 00:00:00(UTC) 기점으로 인수로 전달된 지정 시간 까지의 밀리초를 숫자로 반환 30.2.3 Date.UTC 1970년 1월 1일 00:00:00(UTC) 기점으로 인수로 전달된 지정 시간까지 밀리초를 숫자로 반환 new Date(yaer, month, [, day, hour, minute, second, millisecond])와 같은 형식의 인수를 사용해야 함 30.2.4 Date...