Introducción

Ya vimos cómo saber si una cadena termina con una letra u otra cadena usando JS. Veamos hoy el proceso inverso o contrario: cómo saber si una cadena empieza o comienza con una letra o con otra cadena.

ES6 ha incorporado algunas nuevas funciones que nos facilitarán la vida, y si queremos soportar navegadores desactualizados también podemos hacerlo con un polyfill.

Comienza con en JavaScript

JavaScript ha evolucionado y los nuevos estándares ya traen funciones que siempre hemos necesitado. En este caso no necesitamos programar la función, pues ya existe y se llama startsWith cuya traducción es comienzaCon.

Este método para ver si comienza con una subcadena en JavaScript le pertenece a todas las cadenas. Es decir, podemos llamar directamente al método si tenemos una cadena, por ejemplo "hola".startsWith("h")

Lo que hace esta función es devolver un booleano indicando si comienza o no con determinada subcadena o letra.

Ejemplo de la función

Veamos algunas llamadas a esta función. Ya dijimos que todas las cadenas tienen este método.

See the gist on github.

La salida es esta:

Ejecuté el script en el lado del servidor, pero funciona igual en los navegadores, aquí sólo estoy probando.

Cabe mencionar que esta función distingue entre mayúsculas y minúsculas. Por lo tanto, no es lo mismo preguntar si empieza con H que con h; hay que tener cuidado con eso.

Si queremos que no importe si es mayúscula o minúscula, podemos convertir la cadena a minúscula o mayúscula, y luego compararla.

Con números

Igualmente podemos trabajar con números, convirtiéndolos primero a cadena. Digamos que tenemos el número 500 y queremos saber si comienza con 5, entonces el código de ejemplo queda así:

See the gist on github.

Lo convertimos a cadena usando toString y como ya es una cadena podemos llamar a todos los métodos que las cadenas tienen, incluyendo startsWith.

Alternativa para navegadores antiguos

Si quieres usar esta función pero también deseas que funcione en los navegadores antiguos como Internet Explorer, aquí dejo un polyfill.

Simplemente pega el código antes de que vayas a llamar a esta función. No afectará a los navegadores nuevos, y pondrá la función en los antiguos.

No es mi código, así que mejor dejo un enlace hacia un gist del autor.

https://github.com/mathiasbynens/String.prototype.startsWith/blob/master/startswith.js

Lo que hace es definir la función en caso de que no exista, así tú no te preocupas por definirla, simplemente la usas igual en cualquier navegador.