Métodos de cadenas de JavaScript

Los métodos de cadena ayudan a manejar cadenas.

Métodos y propiedades de cadena

Los valores originales, como "Bill Gates", no pueden tener propiedades y métodos (porque no son objetos).

Pero a través de JavaScript, los métodos y propiedades también se pueden usar en valores originales, porque JavaScript considera los valores originales como objetos cuando se ejecutan métodos y propiedades.

Longitud de la cadena

longitud La propiedad devuelve la longitud de una cadena:

Ejemplo

var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var sln = txt.length;

Prueba tu suerte

Buscar una cadena dentro de una cadena

indexOf() El método devuelve el texto específico en una cadena:PrimeraÍndice de aparición (posición):

Ejemplo

var str = "El nombre completo de China es la República Popular China.";
var pos = str.indexOf("China");

Prueba tu suerte

JavaScript comienza a contar desde cero.

0 es la primera posición de la cadena, 1 es la segunda, 2 es la tercera...

lastIndexOf() El método devuelve la posición de un texto específico en una cadena:ÚltimoÍndice de una aparición:

Ejemplo

var str = "El nombre completo de China es la República Popular China.";
var pos = str.lastIndexOf("China");

Prueba tu suerte

Si no se encuentra el texto: indexOf() Y lastIndexOf() Ambos devuelven -1.

Ejemplo

var str = "El nombre completo de China es la República Popular China.";
var pos = str.indexOf("USA");

Prueba tu suerte

Ambos métodos aceptan un segundo parámetro como la posición de inicio de la búsqueda.

Ejemplo

var str = "El nombre completo de China es la República Popular China.";
var pos = str.indexOf("China", 18);

Prueba tu suerte

lastIndexOf() El método busca hacia atrás (desde el final hacia el principio), lo que significa: si el segundo parámetro es 50, se comenzará a buscar desde la posición 50 hasta el inicio de la cadena.

Ejemplo

var str = "El nombre completo de China es la República Popular China.";
var pos = str.lastIndexOf("China", 50);

Prueba tu suerte

Buscar una cadena dentro de una cadena

search() El método busca una cadena específica dentro de una cadena y devuelve la posición de coincidencia:

Ejemplo

var str = "El nombre completo de China es la República Popular China.";
var pos = str.search("locate");

Prueba tu suerte

¿Te has dado cuenta?

dos métodos,indexOf() y search(), esIguales.

Estos dos métodos no son iguales. La diferencia radica en:

  • El método search() no puede configurar el segundo parámetro de inicio de ubicación.
  • El método indexOf() no puede configurar valores de búsqueda más poderosos (expresiones regulares).

Vamos aExpresiones regularesaprender estos valores de búsqueda más poderosos.

Extraer parte de la cadena de texto

Hay tres métodos para extraer partes de una cadena de texto:

  • slice(inicio, final)
  • substring(inicio, final)
  • substr(inicio, longitud)

Método slice()

slice() Extraer una parte de la cadena y devolver la parte extraída en una nueva cadena.

Este método establece dos parámetros: el índice de inicio (ubicación de inicio), el índice de finalización (ubicación de final).

Este ejemplo recorta el fragmento desde la posición 7 hasta la posición 13 de la cadena:

Ejemplo

var str = "Apple, Banana, Mango";
var res = str.slice(7,13);

El resultado de res es:

Banana

Prueba tu suerte

Si algún parámetro es negativo, se comienza a contar desde el final de la cadena.

Este ejemplo recorta el fragmento desde la posición -12 hasta la posición -6 de la cadena:

Ejemplo

var str = "Apple, Banana, Mango";
var res = str.slice(-13,-7);

El resultado de res es:

Banana

Prueba tu suerte

Si se omite el segundo parámetro, este método recortará la parte restante de la cadena:

Ejemplo

var res = str.slice(7);

Prueba tu suerte

O contar desde el final:

Ejemplo

var res = str.slice(-13);

Prueba tu suerte

Consejo:Las posiciones de valor negativo no son aplicables en Internet Explorer 8 y versiones anteriores.

Método substring()

substring() es similar a slice().

La diferencia radica en substring() No se puede aceptar un índice negativo.

Ejemplo

var str = "Apple, Banana, Mango";
var res = str.substring(7,13);

El resultado de res es:

Banana

Prueba tu suerte

Si se omite el segundo parámetro, este substring() recorta la parte restante de la cadena.

Método substr()

substr() es similar a slice().

La diferencia radica en que el segundo parámetro especifica la parteLongitud.

Ejemplo

var str = "Apple, Banana, Mango";
var res = str.substr(7,6);

El resultado de res es:

Banana

Prueba tu suerte

Si se omite el segundo parámetro, este substr() recortará la parte restante de la cadena.

Ejemplo

var str = "Apple, Banana, Mango";
var res = str.substr(7);

Prueba tu suerte

El resultado de res es:

Banana, Mango

Si el primer parámetro es negativo, se calcula la posición desde el final de la cadena.

Ejemplo

var str = "Apple, Banana, Mango";
var res = str.substr(-5);

Prueba tu suerte

El resultado de res es:

Mango

El segundo parámetro no puede ser negativo, ya que define la longitud.

Contenido de la cadena de reemplazo

replace() El método reemplaza un valor en otro valor especificado en la cadena:

Ejemplo

str = "Por favor, visita Microsoft!";
var n = str.replace("Microsoft", "W3School");

Prueba tu suerte

replace() El método no cambia la cadena que lo llama. Regresa una nueva cadena.

