ECMAScript 2022

Versienummer van JavaScript

Oude ECMAScript-versies worden genaamd naar nummers: ES5 en ES6.

Sinds 2016 worden versies genaamd naar het jaartal: ES2016, 2018, 2020, 2022.

Nieuwe functies van ES2022

• Array at()
• String at()
• RegExp /d
• Object.hasOwn()
• error.cause
• await import
• Classveldverklaring
• Privémethoden en velden

JavaScript Array at()

ES2022 heeft de arraymethode geïntroduceerd at():

Voorbeeld 1

Ophalen van het derde element van het fruits-array:

const fruits = ['Banana', 'Orange', 'Apple', 'Mango'];
let fruit = fruits.at(2);

Try it yourself

Voorbeeld 2

Ophalen van het derde element van het fruits-array:

const fruits = ['Banana', 'Orange', 'Apple', 'Mango'];
let fruit = fruits[2];

Try it yourself

at() De methode retourneert het element op de opgegeven index van het array.

at() Method is equivalent to [] The results returned are the same.

Starting from March 2022, all modern browsers support at() Method:

JavaScript String at()

ES2022 heeft de stringmethode geïntroduceerd at():

Voorbeeld 1

Ophalen van het derde letter van de string 'name':

const name = "W3Schools";
let letter = name.at(2);

Try it yourself

Voorbeeld 2

Ophalen van het derde letter van de string 'name':

const name = "W3Schools";
let letter = name[2];

Try it yourself

at() Method returns the character at the specified index from the string.

at() Method is equivalent to [] The results returned are the same.

Starting from March 2022, all modern browsers support at() Method:

RegExp d modifier

ES2022 added /d Modifiers, used to indicate the start and end of the match.

Instance

let text = "aaaabb";
let result = text.match(/(aa)(bb)/d);

Try it yourself

RegExp modifiers are used to specify case-insensitive matching and other global searches:

Object.hasOwn()

ES2022 provides a safe method to check if a property is an own property of an object.

Object.hasOwn() Similar to Object.prototype.hasOwnPropertybut supports all object types.

Instance

Object.hasOwn(myObject, age)

Try it yourself

Error Cause

ES2022 allows specifying the root cause of an error through error.cause.

Instance

try { 
  connectData(); 
} 
  throw new Error("Connecting failed.", { cause: err }); 
}

Try it yourself

JavaScript await import

JavaScript modules can now wait for the resources to be imported before running:

import {myData} from './myData.js';
const data = await myData();

JavaScript class field declarations

class Hello {
  counter = 0; // class field
}
const myClass = new Hello();
let x = myClass.counter;

Starting from April 2021, class field declarations are supported in all modern browsers:

JavaScript Privaat Methods en Velden

class Hello {
  #counter = 0;  // Privaat Veld
  #myMethod() {} // Privaat Method
}
const myClass = new Hello();
let x = myClass.#counter; // Fout
myClass.#myMethod();      // Fout

Sinds juni 2021 worden privaat methods en velden ondersteund in alle moderne browsers: