본문 바로가기

Javascript/[인프런] 자바스크립트 ES6+ 기본

[자바스크립트 ES6+ 기본] 24. WeakSet 오브젝트 WeakSet 오브젝트 Set 오브젝트와 차이 오브젝트만 value 값으로 사용할 수 있음 number 등의 프리미티브 타입 사용 불가 개념은 WeakMap과 같음 value만 작성하는 것이 다름 value의 참조가 바뀌면 GC 대상 지원 메소드 has(), add(), delete() new WeakSet() WeakSet 인스턴스 생성, 반환 파라미터 대괄호[] 안에 오브젝트 작성 const empty = new WeakSet(); const sports = {}; const obj = new WeakSet([ sports ]); has() WeakSet 인스턴스에서 value의 존재 여부 반환 존재하면 true, 아니면 false 반환 const fn = () => {}; const obj = ne.. 더보기
[자바스크립트 ES6+ 기본] 23. Set 오브젝트 Set 오브젝트 Set 오브젝트는 value(값)의 컬렉션 [value1,,, valueN] 형태로 작성 Set은 대괄호[]가 하나 const obj = new Set([ 1, 2, "ABC" ]); log(`size: ${obj.size}`); for (let value of obj){ log(value); }; // size: 3 // 1 // 2 // ABC 작성한 순서로 전개 됨 new Set() Set 인스턴스 생성, 반환 파라미터에 값을 작성 프리미티브, 오브젝트 타입 사용 가능 const obj = new Set([ 1, 2, 1, [], {} ]); log(`size: ${obj.size}`); for (let size of obj){ log(value); }; // size: 4 // 1.. 더보기
[자바스크립트 ES6+ 기본] 22. WeakMap 오브젝트 WeakMap 오브젝트 WeakMap은 object만 key로 사용 가능 number 등의 프리미티브 타입 사용 불가 value는 제한 없음 Map에서 key로 참조한 object를 삭제하면 object를 사용할 수 없게 되지만 Map에 object가 남음 메모리 릭(memory leak) 발생 let sports = {like: "축구"}; const obj = new Map([ [sports, "like:축구"] ]); sports = {like: "농구"}; WeakMap의 object를 GC가 지움 GC: Garbage Collection 그래서 (약한, 부서지기 쉬운) WeakMap? WeakMap 오브젝트 메소드 set(), get(), has(), delete() CRUD와 관련된 메소드만 .. 더보기
[자바스크립트 ES6+ 기본] 21. Map 오브젝트 Map 오브젝트 key와 value의 컬렉션 Map 오브젝트 형태 [key, value] 형태처럼 대괄호 안에 key와 value를 작성 다양한 타입을 key로 사용할 수 있음 const obj = new Map([ ["key", "value"], [{book: 200}, "오브젝트"], [100, "Number"] ]); for (let keyValue of obj) { log(keyValue); }; // [key, value] // [{book: 200}, 오브젝트] // [100, Number] Map의 key 처리 for-of 문에서 작성한 순서대로 읽혀짐 new Map() Map 인스턴스를 생성하여 반환 파라미터에 이터러블 오브젝트 작성 const obj = new Map([ ["key", ".. 더보기
[자바스크립트 ES6+ 기본] 20. Symbol 함수, 메소드 Symbol 함수 for() 글로벌 Symbol 레지스트리(registry)에 {key: value} 형태로 Symbol에 저장 파라미터()의 문자열이 key가 되고 Symbol()로 생성한 값이 value가 됨 registry의 사전적 의미: 등록, 기록 const one = Symbol.for("sports"); log(one); // Symbol(sports) 글로벌 Symbol 레지스트리는 공유 영역 다른 오브젝트에서도 사용 가능 같은 key가 존재하면 등록된 값을 사용 const one = Symbol.for("sports"); const two = Symbol.for("sports"); log(one === two); log(Symbol.for(true)); // true // Symbol(t.. 더보기
[자바스크립트 ES6+ 기본]19. Symbol Property Well-Known Symbols ES2019 스펙에서 @@iterator 형태를 볼 수 있음 @@는 Well-Known Symbol을 나타내는 기호 @@match와 Symbol.match가 같음 스펙에서는 @@match 형태를 사용하고 개발자는 Symbol.match 형태를 사용 ES2019 기준: 12개 Well-Known Symbol Well-Known Symbol이란? 스펙에서 알고리즘에 이름을 부여하고 이름을 참조하기 위한 빌트인 Symbol 값 개발자 코드 우선 실행 match()를 실행하면 디폴트로 @@match를 실행 소스 코드에 Symbol.match를 작성하면 @@match가 실행되지 않고 Symbol.match가 실행됨 개발자 코드로 디폴트 기능을 오버라이딩할 수 있음 강좌에서 다루는.. 더보기
[자바스크립트 ES6+ 기본] 18. Symbol 오브젝트 primitive 값 자바스크립트에서 Primitive 값은 오브젝트가 아니라 값이며 함수를 갖고 있지 않음 const num = 100;을 할당하면 num 변수에 100만 할당되며 아무것도 첨부되지 않음 100이 primitive 값 ES5의 primitive 값 타입 string, number, boolean, null, undefined ES6에서 symbol 타입 추가 Wrapper 오브젝트 wrapper 오브젝트는? 프리미티브 값이 포함된 오브젝트 wrapper 오브젝트에는 메소드가 있음 wrapper 오브젝트가 있는 프리미티브 값 타입 string: String, number: Number 오브젝트 boolean: Boolean, symbol: Symbol 오브젝트 const obj = new.. 더보기
[자바스크립트 ES6+ 기본] 17. Generator 오브젝트 Generator 함수 function* Generator function function* 키워드를 사용한 함수 제너레이터 함수 형태 function 선언문, function 표현식, GeneratorFunction function* sports(one){ }; const book = function*(one){ }; const music = Object.getPrototypeOf( function* (){}).constructor; const gen = new music(); 작성 방법 function* 다음에 소괄호() 작성. 이어서 작성해도 되고 하나 이상 띄워도 됨 function* 선언문 function* 다음에 함수 이름 작성 제너레이터 함수를 호출하면 함수 블록{}을 실행하지 않고 Gene.. 더보기