La guía ES2019

ECMAScript es el estándar en el que se basa JavaScript y suele abreviarse como ES. Descubra todo sobre ECMAScript y las funciones agregadas en ES2019

ESNext es un nombre que siempre indica la próxima versión de JavaScript.

La versión actual de ECMAScript es ES2018 . Se lanzó en junio de 2018.

Históricamente, las ediciones de JavaScript se han estandarizado durante el verano, por lo que podemos esperar que ECMAScript 2019 se lance en el verano de 2019.

Entonces, al momento de escribir esto, ES2018 ya se lanzó y ESNext es ES2019.

Las propuestas para el estándar ECMAScript se organizan en etapas. Las etapas 1 a 3 son una incubadora de nuevas características, y las características que llegan a la etapa 4 se ultiman como parte del nuevo estándar.

En el momento de escribir este artículo, contamos con una serie de funciones en la Etapa 4. Las presentaré en esta sección. Las últimas versiones de los principales navegadores ya deberían implementar la mayoría de ellas.

• Array.prototype.{flat,flatMap}
• Enlace de captura opcional
• Object.fromEntries()
• String.prototype.{trimStart,trimEnd}
• Symbol.prototype.description
• Mejoras en JSON
• Bien formadoJSON.stringify()
• Function.prototype.toString()

Algunos de esos cambios son principalmente para uso interno, pero también es bueno saber qué está pasando.

Hay otras características en la Etapa 3, que podrían promoverse a la Etapa 4 en los próximos meses, y puedes consultarlas en este repositorio de GitHub: https://github.com/tc39/proposals .

Matriz.prototipo.{plano,planoMapa}

flat()es un nuevo método de instancia de matriz que puede crear una matriz unidimensional a partir de una matriz multidimensional.

Ejemplo:

;['Dog', ['Sheep', 'Wolf']].flat()//[ 'Dog', 'Sheep', 'Wolf' ]

De manera predeterminada, solo se “aplana” hasta un nivel, pero puedes agregar un parámetro para establecer la cantidad de niveles a los que deseas que se aplane la matriz. Configúralo para Infinitytener niveles ilimitados:

;['Dog', ['Sheep', ['Wolf']]] .flat() [ //[ 'Dog', 'Sheep', [ 'Wolf' ] ] ('Dog', ['Sheep', ['Wolf']]) ].flat(2) [ //[ 'Dog', 'Sheep', 'Wolf' ] ('Dog', ['Sheep', ['Wolf']]) ].flat(Infinity)//[ 'Dog', 'Sheep', 'Wolf' ]

Si está familiarizado con el map()método JavaScript de una matriz, sabrá que al usarlo puede ejecutar una función en cada elemento de una matriz.

flatMap()es un nuevo método de instancia Array que se combina flat()con map(). Es útil cuando se llama a una función que devuelve una matriz en la devolución de llamada map(), pero se desea que la matriz resultante sea plana:

;['My dog', 'is awesome'] .map((words) = words.split(' ')) [ //[ [ 'My', 'dog' ], [ 'is', 'awesome' ] ] ('My dog', 'is awesome') ].flatMap((words) = words.split(' '))//[ 'My', 'dog', 'is', 'awesome' ]

Enlace de captura opcional

A veces no necesitamos tener un parámetro vinculado al bloque catch de un try/catch.Te recomendamos Activación muscular NEURO_MUSCLE INTERACTION TECHNIQUES

Anteriormente teníamos que hacer:

try { //...} catch (e) { //handle error}

Incluso si nunca tuviéramos que utilizarlo epara analizar el error, ahora podemos simplemente omitirlo:

try { //...} catch { //handle error}

Objeto.fromEntries()

Los objetos tienen un entries()método, desde ES2017 .

Devuelve una matriz que contiene todas las propiedades propias del objeto, como una matriz de [key, value]pares:

const person = { name: 'Fred', age: 87 }Object.entries(person) // [['name', 'Fred'], ['age', 87]]

ES2019 introduce un nuevo Object.fromEntries()método que puede crear un nuevo objeto a partir de dicha matriz de propiedades:

const person = { name: 'Fred', age: 87 }const entries = Object.entries(person)const newPerson = Object.fromEntries(entries)person !== newPerson //true

Cadena.prototipo.{trimStart,trimEnd}

Esta característica ha sido parte de v8/Chrome durante casi un año y se estandarizará en ES2019.

recortarInicio()

Devuelve una nueva cadena con espacios en blanco eliminados del inicio de la cadena original

'Testing'.trimStart() //'Testing'' Testing'.trimStart() //'Testing'' Testing '.trimStart() //'Testing ''Testing '.trimStart() //'Testing '

recortarFinal()

Devuelve una nueva cadena con espacios en blanco eliminados del final de la cadena original

'Testing'.trimEnd() //'Testing'' Testing'.trimEnd() //' Testing'' Testing '.trimEnd() //' Testing''Testing '.trimEnd() //'Testing'

Símbolo.prototipo.descripción

Ahora puede recuperar la descripción de un símbolo accediendo a su descriptionpropiedad en lugar de tener que utilizar el toString()método:

const testSymbol = Symbol('Test')testSymbol.description // 'Test'

Mejoras en JSON

Antes de este cambio, los símbolos separador de línea (u2028) y separador de párrafo (u2029) no estaban permitidos en cadenas analizadas como JSON .

Al usar JSON.parse(), esos caracteres dieron como resultado un SyntaxErrorpero ahora se analizan correctamente, tal como lo define el estándar JSON.

Bien formadoJSON.stringify()

Corrige la JSON.stringify()salida cuando procesa puntos de código UTF-8 sustitutos (U+D800 a U+DFFF).

Antes de este cambio, la llamada JSON.stringify()devolvería un carácter Unicode mal formado (un ”�”).

Ahora esos puntos de código sustitutos pueden representarse de forma segura como cadenas usando JSON.stringify(), y transformarse nuevamente a su representación original usando JSON.parse().

Función.prototype.toString()

Las funciones siempre han tenido un método de instancia llamado toString()que devuelve una cadena que contiene el código de la función.

ES2019 introdujo un cambio en el valor de retorno para evitar eliminar comentarios y otros caracteres como espacios en blanco, representando exactamente la función tal como fue definida.

Si anteriormente teníamos:

function /* this is bar */ bar() {}

El comportamiento fue el siguiente:

bar.toString() //'function bar() {}

Ahora el nuevo comportamiento es:

bar.toString() // 'function /* this is bar */ bar () {}'

Tips para principiantes de JavaScript

Tal vez te puede interesar:

1. Introducción a React
2. Agregar evento de clic a los elementos DOM devueltos desde querySelectorAll
3. Cómo cambiar el valor de un nodo DOM
4. Cómo comprobar si un elemento DOM tiene una clase

La guía ES2019

Matriz.prototipo.{plano,planoMapa}Enlace de captura opcionalObjeto.fromEntries()Cadena.prototipo.{trimStart,trimEnd}Símbolo.prototipo.descripciónMejoras en J

programar

es

2025-01-18

Si crees que alguno de los contenidos (texto, imagenes o multimedia) en esta página infringe tus derechos relativos a propiedad intelectual, marcas registradas o cualquier otro de tus derechos, por favor ponte en contacto con nosotros en el mail [email protected] y retiraremos este contenido inmediatamente