ETZADEV
Métodos de representación y conversión en JavaScript
Compartir

Métodos de representación y conversión en JavaScript

Bienvenido a mi última publicación sobre métodos de arrays. En esta ocasión, cubriremos los métodos de "Conversión a cadena de texto" y los "Nuevos métodos de ECMAScript 2022".

Convertir a cadena de texto

Array.prototype.toString()

El método toString() devuelve una cadena de texto representando los elementos del array, separados por comas.

Sintaxis

arr.toString();

Parámetros que recibe

No recibe parámetros.

Valor que retorna

Una cadena de texto que representa los elementos del array, separados por comas.

Ejemplo

snippet.js
1let array = [1, 2, "a", "b"];
2console.log(array.toString()); // Salida: '1,2,a,b'

En este ejemplo:

  • El array original es
    snippet.txt
    1[1, 2, 'a', 'b']
    .
  • array.toString() convierte el array en una cadena de texto, devolviendo
    snippet.txt
    1'1,2,a,b'
    .

Notas Adicionales

  • El método toString() es útil para convertir un array en una cadena de texto para visualización o almacenamiento.

Array.prototype.toLocaleString()

El método toLocaleString() devuelve una cadena de texto representando los elementos del array. Los elementos son convertidos a cadenas de texto utilizando sus respectivos métodos toLocaleString().

Sintaxis

arr.toLocaleString([locales[, options]]);

Parámetros que recibe

  • locales: Una cadena con una etiqueta de idioma o una matriz de tales cadenas (opcional).
  • options: Un objeto con opciones de configuración para la representación (opcional).

Valor que retorna

Una cadena de texto que representa los elementos del array, utilizando la configuración regional específica.

Ejemplo

snippet.js
1const array1 = [1, "a", new Date("21 Dec 1997 14:12:00 UTC")];
2const localeString = array1.toLocaleString("en", { timeZone: "UTC" });
3console.log(localeString); // Salida esperada: '1,a,12/21/1997, 2:12:00 PM'

En este ejemplo:

  • El array original es
    snippet.txt
    1[1, 'a', new Date('21 Dec 1997 14:12:00 UTC')]
    .
  • array1.toLocaleString('en', { timeZone: 'UTC' }) convierte el array en una cadena de texto, utilizando la configuración regional para inglés y zona horaria UTC, devolviendo
    snippet.txt
    1'1,a,12/21/1997, 2:12:00 PM'
    .

Notas Adicionales

  • El método toLocaleString() es útil para mostrar elementos del array en un formato adecuado según la configuración regional.

Array.prototype.join()

El método join() une todos los elementos de un array en una cadena de texto y los separa con una cadena de separación especificada.

Sintaxis

arr.join([separator]);

Parámetros que recibe

  • separator: Una cadena de texto para separar cada par de elementos del array (opcional, el valor predeterminado es una coma).

Valor que retorna

Una cadena de texto que representa los elementos del array, separados por el separator especificado.

Ejemplo

snippet.js
1let array = [1, 2, 3, 4];
2console.log(array.join("-")); // Salida: '1-2-3-4'

En este ejemplo:

  • El array original es [1, 2, 3, 4].
  • array.join('-') une los elementos del array en una cadena de texto, separándolos con -, devolviendo '1-2-3-4'.

Notas Adicionales

  • El método join() es útil para crear una cadena de texto a partir de los elementos de un array, con un separador personalizado.

Nuevos métodos de ECMAScript 2022

Array.prototype.toReversed()

El método toReversed() devuelve una copia del array original con el orden de los elementos invertido. No modifica el array original.

Sintaxis

arr.toReversed();

Parámetros que recibe

No recibe parámetros.

Valor que retorna

Una nueva array con los elementos en orden inverso.

Ejemplo

snippet.js
1let array = [1, 2, 3, 4, 5];
2let reversedArray = array.toReversed();
3console.log(reversedArray); // Salida: [5, 4, 3, 2, 1]
4console.log(array); // Salida: [1, 2, 3, 4, 5]

En este ejemplo:

  • El array original es [1, 2, 3, 4, 5].
  • array.toReversed() devuelve una nueva array [5, 4, 3, 2, 1], sin modificar el array original.

Notas Adicionales

  • El método toReversed() es útil para obtener una versión invertida de un array sin alterar el array original.
  • Mejora al método reverse(), que sí modifica el array original.

Array.prototype.toSorted()

El método toSorted() devuelve una copia del array original con los elementos ordenados según una función de comparación opcional. No modifica el array original.

Sintaxis

arr.toSorted([compareFunction]);

Parámetros que recibe

  • compareFunction: Una función que define el orden de los elementos (opcional).

Valor que retorna

Una nueva array con los elementos ordenados.

Ejemplo

snippet.js
1let array = [3, 1, 4, 1, 5, 9];
2let sortedArray = array.toSorted((a, b) => a - b);
3console.log(sortedArray); // Salida: [1, 1, 3, 4, 5, 9]
4console.log(array); // Salida: [3, 1, 4, 1, 5, 9]

En este ejemplo:

  • El array original es [3, 1, 4, 1, 5, 9].
  • array.toSorted((a, b) => a - b) devuelve una nueva array [1, 1, 3, 4, 5, 9], sin modificar el array original.

Notas Adicionales

  • El método toSorted() es útil para obtener una versión ordenada de un array sin alterar el array original.
  • Mejora al método sort(), que sí modifica el array original.

Array.prototype.toSpliced()

El método toSpliced() devuelve una copia del array original con algunos elementos eliminados y/o agregados. No modifica el array original.

Sintaxis

snippet.js
1arr.toSpliced(start, deleteCount[, item1[, item2[, ...]]]);

Parámetros que recibe

  • start: El índice donde comenzar a cambiar el array.
  • deleteCount: El número de elementos a eliminar.
  • snippet.txt
    1item1, item2, ...
    : Los elementos a agregar al array (opcional).

Valor que retorna

Una nueva array con los elementos modificados.

Ejemplo

snippet.js
1let array = [1, 2, 3, 4, 5];
2let splicedArray = array.toSpliced(2, 1, "a", "b");
3console.log(splicedArray); // Salida: [1, 2, 'a', 'b', 4, 5]
4console.log(array); // Salida: [1, 2, 3, 4, 5]

En este ejemplo:

  • El array original es [1, 2, 3, 4, 5].
  • array.toSpliced(2, 1, 'a', 'b') devuelve una nueva array
    snippet.txt
    1[1, 2, 'a', 'b', 4, 5]
    , sin modificar el array original.

Notas Adicionales

  • El método toSpliced() es útil para obtener una versión modificada de un array sin alterar el array original.
  • Mejora al método splice(), que sí modifica el array original.

Espero que esta serie de publicaciones te haya ayudado a comprender mejor los métodos de arrays en JavaScript. Con estas herramientas, podrás manipular y transformar arrays de manera más efectiva y eficiente. ¡Sigue practicando y explorando nuevas formas de mejorar tu código!

comentario.formNuevo

* Tu correo electrónico permanecerá privado. Los campos requeridos están señalados con *