Cómo eliminar espacios en blanco/caracteres de una cadena en JavaScript

Introducción

A medida que aspira a convertirse en un mejor desarrollador de JavaScript, es conveniente que comprenda algunos trucos y métodos en JavaScript para salvarse de errores innecesarios que son difíciles de descifrar en el futuro. Cada vez que los usuarios ingresan valores de cadena a través de campos de formulario, se recomienda eliminar los espacios en blanco del principio y el final de las cadenas y todos los caracteres innecesarios. La entrada rara vez es limpia y la entrada sucia puede, en algunos casos, romper una aplicación.

En esta guía, exploraremos diferentes métodos sobre cómo recortar caracteres de cadenas en JavaScript y cuándo usar cuáles.

Eliminando espacios en blanco de las cadenas

El espacio en blanco se define como espacio vacío, es decir, espacio sin representación visual, pero espacio que existe para separar dos caracteres. Estos espacios se crean usando las teclas del teclado de la computadora. barra espaciadora y Pestañasasí como caracteres de nueva línea o finales de línea como n, t, r.

Notar: Adornar una cadena generalmente se refiere a adornar izquierda, derecha o más comúnmente ambos lados de una cuerda. La mayoría de las veces eliminamos posibles espacios en blanco alrededor de la cadena, pero también podemos eliminar otros caracteres.

JavaScript proporciona tres funciones para ayudarnos a recortar las cadenas que ingresan a nuestra base de datos o aplicación desde los campos de entrada.

Recortar cadenas Whistspaces en JavaScript con adornar()

trim() es un método de cadena incorporado que se usa para, bueno, cortar una cadena. El método elimina los espacios en blanco de ambos extremos de una cadena y los devuelve:

string.trim();

Vamos a crear un username - con un doble espacio en blanco al principio y un solo espacio en blanco al final:

let username = '  John Doe ';
let trimmed = username.trim();

console.log(trimmed);

Esto se explica por:

John Doe

trim() no funciona en el lugar, porque las cadenas son inmutables. Devuelve una cadena recortada, por lo que capturamos el valor devuelto y lo imprimimos.

Notar: Si se encuentra un espacio en blanco entre dos caracteres, se conserva el espacio en blanco. Sólo están separados de la comenzar y terminar de una cadena

El método también se utiliza para eliminar finales de línea como n, t, retc. Por ejemplo, digamos que hay un villano lengua justo antes de un número de serie y un nueva línea descanso después de:

let serialNumber = 't  011-34201 n';
console.log('Untrimmed: ', serialNumber)
console.log('Trimmed: ', serialNumber.trim());

Esto se explica por:

Untrimmed:	   011-34201 
Trimmed: 011-34201

De nuevo, trim() funciona eliminando espacios de los dos lados Sin embargo, a veces es posible que desee cortar solo uno de los lados. Aquí es donde usted elegirá usar el trimStart() y trimEnd() métodos en su lugar.

Cortar el comienzo de la cuerda con recortarInicio()

Similar a trim() método y como su nombre indica, trimStart() se utiliza para eliminar los espacios en blanco y los finales de línea solo desde el principio de una cadena. Por ejemplo:

let company = '  Stack Abuse  ';
company.trimStart(); 
  
let serialNumber = 't  011-34201 n';
serialNumber.trimStart(); 

En el ejemplo anterior, notará que se eliminó el espacio al comienzo del nombre de la empresa. La misma lógica se aplica a la nueva línea todavía presente en el serialNumber.

Cortar el extremo de la cuerda con recortarFin()

trimEnd() es lo contrario de trimStart() y, como sugiere el nombre, se usa para eliminar espacios y finales de línea solo desde el final de una cadena. Por ejemplo:

let company = '  Stack Abuse  ';
company.trimEnd(); 
  
let serialNumber = 't  011-34201 n';
serialNumber.trimEnd(); 

En el ejemplo anterior, notará que en lugar de afectar el inicio como el de trimStart()se afectó el final eliminando el espacio así como el terminador de línea.

Recorta todos los espacios en blanco de las cadenas

Continuando, ahora veamos cómo recortar todos los espacios en blanco usando expresiones regulares. Hasta ahora solo hemos visto cómo eliminar espacios al principio o al final de nuestras cadenas; ahora veamos cómo eliminar todos espacios en blanco

Esto es posible usando JavaScript string.replace() que admite expresiones regulares (RegEx) y ayuda a encontrar coincidencias en una cadena en particular. replace() toma dos argumentos, el primero es la expresión regular que coincide con lo que queremos eliminar y el segundo es el patrón que nos gustaría insertar en lugar del primero.

Si desea obtener más información sobre las expresiones regulares, lea nuestra Guía de expresiones regulares y cadenas coincidentes en JavaScript.

Ahora compongamos una expresión regular para manejar la eliminación de todos los espacios en blanco de las cadenas:

  • s: coincide con cualquier símbolo de espacio en blanco, como espacios, tabulaciones y saltos de línea.
  • +: coincide con uno o más de los tokens anteriores (haciendo referencia s).
  • g: Se coloca al final para indicar una búsqueda iterativa a través de toda la cadena.

Consulte nuestra guía útil y práctica para aprender Git, con las mejores prácticas, los estándares aceptados por la industria y la hoja de trucos incluida. Deja de buscar en Google los comandos de Git y, de hecho, aprender ¡esta!

Ahora combinemos este RegEx y usémoslo para eliminar espacios antes y después de las cadenas:

let sentence = '    I and the man decided   to move  ouT  ';
let trimmed = sentence.replace(/s+/g, ''); 
  
console.log('Untrimmed: ', sentence)
console.log('Trimmed: ', trimmed);

Esto se explica por:

Untrimmed:     I and the man decided   to move  ouT  
Trimmed: IandthemandecidedtomoveouT

En el ejemplo anterior, eliminamos los espacios y los reemplazamos con una cadena vacía.

Cortar caracteres arbitrarios con JavaScript

Al usar expresiones regulares y string.replace() método: no está limitado a eliminar espacios en blanco. Realmente puedes cortar cualquier cosa modeloy los patrones de expresiones regulares son bastante flexibles.

Solo necesitamos derivar una expresión RegEx particular basada en los caracteres arbitrarios que desea eliminar. Supongamos que queremos eliminar un carácter en particular del principio y otro del final de una cadena:

let example = "cccccccccccccccccccccI know the manaaaaaaaaaaaaaaaaaaaa";
let show = example.replace(/c+/, "").replace(/a+$/, "");
console.log(show); 

O también podríamos trabajar cualquier patrón arbitrario, como cualquier número entre 0 y 9:

let example = "1234567890I know the man1234567890";
let show = example.replace(/^[0-9]+/, '').replace(/[0-9]+$/, '');
console.log(show); 

Dividir un carácter de un índice particular con JavaScript

Finalmente, se puede usar otro método de cadena incorporado para cortar cadenas, en función de un índice particular. los substr() método subcadenas una cadena y devuelve el subconjunto como una nueva cadena. Se utiliza para extraer las partes de la cadena entre el índice inicial y el final dados.

Para eliminar el primer carácter de una cadena, debemos cortar en el índice 1y establecer el segundo parámetro como length cadena :

let username = 'John Doe';
console.log('Original Name: ', username);
  
let newName = username.substr(1, username.length);
console.log('After removing the first character: ', newName);

Esto se explica por:

Original Name: John Doe
After removing the first character: ohn Doe

Conclusión

En esta guía, analizamos cómo eliminar los espacios en blanco de las cadenas, ya sea al principio, al final o en ambos extremos de la cadena, en JavaScript.

exploramos el trim(), trimStart() y trimEnd() métodos, que recortan automáticamente los espacios en blanco. Luego exploramos el uso de expresiones regulares para reemplazar patrones de espacios en blanco con cadenas vacías. Además, luego exploramos reemplazar cualquier patrón arbitrario en las cadenas con cualquier otro patrón en su lugar.

Finalmente, echamos un vistazo a substr() método, para crear subcadenas y recortar caracteres con un start y end pista.

Si quieres conocer otros artículos parecidos a Cómo eliminar espacios en blanco/caracteres de una cadena en JavaScript puedes visitar la categoría Código.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Subir

Esta página web utiliza cookies para analizar de forma anónima y estadística el uso que haces de la web, mejorar los contenidos y tu experiencia de navegación. Para más información accede a la Política de Cookies . Ver mas