Javascript. 5 novedades que nos traerá ES2021

Descubre las nuevas características que incorporará Javascript en la próxima revisión del lenguaje

Photo by Goran Ivos on Unsplash

Asignadores lógicos

let bar;
const foo = 'some value';
bar = bar || foo;
let bar;
bar ||= 'some value';
let foo = 'foo';
let bar = 'bar';
foo = foo && bar; // 'bar'
foo &&= bar; // 'bar'
let foo = null;
let bar = 'bar';
foo = foo ?? bar; // 'bar'foo ??= bar; // 'bar'

String.prototype.replaceAll

const p = 'These are foo, foo, and foo.';
p.replace('foo', 'bar'); // 'There are bar, foo, and foo.'
const p = 'These are foo, foo, and foo.';
p.replace(/foo/g, 'bar'); // 'There are bar, bar, and bar.'
const p = 'These are foo, foo, and foo.';
p.replaceAll('foo', 'bar'); // 'There are bar, bar, and bar.'

Promise.any

const promises = [  new Promise((resolve, reject) => reject('Primera')),  new Promise((resolve, reject) => reject('Segunda')),  new Promise((resolve) => resolve('Tercera'))];Promise.any(promises)  .then(result => console.log(result)); // 'Tercera'
const promises = [  new Promise((resolve, reject) => reject('Primera')),  new Promise((resolve, reject) => reject('Segunda')),  new Promise((resolve, reject) => reject('Tercera'))];Promise.any(promises)  .then(result => console.log(result))  .catch(error => console.log(error)); // AggregateError: All promises were rejected

Separadores numéricos

const number = 1_000_000_00;
console.log(number); // 100000000

Intl.ListFormat

const people = ['Pepito', 'Fulanito', 'Menganito'];new Intl.ListFormat('es', { style: 'long', type: 'conjunction' }).format(people); 
// "Pepito, Fulanito y Menganito"
new Intl.ListFormat('es', { style: 'long', type: 'disjunction' }).format(people);
// "Pepito, Fulanito o Menganito"

WeakRef

function toggleUnderline(element) {
const weakElement = new WeakRef(element);
let intervalId = null;

function toggle() {
// Obtener el elemento de la Weak Reference
const el = weakElement.deref();
// Puede que ya no exista
if (el) {
const decoration = weakElement.style.textDecoration;
if (decoration === 'none') {
weakElement.style.textDecoration = 'underline';
} else {
weakElement.style.textDecoration = 'none';
} else {
clearInterval(intervalId);
}
}
intervalId = setInterval(toggle, 1000);
}
toggleUnderline(document.getElementById("animatedLink"));setTimeout(() => {
document.getElementById("animatedLink").remove();
}, 10000);

Conclusiones

¿Quieres recibir más artículos como este?

Entre paseo y paseo con Simba desarrollo en Symfony y React

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store