ES6: algunos métodos comunes agregados a las cadenas

0, algunos métodos nuevos

Introduzca algunos métodos comunes recién agregados por los objetos de cadena de ES6.

nombre del método	describir
includes()	Devuelve un valor booleano que indica si se encontró la cadena del argumento.
startsWith()	Devuelve un valor booleano que indica si la cadena del parámetro está al principio de la cadena original.
endsWith()	Devuelve un valor booleano que indica si la cadena del argumento está al final de la cadena original.
repeat()	repeatEl método devuelve una nueva cadena, lo que significa repetir la cadena original n.
padStart()	Se utiliza para completar el encabezado, el primer parámetro es la longitud máxima para que la finalización surta efecto y el segundo parámetro es la cadena utilizada para la finalización.
padEnd()	Se utiliza para la finalización de cola, el primer parámetro es la longitud máxima para que la finalización surta efecto y el segundo parámetro es la cadena utilizada para la finalización.
trimStart()	Eliminar espacios desde el principio de una cadena.
trimEnd()	eliminar espacios finales
replace()	Sólo se puede reemplazar el primer carácter coincidente.
replaceAll()	Puede reemplazar todos los caracteres coincidentes a la vez
at()	Devuelve el carácter en la posición de índice especificada por el parámetro, admite índice negativo (es decir, la posición recíproca)

1, incluye(), comienza con () y termina con ()

Tradicionalmente, JavaScript sólo tiene indexOfmétodos que pueden usarse para determinar si una cadena está contenida dentro de otra cadena. ES6 proporciona tres nuevos métodos;

• incluye() : Devuelve un valor booleano que indica si se encontró la cadena del argumento.
• comienza con () : devuelve un valor booleano que indica si la cadena del parámetro está al principio de la cadena original.
• terminaCon() : Devuelve un valor booleano que indica si la cadena del parámetro está al final de la cadena original.

      let like = "Eula - Amber";
      console.log( like.startsWith("Eula"));// true
      console.log( like.endsWith("Amber")); // true
      console.log(like.includes("-"));      // true

Los tres métodos admiten un segundo parámetro, que indica dónde iniciar la búsqueda.

      let like2 = "Kaya"
      console.log(like2.startsWith("K",0)); // true
      console.log(like2.endsWith("a",2)); // true 针对前n个字符中查找
      console.log(like2.endsWith("a",4)); // true 针对前n个字符中查找
      console.log(like2.includes("y",2)); // true 

El código anterior indica que cuando se utiliza el segundo parámetro n, endsWithel comportamiento es diferente al de los otros dos métodos. Funciona con el primer ncarácter, mientras que los otros dos métodos funcionan desde la primera nposición hasta el final de la cadena.

2, repetir()

repeatEl método devuelve una nueva cadena, lo que significa repetir la cadena original n.

      console.log("*".repeat(50));
      console.log("|==".repeat(18)); 
      console.log("Eula-".repeat(10)); 
      console.log("*".repeat(50));

Se imprime de la siguiente manera:

**************************************************
|==|==|==|==|==|==|==|==|==|==|==|==|==|==|==|==|==|==
Eula-Eula-Eula-Eula-Eula-Eula-Eula-Eula-Eula-Eula-
**************************************************

Si el parámetro es decimal, se redondeará hacia arriba.

 console.log('xiao'.repeat(2.1));//xiaoxiao
 console.log('xiao'.repeat(2.9));//xiaoxiao

Si repeatel parámetro es negativo o Infinity, se informará un error.

 console.log('xiao'.repeat(Infinity));//Invalid count value: Infinity
 console.log('xiao'.repeat(-1));//  Invalid count value: -1

Sin embargo, si el argumento es un decimal entre 0 y -1, equivale a 0, porque el redondeo se produce primero. Decimales entre 0 y -1, iguales a después del redondeo -0, repeatconsiderados 0.

 console.log('xiao'.repeat(-0.9) ); // ""  空串

Si repeatel argumento es una cadena, primero se convertirá en un número.

 console.log('xiao'.repeat('aa')); // ""  空串
 console.log('xiao'.repeat('3') );// xiaoxiaoxiao

3、padInicio()、padEnd()

La función de la longitud de finalización de la cadena. Si una cuerda no es lo suficientemente larga, se completará en la cabeza o en la cola. padStart()Para completar la cabeza, padEnd()para completar la cola.

Uso básico:

padStart()y padEnd()acepta un total de dos parámetros, el primer parámetro es la longitud máxima de finalización de la cadena y el segundo parámetro es la cadena utilizada para completar.

   console.log("x".padStart(2,0));// 0x
   console.log("x".padStart(5,0));// 0000x
   console.log("x".padEnd(2,'0'));// x0
   console.log("x".padEnd(5,'0'));// x0000

Si la suma de las longitudes de la cadena utilizada para completar y la cadena original excede la longitud máxima, la cadena completa que exceda el número de dígitos se truncará.

