ES

ES

String.protype.matchAll 👯‍♀️

Gotta Match 'Em All! 🔔🌱

const string = 'Favorite GitHub repos: tc39/ecma262 v8/v8.dev';
const regex = /\b(?<owner>[a-z0-9]+)\/(?<repo>[a-z0-9\.]+)\b/g;
for (const match of string.matchAll(regex)) {
  console.log(`${match[0]} at index: ${match.index}`);
  console.log(`→ owner: ${match.groups.owner}`);
  console.log(`→ repo: ${match.groups.repo}`);
}

// Output:
//
// tc39/ecma262 at index: 23
// → owner: tc39
// → repo: ecma262
// 
// v8/v8.dev at index: 36
// → owner: v8
// → repo: v8.dev

Aksessere global kontekst

// nettleser
window;

// node.js
global;

// service worker
self;

globalThis 🌍

globalThis 🌍

Aksessere global kontekst

// nettleser
globalThis = window;

// node.js
globalThis = global;

// service worker
globalThis = self;

BigInt 🤯

Representere tall større enn 2^53 - 1

const theBiggestInt = 9007199254740991n

const alsoHuge = BigInt(9007199254740991)
// ↪ 9007199254740991n

const hugeString = BigInt("9007199254740991")
// ↪ 9007199254740991n
typeof BigInt(9007199254740991)
// ↪ "bigint"

Promise.allSettled() ✌️

Promise.all() – bare litt mer tålmodig 

const p1 = new Promise((res) => res("🍕"));
const p2 = new Promise((res, rej) => rej("🍍"));
const p3 = new Promise((res) => res("🍺"));

Promise.allSettled([p1, p2, p3]).then(data => console.log(data));

// [
//   { status: "fulfilled", value: "🍕" },
//   { status: "rejected", value: "🍍" },
//   { status: "fulfilled", value: "🍺" },
// ]

Dynamic import() 🏃‍♀️🏃‍♂️💨

Importere hvor som helst – når som helst

// Using callback
import('/module.js')
  .then((module) => {
    // Do something with the module
  });
// Using async / await
async function () {
  const bestModule = { 
    description: 'The best module!', 
    name: 'best_module',
  };
  let module = await import(`/${bestModule.name}.js`);
}

Optional Chaining ⛓

Gjør koden mer elegant 

const jsFaggruppe = bekk.faggrupper.javascript;
const jsFaggruppe = bekk 
	&& bekk.faggrupper
	&& bekk.faggrupper.javascript;

Optional Chaining ⛓

Gjør koden mer elegant

const jsFaggruppe = bekk?.faggrupper?.javascript;

Nullish Coalescing Operator 🤙

Enda en kortslutningsoperatør (&&, || og ??)

const user = { age: undefined };
const age = user.age || -1;
// ↪ -1

Nullish Coalescing Operator 🤙

const user = { age: undefined };
const age = user.age || -1;
// ↪ -1
const user = { age: 0 };
const age = user.age || -1;
// ↪ -1

Enda en kortslutningsoperatør (&&, || og ??)

Nullish Coalescing Operator 🤙

Enda en kortslutningsoperatør

const user = { age: undefined };
const age = user.age ?? -1;
// ↪ -1
const user = { age: 0 };
const age = user.age ?? -1;
// ↪ 0

What's next? 🔮

  • Pattern Matching (stage 1)
  • Cancellation (stage 1)
  • ​Getting last item from Array (stage 1)
  • Promise.try (stage 1)

https://github.com/tc39/proposals/

Nytt i ES2020

By Markus Rauhut

Nytt i ES2020

  • 127