ASking about regex

Tell us what’s happening:

what represents $1 and $2 in this particular code ?

thanks.

Your code so far


function spinalCase(str) {

var regex= /\s+|_+/g;

str = str.replace(/([a-z])([A-Z])/g, "$1 $2");
console.log(str)
return str.replace(regex,"-").toLowerCase();
}

spinalCase('thisIsSpinalTap');

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.61 Safari/537.36.

Challenge: Spinal Tap Case

Link to the challenge:

This is just a convention in any RegExp engine, not just JavaScript’s.

$ indicates a positional index that starts from 1 (not 0 as opposed to iteration indices) that corresponds to a captured string that matched its corresponding capturing group.

In this particular case, $1 will refer to this capturing group: ([a-z]) and $2 will refer to ([A-Z]). So, for example, any pair of lowercase letter followed by an uppercase letter will be replaced by the the same thing but separated by a space.

1 Like

Sos de Mexico asi que te escribo en español,

ahora voy entendiendo mejor:
esto significa que si encuentra una letra minuscula seguida de una mayuscula ( g repetira esto todas las veces que sea necesario) lo reemplaza con $1 espacio $2 --> “$1 $2”
/([a-z])([A-Z])/g, “$1 $2” - gracias

Exactamente, primero trata de coincidir el patrón tal cual, en este caso es:

{{letra mayus}}{{letra minus}}

Pero eso no es todo, el patrón tiene grupos de captura utilizando la sintaxis (PATRON) con paréntesis. Estos grupos de captura los puedes referenciar de dos formas en JavaScript:

1- Utilizando $N donde N es un número entero mayor o igual a 1 que corresponde al orden de aparición de izquierda a derecha en el RegExp.
2- Dentro del mismo patrón usando la sintaxis: \N.
3- Utilizando este callback en vez de la cadena de texto directa (fíjate en los parámetros que recibe):

// Posibles firmas
function(match: string, cg1: string, index: number): string;
function(match: string, cg1: string, cg2: string, index: number): string;
function(match: string, cg1: string, cg2: string, cg3: string, index: number): string;
function(match: string, [...cgN]: string[], index: number): string;

Como puedes observar, el callback recibe:

  1. La cadena que coincide con el patrón general.
  2. Uno, Dos, Tres o más grupos de captura (la cadena que coincidió).
  3. El índice en la cadena original en donde se encontró la coincidencia.

Y lo que retorna es la cadena que reemplazará la coincidencia.


Por tanto el código se puede re-escribir así:

'aBcD'.replace(/([a-z]) ([A-Z])/g, function(_coincidencia, minus, mayus) {
  return minus + ' ' + mayus;
});
//> 'a Bc D'

La función se ejecuta cada que encuentra una coincidencia (en el caso de especificar la bandera global g.