Ambas funciones se usan para obtener la parte especificada de la string, pero hay una ligera diferencia entre ellas. Función str.substr(): La función str.substr() devuelve el número especificado de caracteres del índice especificado de la string dada. Sintaxis:
str.substr(start, len)
Parámetros:
- start: Es un parámetro requerido. Especifica la posición desde donde iniciar la extracción. El índice del primer carácter es 0. Si el parámetro de inicio es positivo y mayor o igual que la longitud de la string, esta función devuelve una string vacía. Si el parámetro de inicio es negativo, esta función lo usa como un índice desde el final de la string. Si el parámetro de inicio es negativo o mayor que la longitud de la string, el parámetro de inicio se establece en 0.
- len: Es un parámetro opcional. Especifica el número de caracteres a extraer. Si no se pasa, extrae la string completa.
str.substring() Este método obtiene los caracteres de una string, entre dos índices especificados, y devuelve la nueva string. Sintaxis:
str.substring(start, end)
Parámetros:
- start: Es un parámetro requerido. Especifica la posición donde comenzar la extracción. El índice del primer carácter es 0.
- final: Es un parámetro opcional. Especifica la posición (hasta, pero excluyendo) donde terminar la extracción. Si no se usa, extrae toda la string.
Ejemplo 1: este ejemplo usa solo un parámetro para ambas funciones y produce el mismo resultado.
HTML
<!DOCTYPE html>
<html>
<head>
<title>
Difference between substr()
and substring() function
</title>
</head>
<body style = "text-align:center;">
<h1 style = "color:green;" >
GeeksForGeeks
</h1>
<p id="Geek_up" style="color:green;"></p>
<button onclick = "Geeks()">
Click Here
</button>
<p id="Geek_down"
style="color:green; font-size:20px;"></p>
<script>
var up = document.getElementById("Geek_up");
var a = "GeeksForGeeks";
up.innerHTML = "Str = " + "'" + a + "'";
function Geeks() {
var down = document.getElementById("Geek_down");
down.innerHTML = "Str.substr(7) = " + a.substr(7) +
"<br>" + "Str.substring(7) = " + a.substring(7);
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Ejemplo 2: este ejemplo usa el parámetro (3, 7) para ambas funciones y devuelve la salida.
html
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript | Difference between
substr() and substring() function
</title>
</head>
<body style = "text-align:center;">
<h1 style = "color:green;" >
GeeksForGeeks
</h1>
<p id="Geek_up" style="color:green;"></p>
<button onclick = "Geeks()">
Click Here
</button>
<p id="Geek_down"
style="color:green; font-size:20px;"></p>
<script>
var up = document.getElementById("Geek_up");
var a = "GeeksForGeeks";
up.innerHTML = "Str = " + "'" + a + "'";
function Geeks() {
var down = document.getElementById("Geek_down");
down.innerHTML = "Str.substr(3, 7) = " + a.substr(3, 7) +
"<br>" + "Str.substring(3, 7) = " + a.substring(3, 7);
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Entendamos las diferencias en forma tabular:
| substr() | substring() | |
| 1. | Se utiliza para extraer una parte de la string. | Se utiliza para extraer una substring en una string. |
| 2. | Toma parámetros como índice de inicio de la parte que queremos extraer y la longitud hasta la que queremos extraer la parte de la string. | Sus parámetros son la posición inicial y final de la substring que queremos extraer |
| 3. |
Sintaxis -: string.substr(inicio, longitud) |
Sintaxis – : string.substring(inicio, fin) |
| 4. | No distorsiona la cuerda original. | También es un método de string incorporado en Javascript. |
| 5. | También es un método de string incorporado en Javascript. | No distorsiona la cuerda original. |
| 6. | Su valor de tipo de retorno es de tipo string. | Su valor de retorno es de tipo string |
| 7. | Es una característica de ECMAScript1. | Es una característica de ECMAScript1. |
| 8. | Sus navegadores compatibles son: chrome, safari, Microsoft edge, firefox, Internet Explorer, opera | Sus navegadores compatibles son: chrome, safari, Microsoft edge, firefox, Internet Explorer, opera |
Publicación traducida automáticamente
Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA