diff --git a/9-regular-expressions/17-regexp-methods/article.md b/9-regular-expressions/17-regexp-methods/article.md index e4044361f..00d50c7a5 100644 --- a/9-regular-expressions/17-regexp-methods/article.md +++ b/9-regular-expressions/17-regexp-methods/article.md @@ -1,30 +1,30 @@ -# Methods of RegExp and String +# Métodos de RegExp y String -In this article we'll cover various methods that work with regexps in-depth. +En este artículo vamos a abordar varios métodos que funcionan con expresiones regulares a fondo. ## str.match(regexp) -The method `str.match(regexp)` finds matches for `regexp` in the string `str`. +El método `str.match(regexp)` encuentra coincidencias para las expresiones regulares (`regexp`) en la cadena (`str`). -It has 3 modes: +Tiene 3 modos: -1. If the `regexp` doesn't have flag `pattern:g`, then it returns the first match as an array with capturing groups and properties `index` (position of the match), `input` (input string, equals `str`): +1. Si la expresión regular (`regexp`) no tiene la bandera `pattern:g`, retorna un array con los grupos capturados y las propiedades `index` (posición de la coincidencia), `input` (cadena de entrada, igual a `str`): ```js run let str = "I love JavaScript"; let result = str.match(/Java(Script)/); - alert( result[0] ); // JavaScript (full match) - alert( result[1] ); // Script (first capturing group) + alert( result[0] ); // JavaScript (toda la coincidencia) + alert( result[1] ); // Script (primer grupo capturado) alert( result.length ); // 2 // Additional information: alert( result.index ); // 0 (match position) - alert( result.input ); // I love JavaScript (source string) + alert( result.input ); // I love JavaScript (cadena de entrada) ``` -2. If the `regexp` has flag `pattern:g`, then it returns an array of all matches as strings, without capturing groups and other details. +2. Si la expresión regular (`regexp`) tiene la bandera `pattern:g`, retorna un array de todas las coincidencias como cadenas, sin capturar grupos y otros detalles. ```js run let str = "I love JavaScript"; @@ -34,9 +34,9 @@ It has 3 modes: alert( result.length ); // 1 ``` -3. If there are no matches, no matter if there's flag `pattern:g` or not, `null` is returned. +3. Si no hay coincidencias, no importa si tiene la bandera `pattern:g` o no, retorna `null` . - That's an important nuance. If there are no matches, we don't get an empty array, but `null`. It's easy to make a mistake forgetting about it, e.g.: + Esto es algo muy importante. Si no hay coincidencias, no vamos a obtener un array vacío, pero sí un `null`. Es fácil cometer un error olvidándolo, ej.: ```js run let str = "I love JavaScript"; @@ -47,7 +47,7 @@ It has 3 modes: alert(result.length); // Error: Cannot read property 'length' of null ``` - If we want the result to be an array, we can write like this: + Si queremos que el resultado sea un array, podemos escribirlo así: ```js let result = str.match(regexp) || []; @@ -57,17 +57,17 @@ It has 3 modes: [recent browser="new"] -The method `str.matchAll(regexp)` is a "newer, improved" variant of `str.match`. +El método `str.matchAll(regexp)` es una variante ("nueva y mejorada") de `str.match`. -It's used mainly to search for all matches with all groups. +Es usado principalmente para buscar por todas las coincidencias con todos los grupos. -There are 3 differences from `match`: +Hay 3 diferencias con `match`: -1. It returns an iterable object with matches instead of an array. We can make a regular array from it using `Array.from`. -2. Every match is returned as an array with capturing groups (the same format as `str.match` without flag `pattern:g`). -3. If there are no results, it returns not `null`, but an empty iterable object. +1. Retorna un objeto iterable con las coincidencias en lugar de un array. Podemos convertirlo en un array usando el método `Array.from`. +2. Cada coincidencia es retornada como un array con los grupos capturados (el mismo formato de `str.match` sin la bandera `pattern:g`). +3. Si no hay resultados, no retorna `null`, pero sí un objeto iterable vacío. -Usage example: +Ejemplo de uso: ```js run let str = '

Hello, world!

'; @@ -75,9 +75,9 @@ let regexp = /<(.*?)>/g; let matchAll = str.matchAll(regexp); -alert(matchAll); // [object RegExp String Iterator], not array, but an iterable +alert(matchAll); // [object RegExp String Iterator], no es un array, pero sí un objeto iterable -matchAll = Array.from(matchAll); // array now +matchAll = Array.from(matchAll); // ahora es un array let firstMatch = matchAll[0]; alert( firstMatch[0] ); //

@@ -86,97 +86,97 @@ alert( firstMatch.index ); // 0 alert( firstMatch.input ); //

Hello, world!

``` -If we use `for..of` to loop over `matchAll` matches, then we don't need `Array.from` any more. +Si usamos `for..of` para iterar todas las coincidencias de `matchAll`, no necesitamos `Array.from`. ## str.split(regexp|substr, limit) -Splits the string using the regexp (or a substring) as a delimiter. +Divide la cadena usando la expresión regular (o una sub-cadena) como delimitador. -We can use `split` with strings, like this: +Podemos usar `split` con cadenas, así: ```js run -alert('12-34-56'.split('-')) // array of [12, 34, 56] +alert('12-34-56'.split('-')) // array de [12, 34, 56] ``` -But we can split by a regular expression, the same way: +O también dividir una cadena usando una expresión regular de la misma forma: ```js run -alert('12, 34, 56'.split(/,\s*/)) // array of [12, 34, 56] +alert('12, 34, 56'.split(/,\s*/)) // array de [12, 34, 56] ``` ## str.search(regexp) -The method `str.search(regexp)` returns the position of the first match or `-1` if none found: +El método `str.search(regexp)` retorna la posición de la primera coincidencia o `-1` si no encuentra nada: ```js run let str = "A drop of ink may make a million think"; -alert( str.search( /ink/i ) ); // 10 (first match position) +alert( str.search( /ink/i ) ); // 10 (posición de la primera coincidencia) ``` -**The important limitation: `search` only finds the first match.** +**Limitación importante: `search` solamente encuentra la primera coincidencia.** -If we need positions of further matches, we should use other means, such as finding them all with `str.matchAll(regexp)`. +Si necesitamos las posiciones de las demás coincidencias, deberíamos usar otros medios, como encontrar todos con `str.matchAll(regexp)`. ## str.replace(str|regexp, str|func) -This is a generic method for searching and replacing, one of most useful ones. The swiss army knife for searching and replacing. +Este es un método genérico para buscar y reemplazar, uno de los más útiles. La navaja suiza para buscar y reemplazar. -We can use it without regexps, to search and replace a substring: +Podemos usarlo sin expresiones regulares, para buscar y reemplazar una sub-cadena: ```js run -// replace a dash by a colon +// reemplazar guion por dos puntos alert('12-34-56'.replace("-", ":")) // 12:34-56 ``` -There's a pitfall though. +Sin embargo hay una trampa: -**When the first argument of `replace` is a string, it only replaces the first match.** +**Cuando el primer argumento de `replace` es una cadena, solo reemplaza la primera coincidencia.** -You can see that in the example above: only the first `"-"` is replaced by `":"`. +Puedes ver eso en el ejemplo anterior: solo el primer `"-"` es reemplazado por `":"`. -To find all hyphens, we need to use not the string `"-"`, but a regexp `pattern:/-/g`, with the obligatory `pattern:g` flag: +Para encontrar todos los guiones, no necesitamos usar un cadena `"-"` sino una expresión regular `pattern:/-/g` con la bandera `pattern:g` obligatoria: ```js run -// replace all dashes by a colon +// reemplazar todos los guiones por dos puntos alert( '12-34-56'.replace( *!*/-/g*/!*, ":" ) ) // 12:34:56 ``` -The second argument is a replacement string. We can use special character in it: +El segundo argumento es la cadena de reemplazo. Podemos usar caracteres especiales: -| Symbols | Action in the replacement string | +| Símbolos | Acción en la cadena de reemplazo | |--------|--------| -|`$&`|inserts the whole match| -|$`|inserts a part of the string before the match| -|`$'`|inserts a part of the string after the match| -|`$n`|if `n` is a 1-2 digit number, inserts the contents of n-th capturing group, for details see [](info:regexp-groups)| -|`$`|inserts the contents of the parentheses with the given `name`, for details see [](info:regexp-groups)| -|`$$`|inserts character `$` | +|`$&`|inserta toda la coincidencia| +|$`|inserta una parte de la cadena antes de la coincidencia| +|`$'`|inserta una parte de la cadena después de la coincidencia| +|`$n`|si `n` es un número, inserta el contenido del enésimo grupo capturado, para más detalles ver [](info:regexp-groups)| +|`$`|inserta el contenido de los paréntesis con el `nombre` dado, para más detalles ver [](info:regexp-groups)| +|`$$`|inserta el carácter `$` | -For instance: +Por ejemplo: ```js run let str = "John Smith"; -// swap first and last name +// intercambiar el nombre con el apellido alert(str.replace(/(john) (smith)/i, '$2, $1')) // Smith, John ``` -**For situations that require "smart" replacements, the second argument can be a function.** +**Para situaciones que requieran reemplazos "inteligentes", el segundo argumento puede ser una función.** -It will be called for each match, and the returned value will be inserted as a replacement. +Puede ser llamado por cada coincidencia y el valor retornado puede ser insertado como un reemplazo. -The function is called with arguments `func(match, p1, p2, ..., pn, offset, input, groups)`: +La función es llamada con los siguientes argumentos `func(match, p1, p2, ..., pn, offset, input, groups)`: -1. `match` -- the match, -2. `p1, p2, ..., pn` -- contents of capturing groups (if there are any), -3. `offset` -- position of the match, -4. `input` -- the source string, -5. `groups` -- an object with named groups. +1. `match` -- la coincidencia, +2. `p1, p2, ..., pn` -- contenido de los grupos capturados (si hay alguno), +3. `offset` -- posición de la coincidencia, +4. `input` -- la cadena de entrada, +5. `groups` -- un objeto con los grupos nombrados. -If there are no parentheses in the regexp, then there are only 3 arguments: `func(str, offset, input)`. +Si hay paréntesis en la expresión regular, entonces solo son 3 argumentos: `func(str, offset, input)`. -For example, let's uppercase all matches: +Por ejemplo, hacer mayúsculas todas las coincidencias: ```js run let str = "html and css"; @@ -186,13 +186,13 @@ let result = str.replace(/html|css/gi, str => str.toUpperCase()); alert(result); // HTML and CSS ``` -Replace each match by its position in the string: +Reemplazar cada coincidencia por su posición en la cadena: ```js run alert("Ho-Ho-ho".replace(/ho/gi, (match, offset) => offset)); // 0-3-6 ``` -In the example below there are two parentheses, so the replacement function is called with 5 arguments: the first is the full match, then 2 parentheses, and after it (not used in the example) the match position and the source string: +En el ejemplo anterior hay dos paréntesis, entonces la función de reemplazo es llamada con 5 argumentos: el primero es toda la coincidencia, luego dos paréntesis, y después (no usado en el ejemplo) la posición de la coincidencia y la cadena de entrada: ```js run let str = "John Smith"; @@ -202,7 +202,7 @@ let result = str.replace(/(\w+) (\w+)/, (match, name, surname) => `${surname}, $ alert(result); // Smith, John ``` -If there are many groups, it's convenient to use rest parameters to access them: +Si hay muchos grupos, es conveniente usar parámetros rest para acceder a ellos: ```js run let str = "John Smith"; @@ -212,7 +212,7 @@ let result = str.replace(/(\w+) (\w+)/, (...match) => `${match[2]}, ${match[1]}` alert(result); // Smith, John ``` -Or, if we're using named groups, then `groups` object with them is always the last, so we can obtain it like this: +O, si estamos usando grupos nombrados, entonces el objeto `groups` con ellos es siempre el último, por lo que podemos obtenerlos así: ```js run let str = "John Smith"; @@ -226,25 +226,25 @@ let result = str.replace(/(?\w+) (?\w+)/, (...match) => { alert(result); // Smith, John ``` -Using a function gives us the ultimate replacement power, because it gets all the information about the match, has access to outer variables and can do everything. +Usando una función nos da todo el poder del reemplazo, porque obtiene toda la información de la coincidencia, ya que tiene acceso a las variables externas y se puede hacer de todo. ## regexp.exec(str) -The method `regexp.exec(str)` method returns a match for `regexp` in the string `str`. Unlike previous methods, it's called on a regexp, not on a string. +El método `regexp.exec(str)` retorna una coincidencia por expresión regular (`regexp`) en la cadena (`str`). A diferencia de los métodos anteriores, se llama en una expresión regular en lugar de en una cadena. -It behaves differently depending on whether the regexp has flag `pattern:g`. +Se comporta de manera diferente dependiendo de si la expresión regular tiene la bandera `pattern:g` o no. -If there's no `pattern:g`, then `regexp.exec(str)` returns the first match exactly as `str.match(regexp)`. This behavior doesn't bring anything new. +Si no está la bandera `pattern:g`, entonces `regexp.exec(str)` retorna la primera coincidencia igual que `str.match(regexp)`. Este comportamiento no trae nada nuevo. -But if there's flag `pattern:g`, then: -- A call to `regexp.exec(str)` returns the first match and saves the position immediately after it in the property `regexp.lastIndex`. -- The next such call starts the search from position `regexp.lastIndex`, returns the next match and saves the position after it in `regexp.lastIndex`. -- ...And so on. -- If there are no matches, `regexp.exec` returns `null` and resets `regexp.lastIndex` to `0`. +Pero si está la bandera `pattern:g`, entonces: +- Una llamda a `regexp.exec(str)` retorna la primera coincidencia y guarda la posición inmediatamente después en `regexp.lastIndex`. +- La siguente llamada de la búsqueda comienza desde la posición de `regexp.lastIndex`, retorna la siguiente coincidencia y guarda la posición inmediatamante después en `regexp.lastIndex`. +- ...y así sucesivamente. +- Si no hay coincidencias, `regexp.exec` retorna `null` y resetea `regexp.lastIndex` a `0`. -So, repeated calls return all matches one after another, using property `regexp.lastIndex` to keep track of the current search position. +Entonces, repetidas llamadas retornan todas las coincidencias una tras otra, usando la propiedad `regexp.lastIndex` para realizar el rastreo de la posición actual de la búsqueda. -In the past, before the method `str.matchAll` was added to JavaScript, calls of `regexp.exec` were used in the loop to get all matches with groups: +En el pasado, antes de que el método `str.matchAll` fuera agregado a JavaScript, se utilizaban llamadas de `regexp.exec` en el ciclo para obtener todas las coincidencias con sus grupos: ```js run let str = 'More about JavaScript at https://javascript.info'; @@ -253,57 +253,57 @@ let regexp = /javascript/ig; let result; while (result = regexp.exec(str)) { - alert( `Found ${result[0]} at position ${result.index}` ); - // Found JavaScript at position 11, then - // Found javascript at position 33 + alert( `Se encontró ${result[0]} en la posición ${result.index}` ); + // Se encontró JavaScript en la posición 11, luego + // Se encontró javascript en la posición 33 } ``` -This works now as well, although for newer browsers `str.matchAll` is usually more convenient. +Esto también funciona, aunque para navegadores modernos `str.matchAll` usualmente es lo más conveniente. -**We can use `regexp.exec` to search from a given position by manually setting `lastIndex`.** +**Podemos usar `regexp.exec` para buscar desde una posición dada configurando manualmente el `lastIndex`.** -For instance: +Por ejemplo: ```js run let str = 'Hello, world!'; -let regexp = /\w+/g; // without flag "g", lastIndex property is ignored -regexp.lastIndex = 5; // search from 5th position (from the comma) +let regexp = /\w+/g; // sin la bandera "g", la propiedad `lastIndex` es ignorada +regexp.lastIndex = 5; // buscar desde la 5ta posición (desde la coma) alert( regexp.exec(str) ); // world ``` -If the regexp has flag `pattern:y`, then the search will be performed exactly at the position `regexp.lastIndex`, not any further. +Si la expresión regular tiene la bandera `pattern:y`, entonces la búsqueda se realizará exactamente en la posición del `regexp.lastIndex`, no más adelante. -Let's replace flag `pattern:g` with `pattern:y` in the example above. There will be no matches, as there's no word at position `5`: +Vamos a reemplazar la bandera `pattern:g` con `pattern:y` en el ejemplo anterior. No habrá coincidencias, ya que no hay palabra en la posición `5`: ```js run let str = 'Hello, world!'; let regexp = /\w+/y; -regexp.lastIndex = 5; // search exactly at position 5 +regexp.lastIndex = 5; // buscar exactamente en la posición 5 alert( regexp.exec(str) ); // null ``` -That's convenient for situations when we need to "read" something from the string by a regexp at the exact position, not somewhere further. +Esto es conveniente cuando con una expresión regular necesitamos "leer" algo de la cadena en una posición exacta, no en otro lugar. ## regexp.test(str) -The method `regexp.test(str)` looks for a match and returns `true/false` whether it exists. +El método `regexp.test(str)` busca por una coincidencia y retorna `true/false` si existe. -For instance: +Por ejemplo: ```js run let str = "I love JavaScript"; -// these two tests do the same +// estas dos pruebas hacen lo mismo alert( *!*/love/i*/!*.test(str) ); // true alert( str.search(*!*/love/i*/!*) != -1 ); // true ``` -An example with the negative answer: +Un ejemplo con respuesta negativa: ```js run let str = "Bla-bla-bla"; @@ -312,33 +312,33 @@ alert( *!*/love/i*/!*.test(str) ); // false alert( str.search(*!*/love/i*/!*) != -1 ); // false ``` -If the regexp has flag `pattern:g`, then `regexp.test` looks from `regexp.lastIndex` property and updates this property, just like `regexp.exec`. +Si la expresión regular tiene la bandera `pattern:g`, el método `regexp.test` busca la propiedad `regexp.lastIndex` y la actualiza, igual que `regexp.exec`. -So we can use it to search from a given position: +Entonces podemos usarlo para buscar desde un posición dada: ```js run let regexp = /love/gi; let str = "I love JavaScript"; -// start the search from position 10: +// comienza la búsqueda desde la posición 10: regexp.lastIndex = 10; -alert( regexp.test(str) ); // false (no match) +alert( regexp.test(str) ); // false (sin coincidencia) ``` -````warn header="Same global regexp tested repeatedly on different sources may fail" -If we apply the same global regexp to different inputs, it may lead to wrong result, because `regexp.test` call advances `regexp.lastIndex` property, so the search in another string may start from non-zero position. +````warn header="La misma expresión regular probada (de manera global) repetidamente en diferentes lugares puede fallar" +Si nosotros aplicamos la misma expresión regular (de manera global) a diferentes entradas, puede causar resultados incorrectos, porque `regexp.test` anticipa las llamadas usando la propiedad `regexp.lastIndex`, por lo que la búsqueda en otra cadena puede comenzar desde una posición distinta a cero. -For instance, here we call `regexp.test` twice on the same text, and the second time fails: +Por ejemplo, aquí llamamos `regexp.test` dos veces en el mismo texto y en la segunda vez falla: ```js run -let regexp = /javascript/g; // (regexp just created: regexp.lastIndex=0) +let regexp = /javascript/g; // (expresión regular creada: regexp.lastIndex=0) -alert( regexp.test("javascript") ); // true (regexp.lastIndex=10 now) +alert( regexp.test("javascript") ); // true (ahora regexp.lastIndex es 10) alert( regexp.test("javascript") ); // false ``` -That's exactly because `regexp.lastIndex` is non-zero in the second test. +Eso es porque `regexp.lastIndex` no es cero en la segunda prueba. -To work around that, we can set `regexp.lastIndex = 0` before each search. Or instead of calling methods on regexp, use string methods `str.match/search/...`, they don't use `lastIndex`. +Para solucionarlo, podemos establecer `regexp.lastIndex = 0` antes de cada búsqueda. O en lugar de llamar a los métodos en la expresión regular usar los métodos de cadena `str.match/search/...`, ellos no usan el `lastIndex`. ```` pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy