Eliminar espacios en blanco de un string con Javascript

Descripción

En ocasiones, ya sea para capturar datos correctamente o para limpiar una cadena de texto nos resulta muy útil contar con un método que permita eliminar los espacios en blanco, para ello Javascript nos proporciona trim(), trimStart() y trimEnd().

const texto = "    Texto de ejemplo     "
let procesado

// trimStart() elimina los espacios en blanco al principio de nuestra cadena
procesado = texto.trimStart()  // > "Texto de ejemplo     "

// trimEnd() elimina el espacio al final de nuestra cadena
procesado = texto.trimEnd()  // > "    Texto de ejemplo"

// trim() elimina los espacios a ambos lados de nuestra cadena
procesado = texto.trim()  // > "Texto de ejemplo"

Otra forma menos recomendada de hacerlo es llamar al método directamente con tu cadena de texto:

"    Texto de ejemplo     ".trim() // > "Texto de ejemplo"

Eliminar TODOS los espacios en blanco del string

Si tu objetivo va mas allá de remover espacios al principio o al final y quieres desaparecer todos los espacios en blanco de tu cadena de texto, pueden ser útiles este par de métodos:

Método 1: replace() y Regex

El metodo replace() nos permite reemplazar una expresión por otra dentro de un string el cual acepta expresiones regulares o Regex en sus parametros. Con esto podemos tomar los espacios y removerlos.

const texto = "    Texto de ejemplo     "
let procesado

// replace() usando una expresión Regex para reemplazar espacios en blanco
procesado = texto.replace(/\s+/g, '')  // > "Textodeejemplo"

Nuestro regex es: /\s+/g

• \s: selecciona espacios en blanco, tabulaciones y saltos de linea.
• +: en conjunto con \s sirve para tomar espacios consecutivos, de esta forma si hay 1 o mas espacios seguidos se eliminaran en conjunto.
• g: permite repetir el proceso a lo largo del string o cadena, de otra forma solo se eliminaría el primer espacio encontrado

Método 2: split() y join()

El método split() sirve para separar una cadena de texto en múltiples arreglos mediante un parámetro «separador», en este caso los espacios funcionan como tal.

Mientras tanto el metodo join() convierte un arreglo en un string usando igualmente un separador como parámetro, para lograr eliminar los espacios nuestro separador será "" y de esta forma obtendremos una cadena de texto unificada.

const texto = "    Texto de ejemplo     "
let procesado

// split() y join() como métodos alternativo para eliminar espacios
procesado = texto.split(" ").join("") // > "Textodeejemplo"

Normalmente suelo usar la versión con replace() y regex pero esta es una buena alternativa para lograr el mismo resultado.

Espero que este post haya sido de utilidad para ti, compártelo con alguien que lo necesite y recuerda que puedes encontrar más trucos y snippets como este en: https://pixonauta.com/snippets/

Enlaces de referencia:

• https://www.w3schools.com/jsref/jsref_trim_string.asp
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/trimStart
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/trimEnd
• https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/split
• https://www.w3schools.com/jsref/jsref_replace.asp