FREE JavaScript ES2016 / ES2017 / ES2018 Cheatsheet

FREE JavaScript ES2016 / ES2017 / ES2018 Cheatsheet

javascript cheatsheet

Content of the cheat sheet

ES2016

Array.Prototype.includes()

    let array = [1,3,5,7,9,11]
    // check if the element appears in our Arrray
    array.includes(3); // true 
    array.includes(2); // false
    // add an index as a second parameter
    array.includes(3,1); // true 
    array.includes(5,4); //false

Exponential operator

    // before
    Math.pow(2,3);
    // 8

    //now
    2**3;
    // 8

ES2017

padStart() & padEnd()

    "hi".padStart(10);
    // "        hi"
    "hi".padEnd(10);
    // "hi        "

    // you are not limited to adding blank spaces
    "hello".padEnd(13," Alberto");
    // "hello Alberto"

Object.entries() and Object.values()

    const family = {
      father: "Jonathan Kent",
      mother: "Martha Kent",
      son: "Clark Kent",
    }
    Object.values(family);
    // ["Jonathan Kent", "Martha Kent", "Clark Kent"]
    Object.entries(family);
    // ["father", "Jonathan Kent"]
    // ["mother", "Martha Kent"]
    // ["son", "Clark Kent"]

Async and Await

    function walk(amount) {
      return new Promise((resolve, reject) => {
        if (amount < 500) {
          reject("the value is too small");
        }
        setTimeout(() => resolve(``you walked for ${amount}ms``), amount);
      });
    }

    // create an async function
    async function go() {
      // use the keyword await to wait for the response
      const res = await walk(500);
      console.log(res);
      const res2 = await walk(900);
      console.log(res2);
      const res3 = await walk(600);
      console.log(res3);
      const res4 = await walk(700);
      console.log(res4);
      const res5 = await walk(400);
      console.log(res5);
      console.log("finished");
    }

    go();
    // you walked for 500ms
    // you walked for 900ms
    // you walked for 600ms
    // you walked for 700ms
    // uncaught exception: the value is too small

ES2018

Rest / Spread for Objects

    let myObj = {
      a: 1,
      b: 3,
      c: 5,
      d: 8,
    }

    // we use the rest operator to grab everything 
    // else left in the object.
    let { a, b, ...z } = myObj;
    console.log(a); // 1
    console.log(b); // 3
    console.log(z); // {c: 5, d: 8}
    // using the spread syntax we cloned our Object
    let clone = { ...myObj };
    console.log(clone);
    // {a: 1, b: 3, c: 5, d: 8}

Promise.prototype.finally()

    fetch("your-url")
      .then(result => {
        // do something with the result
      })
      .catch(error => {
        // do something with the error
      })
      .finally(() => {
        // do something once the promise is finished
      })

Asynchronous iteration

    // iterate asynchronously over our data 
    // using a ``for-await-of`` loop.
    for await (const line of readLines(filePath)) {
      console.log(line);
    }

Lifting template literal restrictions

    function tag(strs) {
      strs[0] === undefined
      strs.raw[0] === "\\unicode and \\u{55}";
    }
    tag ``\unicode and \u{55}``
    // This loosening of the escape sequence restriction
    //  only applies to tagged 
    // template literals; untagged templates 
    // still throw an early error 
    // for invalid escape sequences:

    let bad = ``bad escape sequence: \unicode``;
    // throws early error

RegExp features

    // s (dotAll)` flag for regular expressions
    /foo.bar/s.test('foo\nbar');
    // → true

    // RegExp named capture groups
    let re = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/u;
    let result = re.exec('2015-01-02');
    // result.groups.year === '2015';
    // result.groups.month === '01';

    // RegExp Lookbehind Assertions
    // make sure that a pattern is or isn't preceded by another

    // RegExp Unicode Property Escapes
    const regexGreekSymbol = /\p{Script=Greek}/u;
    regexGreekSymbol.test('π');
    // → true


NEWEST ARTICLES




ABOUT ME

author alberto montalesi profile picture

Alberto is a software developer specialized in building enterpise software using Angular and author of the 'Complete guide to Modern JavaScript' ebook and course. In his free time he writes articles and tutorials on InspiredWebDev.com and Dev.to

You can read more about him here