본문 바로가기

ES64

[ES6] 제너레이터 1. 제너레이터에 앞서 지난 포스팅(이터레이션)에서는 이터레이터이면서 이터러블인 객체에 대해서 살펴보았다. 이터레이터의 조건(next 메서드를 소유)과 이터러블의 조건([Symbol.iterator] 메서드 소유)을 만족 한다면 이는 이터레이터이면서 이터러블인 객체이다. 아래 코드에서 createInfinityByIteration 함수를 실행했을 때 반환되는 객체는 위의 조건을 모두 만족한다. // 이터레이션 프로토콜을 구현하여 무한 이터러블을 생성하는 함수 const createIteration = function() { let i = 0; // 자유 변수 return { [Symbol.iterator]() { return this; }, next() { return { value: ++i }; }, .. 2020. 3. 27.
[ES6] Rest파라미터와 Spread연산자 Rest파라미터와 Spread연산자 Intro Spread 연산자 Spread의 의미 Spread는 펼치다라는 의미를 가지고 있다. 카지노에서 포카를 할 때 딜러가 카드를 펼치는 기술을 보았을 것이다. 카드곽에서 카드를 꺼내 펼치는 기술이 spread이고, 유사배열객체([1,2,3] 또는 {1:'a', 2:'b'} 등)에서 요소들을 꺼내 펼치는 기술을 Spread 연산자라고 한다. 소스코드를 읽을 때 배열이나 객체에서 [] 이거랑 {} 이것들 사이에 있는 리터럴 들을 의미한다고 보면 된다. const 카드곽 = ["카드1", "카드2", "카드3"]; //배열선언 const 카드곽2 = [...카드곽]; //펼치기 기술 console.log(카드곽2); //["카드1", "카드2", "카드3"] Rest.. 2020. 3. 27.
[ES6] 클래스 Class 자바에서 Class의 개념 ES6에서 Class 키워드가 새롭게 추가되었다. 자바를 공부할 때 Class를 공부해서 자바스크립트 Class의 개념을 이해하는 것은 어렵지는 않았다. 나는 Class를 붕어빵 만들 때 쓰는 붕어빵틀로 이해를 했다. 붕어빵을 만들 때 붕어빵 틀에 붕어빵을 어떻게 만들 것인지 먼저 그려놓고 그것에 맞춰서 붕어빵을 생성하듯 개발자는 Class에 데이터가 어떻게 구성 되어있는지 정의해 놓고, New라는 키워드를 통해 Class의 인스턴스를 만들어내는 것이다. 상속의 개념 상속은 부모의 Class(데이터 타입)가 가지고 있는 정보를 자식 Class가 물려 받는 것을 의미한다. 상속을 할 때는 extends라는 키워드를 사용하는데 extend는 넓히다, 확장하다 라는 뜻이다.. 2020. 3. 27.
[ES6] 화살표 함수 Arrow Function 1. 화살표 함수의 선언 화살표 함수(Arrow function)는 function 키워드 대신 화살표(=>)를 사용하여 보다 간략한 방법으로 함수를 선언할 수 있다. 하지만 모든 경우 화살표 함수를 사용할 수 있는 것은 아니다. 화살표 함수의 기본 문법은 아래와 같다. // 매개변수 지정 방법 () => { ... } // 매개변수가 없을 경우 x => { ... } // 매개변수가 한 개인 경우, 소괄호를 생략할 수 있다. (x, y) => { ... } // 매개변수가 여러 개인 경우, 소괄호를 생략할 수 없다. // 함수 몸체 지정 방법 x => { return x * x } // single line block x => x * x // 함수 몸체가 한줄의 구문이라면 중.. 2020. 3. 27.