Comprensión de listas de JavaScript

1. La explicación sintáctica para las comprensiones de listas de JavaScript
2. Comprensión de listas de JavaScript con mapa
3. Utilice la sintaxis for..of para iterar a través de una lista
4. Conclusión

Muchos lenguajes de programación admiten una sintaxis de lenguaje específica conocida como comprensión de lista. Podemos usar esta comprensión de lista para derivar una nueva lista de una lista subsistente.

Usando la sintaxis de comprensión de listas, una expresión de JavaScript, puede crear fácilmente una nueva lista basada en una existente. Sin embargo, el estándar y la implementación de Firefox ya no lo incluyen.

La estandarización de la comprensión de listas en ECMAScript 2016 se sugirió originalmente porque ofrece un atajo práctico para crear una nueva lista basada en el contenido de una existente.

Anteriormente, la comprensión de listas era una adición propuesta a JavaScript por el Comité de JavaScript TC39, pero se abandonó en favor de otras técnicas de listas de JavaScript como filtro() y mapa().

El método filter() o map() se puede utilizar con una lista como alternativa a la sintaxis de comprensión de lista. La sintaxis de comprensión de listas en JavaScript es otro nombre para esto.

La explicación sintáctica para las comprensiones de listas de JavaScript

Aplicar un determinado filtro a una lista existente usando el método filter() le permite producir una nueva lista a partir de la original.

El filtro es una expresión de JavaScript que devuelve un elemento de una lista al pasar la función de prueba que define en el cuerpo de la función.

Ejemplo:

Tomemos una lista como names = ["Rex", "Neon", "Jake", "Eid"] para demostrar el método filter() en JavaScript y crear una nueva lista.

Código:

let names = ['Rex', 'Neon', 'Jake', 'Eid'];

let new_list = names.filter(function(name) {
  return name.includes('e');
});

console.log(new_list);

Aquí podemos obtener una salida, como se muestra a continuación.

El filtro crea una nueva lista para evitar cambios en la lista original.

Como puede ver, un buen reemplazo para el filtro de comprensión de listas es el método filter().

La sintaxis de la función de flecha también le permite condensar el cuerpo del método en una sola línea.

Código:

let names = ['Rex', 'Neon', 'Jake', 'Eid'];

let new_list = names.filter(name => name.includes('e'));

console.log(new_list);

Como salida, podemos recibir la misma salida del ejemplo anterior como [ 'Rex', 'Neon', 'Jake' ].

Nota: Una de las nuevas funciones en la edición ES6 de JavaScript es la función de flecha. En comparación con las funciones convencionales, le permite crear funciones con mayor claridad.

Por ejemplo:

Si esta es la función original:

let testFunction = function(m, n) {
  return m * n;
}

Al usar la función de flecha, se puede escribir lo siguiente como una versión más simple de esta función:

let testFunction = (m, n) => m * n;

Veamos cómo el método map() puede recorrer una lista a continuación.

Comprensión de listas de JavaScript con mapa

La comprensión de listas también se puede usar repetidamente en cada elemento de la lista a medida que avanza.

El método mapa() te permite construir una nueva lista a partir de una existente, al igual que el método filtro().

Sin embargo, el método map() recorre la lista existente sin filtrar, lo que le permite ejecutar código libremente dentro de la función de devolución de llamada.

Ejemplo:

Consideremos la lista como names = ["Rex", "Neon", "Jake", "Eid"] para demostrar el método map() en JavaScript y crear una nueva lista agregando la letra "o" a cada elemento de la lista.

Código:

let names = ['Rex', 'Neon', 'Jake', 'Eid'];

let new_list = names.map(function(name) {
  return name + 'o';
});

console.log(new_list);

Aquí, como se muestra a continuación, recibiremos el resultado.

La función map() se puede condensar en una sola línea usando la función de flecha.

Código:

let names = ['Rex', 'Neon', 'Jake', 'Eid'];

let new_list = names.map(name => name + 'o');

console.log(new_list);

Como resultado, podemos recibir el mismo resultado del ejemplo anterior como [ 'Rexo', 'Neono', 'Jakeo', 'Eido' ].

Puede iterar a través de cualquier lista de JavaScript y ejecutar una función de devolución de llamada determinada utilizando el método map().

Utilice la sintaxis for..of para iterar a través de una lista

Como alternativa, también puede iterar a través de una lista usando el operador for..of, como se muestra a continuación.

let names = ['Rex', 'Neon', 'Jake', 'Eid'];
let new_list = [];

for (const name of names) {
  new_list.push(name + 'o');
}

console.log(new_list);

Aquí podemos recibir la salida de la siguiente manera.

Con el ejemplo anterior en mente, cada iteración crea una nueva variable de nombre que contiene el elemento almacenado en la lista.

Dentro del método for..of, inserte cada elemento name en new_list. Para cada elemento, tenemos la libertad de elegir el operador deseado.

Conclusión

Este artículo expresa los métodos utilizados en la comprensión de listas en JavaScript mediante el examen de funciones como la función filter, la función map y la iteración for..of.