En el post de hoy vamos a ver cómo dividir una cadena en pedazos si es que supera una máxima longitud. Por ejemplo, separar la string en JS si mide más de 5, y además de eso dividirla en fragmentos de N cantidad.

Vamos a ver cómo separar una cadena cada cierto número de caracteres y también cómo dividirla en trozos pequeños colocados en un arreglo donde se respete una cierta longitud.

Colocar separador en cadena con JavaScript

Veamos el primer enfoque. Vamos a poner un carácter que será un separador de la cadena, de modo que estará presente cada N lugares donde N es la máxima longitud.

La función queda así:

See the gist on github.

Recorremos la cadena y la vamos cortando desde un índice hasta ese índice sumado a la máxima longitud. Aquí estoy usando substring para que sea portable a otros lenguajes, pero bien podrías usar substr y ahorrarte la suma de la línea 6.

La subcadena que resulta de dividir la cadena original la agrego al resultado y luego compruebo si no estoy en el final de la cadena para agregar el separador.

Para probar podemos hacer lo siguiente:

See the gist on github.

Con la siguiente salida:

See the gist on github.

Como puedes ver, obtenemos la cadena separada cada N lugares según la máxima longitud que estamos permitiendo y el separador elegido.

Dividir cadena en arreglo con JS

Otro enfoque es el de cortar la cadena en pedazos de máximo N longitud y agregarlos a un arreglo, de modo que la cadena ahora estará separada cada N lugares pero no tendrá separador, sino que los bloques estarán en un arreglo. La función queda así:

See the gist on github.

Lo que hacemos es declarar un arreglo, luego recorremos la cadena, la vamos cortando y agregamos el pedazo al arreglo en la línea 7. Al final devolvemos el arreglo que tendrá la cadena separada según el parámetro de la máxima longitud.

Podemos probar con el siguiente ejemplo:

See the gist on github.

La salida será el siguiente array:

See the gist on github.

Y así es como se puede separar una cadena en trozos más pequeños respetando una máxima longitud. Obviamente puedes cambiar la longitud y el separador como tú prefieras. Por cierto, esto funciona en JS del lado del cliente y del servidor.

Para terminar te dejo con más tutoriales de JavaScript en mi blog.