10월 29, 2018의 게시물 표시

ECMAScript6 - Spread

이미지
Spread 연산자는 이터러블 오브젝트의 엘리먼트를 분리하여 전개한다. 전개한 결과를 변수에 할당하거나 함수의 파라미터로 사용할 수 있다. 1. Array 오브젝트 2. String 오브젝트 3. 함수의 파라미터로 사용 ...rest 파라미터 Array-like Array는 아니지만 Array처럼 사용할 수 있는 Object 오브젝트를 Array-like라고 한다. ES6 스펙에서 사용하는 공식 용어. key값이 0부터 시작해서 1씩 증가하고 length 프로퍼티가 있어야한다. 둘 중 하나라도 만족하지 않으면 Array-like가 아니다. ...rest파라미터와 Arguments Argument 는 function 키워드로 함수를 정의 했을 때 사용이 가능하다. get(1,2,3)으로 호출했을 때, 호출받는 함수의 arguments에 1,2,3이 설정된다. arguments도 Array-lik e이므로 for()문으로 전개가 가능하다. 따라서 Array 오브젝트와 메서드를 사용이 불가능하다. 단점  - 함수안의 코드를 보아야 arguments의 사용 여부와 사용 부분을 알 수 있어 코드 가    독성이 떨어진다. 많은 코드를 디버깅하거나 소스 코드를 리팩토링할 때 부담이 된다. ...rest 파라미터는 arrow function 으로 함수를 정의 했을 때 사용이 가능하다. ...rest 파라미터는 Array 오브젝트로 이터러블 오브젝트이다. 따라서 Array 오브젝트의 메서드를 사용할 수 있다. 장점 - 함수안의 코드를 체크하지 않고 (one, ...rest) 형태만 보아도 rest 파라미터의 범위를 알 수 있다.

ECMAScript6 - Iteration

이미지
이터러블 프로토콜은 오브젝트의 반복 처리 규약을 정의한다. 내장 오브젝트로 String, Array, Map, Set, TypedArray, Argument 오브젝트는 디폴트로 이터러블 프로토콜을 갖고 있다. 또한 DOM의 NodeList도 갖고 있다. 이러한 오브젝트는 자바스크립트 엔진이 렌더링될 때 이터러블 프로토콜이 설정된다. 사전처리 없이 반복 처리가 가능하다. 이터러블 프로토콜이 설정된 오브젝트를 이터러블 오브젝트라고 한다. 이터러블 오브젝트는 Symbol.iterator가 있어야 한다. 이것이 이터러블 프로토콜 이다. 이터러블 오브젝트가 아닌 오브젝트에 Symbol.iterator를 개발자 코드로 추가하면 이터러블 오브젝트가 된다. Array 오브젝트가 할당된 arrayObj에서 Symbol.iterator의 존재 여부를 체크하는 코드이다. 오브젝트에 프로퍼티 존재 여부를 체크할 때 arrayObj.propertyKey 또는 arrayObj[propertyKey] 형태로 작성하는데, Symbol은 arrayObj.Symbol.iterator 형태로 작성할 수 없고 arrayObj[Symbol.iterator]와 같이 대괄호 [] 안에 Symbol.iterator를 작성해야 한다. Object 오브젝트는 이터러블 오브젝트가 아니다. Symbol.iterator가 없다. 이터레이터 프로토콜은 오브젝트 값을 순차적으로 처리할 수 있는 방법을 제공하는데, 이것이 next() 메서드이다.