'abc'.padStart(10, '0123456789')
// '0123456abc'

Si se omite el segundo parámetro, la longitud se rellena con espacios de forma predeterminada.

'x'.padStart(4) // '   x'
'x'.padEnd(4) // 'x   '

padStart()Un uso común de es completar el frente de la fecha y el mes 0; los siguientes casos:

  let str = new Date();
  console.log(new Date().toLocaleDateString()); // 2023/8/2
  let month = (str.getMonth() + 1).toString();
  console.log(month.padStart(2, "0")); // 08

4，recortarInicio()、recortarFin()

Se agregaron trimStart()estos trimEnd()dos métodos. Se comportan trim()igual que , trimStart()eliminando los espacios en blanco iniciales de la cadena y trimEnd()eliminando los espacios en blanco finales. Todos devuelven cadenas nuevas y no modifican la cadena original.

      const lik3 = "  Eula  ";
      console.log( lik3.trim());      // 'Eula'
      console.log( lik3.trimStart()); // 'Eula  '
      console.log( lik3.trimEnd());   // '   Eula'

En el código anterior, trimStart()solo se eliminan los espacios iniciales y se conservan los espacios finales. trimEnd()También es un comportamiento similar.

Además de la tecla de espacio, estos dos métodos también son válidos para símbolos en blanco invisibles, como la tecla de tabulación y el salto de línea al principio (o al final) de la cadena.

5, reemplazar todo()

Anteriormente, los métodos de instancia para String replace()solo podían reemplazar la primera coincidencia.

'aabbcc'.replace('b', '_')
// 'aa_bcc'

En el ejemplo anterior, replace()sólo el primero se breemplaza con un guión bajo.

Si desea reemplazar todas las coincidencias, debe utilizar gmodificadores de expresiones regulares.

'aabbcc'.replace(/b/g, '_')
// 'aa__cc'

Después de todo, las expresiones regulares no son tan convenientes e intuitivas, ES6 introduce replaceAll()métodos para reemplazar todas las coincidencias a la vez.

'aabbcc'.replaceAll('b', '_')
// 'aa__cc'

Se utiliza de replace()la misma manera y devuelve una nueva cadena sin cambiar la cadena original.

String.prototype.replaceAll(searchValue, replacement)

Si es una expresión regular searchValuesin modificadores, se informará un error. Esto es diferente.greplaceAll()replace()

// 不报错
'aabbcc'.replace(/b/, '_')

// 报错
'aabbcc'.replaceAll(/b/, '_')

En el ejemplo anterior, /b/sin gmodificadores, se informará un error replaceAll().

replaceAll()El segundo parámetro de replacementes una cadena que representa el texto reemplazado, donde se pueden usar algunas cadenas especiales.

• $&: La cadena que debe coincidir.
• $`: Coincide con el texto que precede al resultado.
• $': El texto que sigue al resultado coincidente.
• $n: El contenido del primer ngrupo coincidente nes un número natural que comienza en 1. El requisito previo para que este parámetro surta efecto es que el primer parámetro debe ser una expresión regular.
• $$: Hace referencia al signo del dólar $.

A continuación se muestran algunos ejemplos.

// $& 表示匹配的字符串，即`b`本身
// 所以返回结果与原字符串一致
'abbc'.replaceAll('b', '$&')
// 'abbc'

// $` 表示匹配结果之前的字符串
// 对于第一个`b`，$` 指代`a`
// 对于第二个`b`，$` 指代`ab`
'abbc'.replaceAll('b', '$`')
// 'aaabc'

// $' 表示匹配结果之后的字符串
// 对于第一个`b`，$' 指代`bc`
// 对于第二个`b`，$' 指代`c`
'abbc'.replaceAll('b', `$'`)
// 'abccc'

// $1 表示正则表达式的第一个组匹配，指代`ab`
// $2 表示正则表达式的第二个组匹配，指代`bc`
'abbc'.replaceAll(/(ab)(bc)/g, '$2$1')
// 'bcab'

// $$ 指代 $
'abc'.replaceAll('b', '$$')
// 'a$c'

replaceAll()Además de ser una cadena, el segundo parámetro de replacementtambién puede ser una función, y el valor de retorno de esta función reemplazará searchValueel texto que coincide con el primer parámetro.

'aabbcc'.replaceAll('b', () => '_')
// 'aa__cc'

En el ejemplo anterior, replaceAll()el segundo parámetro de es una función cuyo valor de retorno reemplazará todas blas coincidencias.

6, en()

at()El método acepta un número entero como parámetro, devuelve el carácter en la posición especificada por el parámetro y admite índices negativos (es decir, la posición del recíproco).

  const str = "Eula";
  console.log( str.at(1)); // E
  console.log( str.at(1)); // u
  console.log( str.at(-1));// a

Si la posición del parámetro está fuera del rango de la cadena, at()devuelveundefined

  console.log( str.at(10)); // undefined