본문 바로가기

ECMA6

web/javascript by 낼스 2019. 1. 30.

ECMA6


※ 참고 : https://www.sitepoint.com/javascript-versioning-es6-es2015

# ECMAScript 2015 Releases
   - Classes
   - Promises
   - Arrow functions
   - ES Modules
   - Generators and Iterators

# ES2016
   - Array.prototype.includes
        // pre-ES2016:
        const hasBob = names.indexOf('bob') > -1;

        // ES2016:
        const hasBob = names.includes('bob');

   - Exponent Operator
        // pre-ES2016
        Math.pow(5, 3); // => 125

        // ES2016
        5 ** 3; // => 125

# ES2017
    - Asynchronous Functions
        // promises
        const getProfile = name => {
          return fetch(`https://some-api/people/${name}`)
            .then(res => res.json())
            .then(({ profile }) => profile); // destructuring `profile` from parsed object
        };

        // async/await
        const getProfile = async name => {
          const res = await fetch(`https://some-api/people/${name}`);
          const { profile } = await res.json();
          return profile;
        };

   - String Padding Methods
     String.prototype.padStart(length, padder) and padEnd(length, padder) will

    'foo'.padStart(6);          // => '   foo';
    'foo'.padEnd(6);            // => 'foo   ';
    'foo'.padStart(10, 'bar');  // => 'barbarbfoo';
    'foo'.padEnd(10, 'bar');    // => 'foobarbarb';

# ES2018
   - Asynchronous Iterators
    While Promise.all() allows you to await the resolution of multiple promises,
    there are cases in which you may need to sequentially iterate over asynchronously-retrieved values.
    It’s now possible to await async iterators along with arrays of promises:

    (async () => {
      const personRequests = ['bob', 'sarah', 'laura'].map(
        n => fetch(`https://api/people/${n}`)
      );

      for await (const response of personRequests) {
        console.log(await response.json());
      }
    })();

   - Object Spread and Rest Properties
     함수 호출 용            : myFunction(...iterableObj);
     배열 리터럴 용          : [...iterableObj, 4, 5, 6]
     비구조화destructuring 용:[a, b, ...iterableObj] = [1, 2, 3, 4, 5];

# 참고
    :: [JavaScript] ES6 문법 정리
        ※ 원본 : https://github.com/lukehoban/es6features
        ※ 출처 : http://itstory.tk/entry/JavaScript-ES6-문법-정리#arrows [덕's IT Story]

※ 참고 : https://www.sitepoint.com/javascript-versioning-es6-es2015

# ECMAScript 2015 Releases
   - Classes
   - Promises
   - Arrow functions
   - ES Modules
   - Generators and Iterators

# ES2016
   - Array.prototype.includes
        // pre-ES2016:
        const hasBob = names.indexOf('bob') > -1;

        // ES2016:
        const hasBob = names.includes('bob');

   - Exponent Operator
        // pre-ES2016
        Math.pow(5, 3); // => 125

        // ES2016
        5 ** 3; // => 125

# ES2017
    - Asynchronous Functions
        // promises
        const getProfile = name => {
          return fetch(`https://some-api/people/${name}`)
            .then(res => res.json())
            .then(({ profile }) => profile); // destructuring `profile` from parsed object
        };

        // async/await
        const getProfile = async name => {
          const res = await fetch(`https://some-api/people/${name}`);
          const { profile } = await res.json();
          return profile;
        };

   - String Padding Methods
     String.prototype.padStart(length, padder) and padEnd(length, padder) will

    'foo'.padStart(6);          // => '   foo';
    'foo'.padEnd(6);            // => 'foo   ';
    'foo'.padStart(10, 'bar');  // => 'barbarbfoo';
    'foo'.padEnd(10, 'bar');    // => 'foobarbarb';

# ES2018
   - Asynchronous Iterators
    While Promise.all() allows you to await the resolution of multiple promises,
    there are cases in which you may need to sequentially iterate over asynchronously-retrieved values.
    It’s now possible to await async iterators along with arrays of promises:

    (async () => {
      const personRequests = ['bob', 'sarah', 'laura'].map(
        n => fetch(`https://api/people/${n}`)
      );

      for await (const response of personRequests) {
        console.log(await response.json());
      }
    })();

   - Object Spread and Rest Properties
     함수 호출 용            : myFunction(...iterableObj);
     배열 리터럴 용          : [...iterableObj, 4, 5, 6]
     비구조화destructuring 용:[a, b, ...iterableObj] = [1, 2, 3, 4, 5];

# 참고
    :: [JavaScript] ES6 문법 정리
        ※ 원본 : https://github.com/lukehoban/es6features
        ※ 출처 : http://itstory.tk/entry/JavaScript-ES6-문법-정리#arrows [덕's IT Story]

'web > javascript' 카테고리의 다른 글

Javascript Async, Await 심화  (0) 2019.07.12
Javascript Async return Promise For await  (0) 2019.07.12
Javascript Async, Await 심화  (0) 2019.01.30
Javascript arrow function expression  (0) 2019.01.30
ES2015(ES6) Module System  (0) 2019.01.30

댓글