ES2020 es una continuación de la mejora de JavaScript de ES (ECMAscript). En el año 2020, los cambios importantes de ES son los siguientes:
1. Entero grande
BigInt es una nueva primitiva numérica en JavaScript. En el tipo BigInt puede almacenar números enteros que son de precisión arbitraria. BigInt puede almacenar números mayores que max_safe_integer (2 53 -1). Antes de esta característica, un programador necesita usar algunas bibliotecas de terceros, lo que lleva a más tiempo de carga, más tiempo de compilación, más tiempo de análisis.
Nombre de archivo: index.js
Javascript
let max = Number.MAX_SAFE_INTEGER; console.log(max); // 9007199254740991 console.log(++max); // 9007199254740992 console.log(++max); // 9007199254740992 console.log(++max); // 9007199254740992 let big = 9007199254740991n; console.log(big) // 9007199254740991n console.log(++big); // 9007199254740992n console.log(++big); // 9007199254740993n console.log(++big); // 9007199254740994n console.log(typeof big); // bigint
Producción:
9007199254740991 9007199254740992 9007199254740992 9007199254740992 9007199254740991n 9007199254740992n 9007199254740993n 9007199254740994n bigint
Nota: Para crear un BigInt, debe agregar ‘n’ al final de cualquier número entero y se convertirá en un BigInt. No importa si el número entero es menor o mayor que MAX_SAFE_INTEGER.
2. String.prototipo.matchAll
Esta función está diseñada para facilitar las coincidencias de expresiones regulares (o la búsqueda simple sin expresiones regulares) cuando tenemos que lidiar con más de una coincidencia dentro de una string. El método matchAll toma un argumento que es una expresión regular o el valor que queremos buscar dentro de la String.
Nombre de archivo: index.js
Javascript
let gfg = "Geeks for Geeks";
for(iter of gfg.matchAll('e')) {
console.log(iter[0])
}
// Using regex
const string = 'Magic hex numbers: DEADBEEF CAFE';
const regex = /\b\p{ASCII_Hex_Digit}+\b/gu;
for (const match of string.matchAll(regex)) {
console.log(match[0]);
}
Producción:
e e e e DEADBEEF CAFE
3. Importación dinámica
ECMA2015 anterior ya implementó la funcionalidad de importación. Antes de la importación dinámica, solo importamos una secuencia de comandos en la parte superior del código, pero al usar la importación dinámica, podemos importar una secuencia de comandos en cualquier lugar y de acuerdo con sus condicionales (por ejemplo, puede usar if/else para asegurarse de que la secuencia de comandos debe cargarse o no). ).
Javascript
<script>
/* Some sample code....
Now ask user for array and if user says
yes the call it from another file */
let userDecision = confirm(
"Do you want an array and print it");
if (userDecision == true) {
let arr = import("./gfg.js").then((res) => {
// [1, 2, 3, 4, 5, 6]
console.log(res.default)
}).catch((er) => {
console.log(er)
})
} else {
cnosole.log("Nothing to do")
}
</script>
Nombre de archivo: gfg.js
Javascript
const x = () => {
return [1,2, 3, 4, 5, 6]
}
export default x()
4. Global esto
Esta es una característica increíble. Hay muchos entornos de JavaScript como el entorno del Node, el entorno del navegador, el entorno del trabajador del servicio y todos estos entornos tienen su propio global, por ejemplo, en el navegador, el global es la ventana, para el entorno del Node es Global y para el trabajador del servicio es Self. .
Nombre de archivo: index.js
Javascript
let findGlobal = () => {
if (typeof self !== 'undefined') {
return self
};
if (typeof window !== 'undefined') {
return window
};
if (typeof global !== 'undefined') {
return global;
}
};
// Function call
console.log(findGlobal());
Producción:
Object [global] {
global: [Circular],
clearInterval: [Function: clearInterval],
....
....
....
setImmediate: [Function: setImmediate] {
[Symbol(nodejs.util.promisify.custom)]: [Function]
}
}
Este método es largo y no tan preciso, por eso ECMA introdujo la palabra clave globalThis y ahora podemos encontrar el valor global this en una sola línea, como se muestra a continuación:
Nombre de archivo: index.js
Javascript
console.log(globalThis);
Producción:
Object [global] {
global: [Circular],
clearInterval: [Function: clearInterval],
....
....
....
setImmediate: [Function: setImmediate] {
[Symbol(nodejs.util.promisify.custom)]: [Function]
}
}
5. Promise.allSettled( )
A veces, en las promesas de JavaScript, solo queremos el resultado de todas las promesas, ya sea que se resuelva o no. No necesitamos el resultado de la promesa, ya sea que se resuelva o se rechace, pero la promesa no debe estar en estado pendiente. Para lograr esto, tenemos la función allSettled() en ECMA2020.
Javascript
<script>
const myProms = [
Promise.resolve("Hello"),
Promise.resolve(1234),
Promise.resolve("Some other Promise")
]
Promise.allSettled(myProms).then((res) => {
console.log(res)
}).catch(
(err) => {
console.log(err)
})
</script>
Producción:
6. Enstringmiento opcional
Esta es una característica muy útil que introdujo la ECMA. Usando el enstringmiento opcional, puede profundizar más y más sin conocer el nombre de la propiedad de un objeto anidado. Supongamos que tenemos un objeto anidado, y queremos profundizar, y no estamos seguros de cuál es el nombre de los nombres de propiedad en muchos pasos, entonces podemos usar el operador de enstringmiento opcional ( ?. ) Si solo usamos el punto ( . ) para acceder a los nombres de propiedad y accidentalmente ingresamos un nombre de propiedad incorrecto, obtendremos un error, pero al usar el operador de enstringmiento opcional ( ?. ) Obtendremos indefinido en lugar del mensaje de error .
Nombre de archivo: index.js
Javascript
let gfg = {
user : {
firstUser : {
name: {
firstName: "Geeks",
lastName : "forGeeks"
}
}
}
}
console.log(gfg.user.firstUser.name.firstName)
// Geeks
console.log(gfg.user.ANY_RANNDOM_STRING?.name.firstName)
// undefined
console.log(gfg.user.ANY_RANNDOM_STRING.name.firstName)
// Uncaught TypeError: Cannot read property
// 'name' of undefined
Producción:
Geeks undefined Uncaught TypeError: Cannot read property 'name' of undefined....
Publicación traducida automáticamente
Artículo escrito por _saurabh_jaiswal y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA