Enumere los nuevos métodos de array introducidos en ES6

ECMAScript 2015, también llamado ES6, es una revisión mejorada de Javascript. Con esta actualización, se introdujeron algunas características y los métodos que operan con la array se enumeran a continuación:

1. Método find(): este método devuelve la primera entidad aparecida de la array que está buscando, más sintácticamente podemos decir que devuelve un elemento de una array de acuerdo con la función de prueba proporcionada como argumento. 

• Volverá indefinido si no se encuentra dicho elemento de acuerdo con una condición dada.
• Devolverá la primera aparición si más de un elemento cumple la condición dada.

Ejemplo: estamos proporcionando una función simple con sintaxis de flecha gruesa dentro del método de búsqueda que verifica si el elemento actual es igual a 5 o no, y devolverá ese elemento en el que esta condición arroja un valor real.

<script>
    const array = [6, 8, 78, 21, 5];
  
    const returnedElement = array.find((element) => {
        return element == 5;
    });
  
    console.log(returnedElement);
</script>

Producción:

2. Método findIndex(): es similar al método de búsqueda descrito anteriormente, la diferencia es que devuelve el índice del elemento en lugar del valor real y devuelve -1 si no se encuentra ese elemento. Sintácticamente, devuelve el índice de elementos para los que la función de devolución de llamada produce un valor verdadero.

Ejemplo:

<script>
    const array = [6, 8, 78, 21, 5];
  
    const returnedIndex = array.findIndex((element) => {
        return element == 5;
    });
  
    console.log(returnedIndex);
  
</script>

Producción:

3. Método of(): Este creará la nueva instancia de Array de acuerdo con los datos proporcionados. Es independiente del número y tipo de elementos. 

Sintaxis:

Array.of(element0, element1, element2,......elementn)

Ejemplo: en el primero hemos pasado solo un número entero, por lo que creará una array con un solo elemento, esta es una de las características que lo hace diferente del constructor de arrays. En el segundo, hemos pasado 4 valores para crear una array.

<script>
    const arr1 = Array.of(2);
    const arr2 = Array.of(7, 2, 3, 4);
    console.log(arr1);
    console.log(arr2);
</script>

Producción:

4. Método fill(): como sugiere el nombre, se usa para llenar la array o cierta parte con un único valor proporcionado. Devuelve la array original después de alguna modificación de relleno.

Sintaxis:

fill(value, start, end)

• Puede omitir el argumento de inicio y final. El valor predeterminado es 0 y la longitud de la array, respectivamente.
• No copia la array, pero modifica la original y la devuelve.

Ejemplo: Hemos creado una array en el inicio. La primera invocación para llenar el método está devolviendo la array que tiene un valor de elemento como 1 de 3 a 5 (índice exclusivo). El segundo está devolviendo la array llena de 7 desde 2 hasta el último índice. El tercero está devolviendo la array llena de 3 en todas partes.

<script>
    const arr = [8, 3, 11, 9, 6];
    console.log(arr.fill(1, 3, 5));
    console.log(arr.fill(7, 2));
    console.log(arr.fill(3));
</script>

Producción:

5. Método from(): crea una instancia copiada superficial de una array de acuerdo con el objeto iterable proporcionado, es decir, conjunto, mapa, lista de Nodes, string, etc. 

Ejemplo: en la primera invocación al método from , estamos pasando un conjunto y está devolviendo una instancia de array y, de manera similar, en la segunda hay una string.

<script>
    const set = new Set(['foo', 'bar', 'baz', 'foo']);
    console.log(Array.from(set));
  
    const str = 'string';
    console.log(Array.from(str));
</script>

Producción:

6. Método de valores(): Esto devuelve el objeto iterable de valores de la array proporcionada. 

Ejemplo: después de haber declarado la array, hay una llamada de función al método de valores que devuelve el objeto iterable de valores de la array.

<script>
    const arr = ['a', 'b', 'c', 'd'];
    const iterator = arr.values();
  
    for (const value of iterator) {
        console.log(value);
    }
</script>

Producción:

7. Método keys(): Devuelve el objeto iterable que contiene las claves de los elementos del array.

Ejemplo:

<script>
    const arr = ['a', 'b', 'c', 'd'];
    const iterator = arr.keys();
  
    for (const value of iterator) {
        console.log(value);
    }
</script>

Producción:

8. Método entry(): Devuelve el objeto iterable que contiene pares de clave y valor, donde las claves son el índice de ese elemento en la array.

Ejemplo:

<script>
    const arr = ['a', 'b', 'c', 'd'];
    const iterator = arr.entries();
  
    for (const value of iterator) {
        console.log(value);
    }
</script>

Producción:

9. Método copyWithin(): como su propio nombre lo indica, se utiliza para copiar superficialmente los elementos dentro de la misma array de una ubicación a otra. La longitud de la array permanecerá sin cambios. 

Sintaxis:

copyWithin(target, start, end);

• Puede omitir el argumento de inicio y final. El valor predeterminado es 0 y la longitud de la array, respectivamente.
• Si el objetivo se coloca después del inicio, la secuencia copiada se recortará para ajustarse a la longitud de la array .

Ejemplo: en primer lugar, hemos creado una array y luego la llamada anterior a copyWithin está copiando el contenido de la array del 4º índice al 5º índice (exclusivo) en el 0º índice de destino. Más tarde, en la siguiente llamada, está copiando el contenido de la array desde el tercer índice hasta el último (porque no se proporciona el argumento final) en el destino del segundo índice.

<script>
    const arr = [1, 2, 3, 4, 5, 6];
  
    console.log(arr.copyWithin(0, 4, 5));
    console.log(arr.copyWithin(2, 3));
</script>

Producción: