ECMAScript 2021 (JS 2021/2022)
JavaScript in 2021/2022 continues to evolve, with ES2021/ES2022 bringing enhanced features like private class fields, promise improvements, and record data structures, boosting developer productivity and code quality.
JavaScript New Features in ES2021
Name |
Description |
---|---|
Resolves if any Promise resolves, else reject after all reject. |
|
Replaces all occurrences of a substring with another in string |
|
Numeric Separators (_) |
separating digits in numbers using underscores. |
JavaScript in 2022 new features :
Name |
Description |
---|---|
Retrieves element at index supports positive and negative indexing |
|
Finds character at index, supports positive and negative indexing |
|
Matches any digit (0-9) in a regular expression pattern. |
|
Checks if object has its own specified property. |
|
error.cause |
Accesses the cause of an error in the error object. |
await import |
Awaits and imports a module dynamically in JavaScript code asynchronously. |
Private methods and fields |
Encapsulates data with restricted access using private methods and fields. |
Class field declarations |
Defines class properties directly without constructor using concise syntax. |
We will explore all the above methods along with their basic implementation with the help of examples.
Method 1: Promise any()
Promise.any() is a JavaScript ES2021/ES2022 method that takes an array of Promises and returns the first resolved Promise, rejecting only if all Promises reject.
Syntax:
Promise.any(iter)
Example: This example, shows the basic use of Promise.any() method.
Javascript
let prom1 = new Promise((resolve, reject) => { reject( "Failure" ); }) let prom2 = new Promise((resolve, reject) => { reject( "Failed to load" ); }) let prom3 = new Promise((resolve, reject) => { resolve( "Worked" ); }) let prom4 = new Promise((resolve, reject) => { resolve( "Successful" ); }) let prom = [prom1, prom2, prom3, prom4]; Promise.any(prom).then((val) => { console.log(val) }); |
Worked
Method 2: String replaceAll()
String replaceAll() is a JavaScript method (ES2021/ES2022) replacing all occurrences of a substring with another, returning a new string.
Syntax:
const newString = originalString.replaceAll(regexp | substr , newSubstr | function)
Example: Below is an example of the String replaceAll() Method.
Javascript
function gfg() { let string = "Beginner or Beginner" ; newString = string.replaceAll( "or" , "for" ); console.log(newString); } gfg(); |
Beginner for Beginner
Method 3: Numeric Separators (_)
Numeric Separators (_) in JavaScript (ES2021/ES2022) allow improved readability by placing underscores as visual separators in large numbers for better code comprehension.
Syntax:
let num1 = 1_000_000_000;
Example: Here is the basic example of above method.
Javascript
let num1 = 1_000_000_000; let num2 = 1000000000; console.log(num1 === num2); |
true
Method 4: Array at()
The JavaScript Array at() method takes an integer value (index) as a parameter and returns the element of that index. It allows positive and negative integers. For the negative integer, it counts back from the last element in the array.
Syntax:
at(index);
Example: This code shows the value extracted at the given index.
Javascript
const arr = [45, 32, 69, 21]; const index = 3; console.log(arr.at(index)); |
21
Method 5: String at()
String.at() finds character at specified index, supports positive and negative indexes. Positive indexes start from array start, negative from end.
Syntax:
let a = str.at(ind);
Example: In this example, we will use the String.at() method with a positive index.
Javascript
let str1 = "Welcome to w3wiki" ; let str2 = "w3wiki" ; console.log(str1.at(3)); console.log(str2.at(8)) |
c G
Method 6: RegExp \D
The RegExp \D Metacharacter in JavaScript is used to search non-digit characters i.e all the characters except digits. It is the same as [^0-9].
Syntax:
/\D/
Example: This example searches the non-digit characters in the whole string.
Javascript
function geek() { let str1 = "w3wiki@_123_$" ; let regex4 = /\D/g; let match4 = str1.match(regex4); console.log( "Found " + match4.length + " matches: " + match4); } geek() |
Found 17 matches: G,e,e,k,s,f,o,r,G,e,e,k,s,@,_,_,$
Method 7: Object.hasOwn()
Object.hasOwn() is a method that checks if an object has a specific property directly on itself, returning true if found, else false.
Syntax:
Object.hasOwn(obj, prop)
Example: This example uses the hasOwn() method to check if a property exists or not.
Javascript
let details = { name: "Raj" , course: "DSA" , website: "w3wiki.net" , } console.log(Object.hasOwn(details, 'name' )); console.log(Object.hasOwn(details, 'course' )); console.log(Object.hasOwn(details, 'phone number' )); |
true true false
Supported browser:
- Chrome 1
- Edge 12
- Firefox 1
- Safari 1
- Opera 3