Javscript: What's New in 2019
May 11, 2019.2 min read
New # private fields
class SuperHero {
#name;
}
Now If you try
const ironMan = new SuperHero();
ironMan.#name
// Syntax Error
New inheritance super()
class Hulk extends SuperHero {
color = "green";
// no need to call constructor
smash() {
console.log("smashing");
}
}
New string.matchAll
let string = "Favorate GitHub repos: ts39/ecma262 v8/v8.dev ";
let regex = /\b(?<owner>[a-z0-9]+)\/(?<repo>[a-z0-9\.]+)\b/g;
for (const match of string.matchAll(regex)) {
console.log(`${match[0]} at ${match.index} with '${match.input}'`);
console.log(`-> owner: ${match.groups.owner}`);
console.log(`-> repo: ${match.groups.repo}`);
}
// Output:
// ts39/ecma262 at 23 with 'Favorate GitHub repos: ts39/ecma262 v8/v8.dev '
// -> owner: ts39
// -> repo: ecma262
// v8/v8.dev at 36 with 'Favorate GitHub repos: ts39/ecma262 v8/v8.dev '
// -> owner: v8
// -> repo: v8.dev
New Big int
// With out Big int
console.log(11212121238489989349982323 * 123);
// output: 1.3790909123342687e+27
// by suffix `n`
console.log(11212121238489989349982323n * 123n);
// output: 1379090912334268690047825729n
New Array.flatMat()
// map
[1, 3, 5].flatMat(x => [x, x + 1]);
// [[1,2], [3,4],[5,6]]
[1, 3, 5].flatMat(x => [x, x + 1]);
// [1, 2, 3, 4, 5, 6]
New Object.fromEntries
const arr = [
["x", 13],
["y", 10],
["z", 34]
];
console.log(Object.fromEntries(arr));
// output
// { x: 13, y: 10, z: 34 }
// Also maps
const map = new Map({ name: "Hulk", weight: "1400 lbs" });
console.log(Object.fromEntries(map));
// output:
// { name: 'Hulk', weight: '1400 lbs' }
Global this
// For all enviroments (eg: Node, Chrome, etc...)
const theGlobalthis = globalThis;
// on chrome
console.log(theGlobalthis);
// Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, parent: Window, …}
Intl APIs
To Localize your websites
/** Intl.RelativeTimeFormat **/
const rtf = new Intl.RelativeTimeFormat("en", { numeric: "auto" });
// input <number, 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year' >
rtf.format(-1, "day");
rtf.format(0, "day");
rtf.format(1, "day");
// output:
// "yesterday"
// "today"
// "tomorrow"
// you can use any language
const rtf = new Intl.RelativeTimeFormat("en", { numeric: "auto" });
rtf.format(2, "hours");
// 2 గంటల్లో
Optional Catch block
// Old
try {
...
} catch(error) {
...
}
// New
try {
...
} catch {
...
}