Por defecto,replace() solo reemplaza la primera coincidencia:

Ejemplo

str = "Por favor, visita Microsoft y Microsoft!";
var n = str.replace("Microsoft", "W3School");

Prueba tu suerte

Por defecto,replace() Sensible a mayúsculas y minúsculas. Por lo tanto, no coincide con MICROSOFT:

Ejemplo

str = "Por favor, visita Microsoft!";
var n = str.replace("MICROSOFT", "W3School");

Prueba tu suerte

Para realizar un reemplazo insensible a mayúsculas y minúsculas, usa la expresión regular /i（insensible a mayúsculas y minúsculas):

Ejemplo

str = "Por favor, visita Microsoft!";
var n = str.replace(/MICROSOFT/i, "W3School");

Prueba tu suerte

Por favor, ten en cuenta que las expresiones regulares no llevan comillas.

Para reemplazar todos los coincidencias, usa g Símbolo (usado para búsqueda global):

Ejemplo

str = "Por favor, visita Microsoft y Microsoft!";
var n = str.replace(/Microsoft/g, "W3School");

Prueba tu suerte

Aprenderás más sobre expresiones regulares en el capítulo de expresiones regulares en JavaScriptExpresiones regularesdel contenido.

Convertir a mayúsculas y minúsculas

A través de toUpperCase() Convertir una cadena a mayúsculas:

Ejemplo

var text1 = "Hello World!";       // Cadena
var text2 = text1.toUpperCase();  // text2 es la versión en mayúsculas de text1

Prueba tu suerte

A través de toLowerCase() Convertir una cadena a minúsculas:

Ejemplo

var text1 = "Hello World!";       // Cadena
var text2 = text1.toLowerCase();  // text2 es la versión en minúsculas de text1

Prueba tu suerte

Método concat()

concat() Conectar dos o más cadenas:

Ejemplo

var text1 = "Hello";
var text2 = "World";
text3 = text1.concat(" ",text2);

Prueba tu suerte

concat() Los métodos se pueden usar en lugar del operador de suma. Las siguientes dos líneas son equivalentes:

Ejemplo

var text = "Hello" + " " + "World!";
var text = "Hello".concat(" ","World!");

Todos los métodos de cadena retornan una nueva cadena. No modifican la cadena original.

En términos formales: una cadena es inmutable: no se puede modificar, solo se puede reemplazar.

String.trim()

trim() El método elimina los espacios en blanco en los extremos de la cadena:

Ejemplo

var str = "       Hello World!        ";
alert(str.trim());

Advertencia:Internet Explorer 8 o versiones anteriores no lo soportan trim() Método.

Prueba tu suerte

Para soportar IE 8, puede usar expresiones regulares con este método. replace() Método en sustitución de:

Ejemplo

var str = "       Hello World!        ";
alert(str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, ''));

Prueba tu suerte

También puede usar el esquema de replace anterior para agregar la función trim a JavaScript String.prototype:

Ejemplo

if (!String.prototype.trim) {
  String.prototype.trim = function () {
    return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
};
var str = "       Hello World!        ";
alert(str.trim());

Prueba tu suerte

Extraer caracteres de una cadena

Estos son dos métodos para extraer caracteres de una cadena:SeguroMétodo:

  • charAt(posición)
  • charCodeAt(posición)

Método charAt()

charAt() El método devuelve la cadena en la posición especificada (índice):

Ejemplo

var str = "HELLO WORLD";
str.charAt(0);            // Devuelve H

Prueba tu suerte

Método charCodeAt()

charCodeAt() El método devuelve la codificación unicode del carácter en la posición especificada de la cadena:

Ejemplo

var str = "HELLO WORLD";
str.charCodeAt(0);         // Devuelve 72

Prueba tu suerte

Acceso a propiedades (Property Access)

ECMAScript 5 (2009) permite el acceso a propiedades de las cadenas [ ]:

Ejemplo

var str = "HELLO WORLD";
str[0];                   // Devuelve H

Prueba tu suerte

El acceso a propiedades es un poco inestable:

  • No es compatible con Internet Explorer 7 o versiones anteriores
  • Hace que la cadena se vea como un array (pero no lo es)
  • si no se encuentra el carácter,[ ] Devuelve undefinedmientras que charAt() Devuelve una cadena vacía.
  • Es de solo lectura.str[0] = "A" No produce error (¡pero tampoco funcionará!)

Ejemplo

var str = "HELLO WORLD";
str[0] = "A";             // No produce error, pero no funcionará
str[0];                   // Devuelve H

Prueba tu suerte

Consejo:Si desea manejar una cadena como un array, puede convertirla primero en un array.

Convertir una cadena en un array

Puede hacerlo a través de split() Convertir una cadena en un array:

Ejemplo

var txt = "a,b,c,d,e";   // Cadenas
txt.split(",");          // Separar con una coma
txt.split(" ");          // Separar con un espacio
txt.split("|");          // Separar con una barra vertical

Prueba tu suerte

Si se omite el separador, el array devuelto contendrá la cadena completa en el índice [0].

Si el separador es "\"", el array devuelto será un array que separa caracteres individuales:

Ejemplo

var txt = "Hello";       // Cadenas
txt.split("\""

Prueba tu suerte

Manual de referencia completo de String

Para obtener un manual de referencia completo, visite nuestro Manual de referencia de cadenas de JavaScript.

Este manual incluye descripciones e instancias de todas las propiedades y métodos de las cadenas.