본문 바로가기

전체 글492

[ 모던 자바스크립트 스터디 ] Map Map 객체는 키와 값의 쌍으로 이루어진 컬렉션이다. 설명만 들었을 때는 객체와 유사하지만, Map 객체의 키로 사용할 수 있는 값은 객체를 포함한 모든 값이고, Map 객체는 이터러블 객체라는 차이점이 있다. Map 객체 생성 const map = new Map(); console.log(map); // Map(0) {} const map1 = new Map([['key1', 'value1'], ['key2', 'value2']]); console.log(map1); // Map(2) {"key1" => "value1", "key2" => "value2"} const map2 = new Map([1, 2]); // TypeError Map 생성자 함수는 이터러블을 인수로 전달받아 Map 객체를 생성한다.. 2022. 10. 31.
[ 모던 자바스크립트 스터디 ] Set (add, delete, forEach, clear ...) Set Set 객체는 중복되지 않는 유일한 값들의 집합니다. Set 객체는 요소 순서에 의미가 없고, 인덱스로 요소에 접근할 수 없다. Set의 특성은 수학적 집합의 특성과 일치한다. Set을 통해 교집합, 합집합, 차집합, 여집합 등을 구현할 수 있다. Set 객체의 생성 Set 생성자 함수로 생성하며, 인수를 전달하지 않으면 빈 Set 객체가 생성된다. const set = new Set(); console.log(set); // Set(0) {} const set1 = new Set([1, 2, 3, 4]); console.log(set1); // Set(3) {1, 2, 3} const set2 = new Set('hello'); console.log(set2); // Set(4) {"h", "e.. 2022. 10. 31.
[ 모던 자바스크립트 스터디 ] 디스트럭처링 할당 디스트럭처링 할당(구조 분해 할당)은 구조화된 배열과 같은 이터러블 또는 객체를 destructuring하여 1개 이상의 변수에 개별적으로 할당하는 것이다. 배열 디스트럭처링 할당 const arr = [1, 2, 3]; const [one, two, three] = arr; console.log(one, two, three); // 1 2 3 const [x, y] = [1, 2]; 배열 디스트럭처링 할당의 기준은 배열의 인덱스다. 이때 변수의 개수와 이터러블의 요소 개수가 반드시 일치할 필요는 없다. const [a, b] = [1, 2]; console.log(a, b); // 1 2 const [c, d] = [1]; console.log(c, d); // 1 undefined const [e, .. 2022. 10. 29.
[ 모던 자바스크립트 스터디 ] 스프레드 문법 스프레드 문법 ... 은 ES6에서 도입되었고, 하나로 뭉쳐있는 여러 값들의 집합을 펼쳐 개별적인 값들의 목록으로 만든다. 스프레드 문법은 이터러블들만(Array, String, Map, ... ) 사용 가능하다. console.log(...[1, 2, 3]); // 1 2 3 console.log(...'Hello'); // H e l l o 스프레드 문법의 결과는 값이 아니고 값들의 목록이다. 따라서 아래와 같이 변수에 할당할 수 없다는 것을 알아둬야한다. const list = ...[1, 2, 3]; // SyntaxError: Unexpected token ... 함수 호출문의 인수 목록에서 사용하는 경우 const arr = [1, 2, 3]; const max = Math.max(arr); .. 2022. 10. 25.
[ 모던 자바스크립트 스터디 ] Symbol 자바스크립트가 ECMAScript로 표준화된 이래로 자바스크립트는 6개 타입(문자열, 숫자, 불리언, undefined, null, 객체 타입)이 있었다. Symbol 은 ES6에서 도입된 7번째 데이터 타입으로 변경 불가능한 원시 타입 값이다. 이 심벌 값은 다른 값과 중복되지 않는 유일무이한 값이다. 주로 충돌 위험이 없는 유일한 프로퍼티 키를 만들기 위해 사용된다. 심벌 값의 생성 Symbol 함수 심벌 값은 Symbol 함수를 호출해 생성한다. const mySymbol = Symbol(); console.log(typeof mySymbol); // symbol // 심벌 값은 외부로 노출되지않기때문에 확인할 수 없음 console.log(mySymbol); // Symbol() 생성자 함수로 객.. 2022. 10. 22.
[ 모던 자바스크립트 스터디 ] String 표준 빌트인 객체인 String은 원시타입 문자열을 다룰 때 유용한 프로퍼티와 메서드를 제공한다. String 생성자 함수 String은 new 연산자와 함께 호출해 String 인스턴스를 생성할 수 있다. String 생성자 함수에 인수를 전달하지않고 new 연산자와 함께 호출하면 [[StringData]] 내부 슬롯에 빈 문자열을 할당한 String 래퍼 객체를 생성한다. String 래퍼 객체는 배열과 마찬가지로 length 프로퍼티와 인덱스를 나타내는 숫자 형식의 문자열을 프로퍼티키로, 각 문자를 프로퍼티 값으로 갖는 유사 배열 객체이면서 이터러블이다. length 프로퍼티 문자열의 문자 개수를 반환한다. 'Hello'.length; // 5 String 메서드 String 객체의 메서드는 언제나.. 2022. 10. 22.