Cuando Javascript acierta... 👍‍‍

Si bien es cierto no es obligatorio poner el punto y coma (;) al final de cada sentencia en Javascript, ya que éste automáticamente detecta el final de cada línea de código e internamente le inserta un punto y coma, si es altamente recomendable su uso, ya que hay veces en que Javascript no logra interpretar bien el final de cada sentencia y produce errores.

Analicemos este ejemplo para entenderlo mejor. Si escribimos el siguiente código, Javascript va a hacer la suma de estos números y luego, su resultado lo va a poner en pantalla:

alert(2+3+2+5);

el resultado será el siguiente: 12

Hemos utilizado el punto y coma al final, pero si lo omitimos:

alert(2+3+2+5)

vemos el mismo resultado: 12

Aquí Javascript interpreta correctamente el final de la sentencia y ejecuta el código correctamente, de hecho, si ponemos algunos saltos de línea y dejamos el código de la siguiente forma:

alert(2+
    3+2
    +5)

el resultado seguirá siendo 12.

No hay ninguna equivocación por parte de Javascript, ya que hay ciertas pistas en las que Javascript se basa para poder saber que el código aún continúa y no es el final de la sentencia. Como por ejemplo, al tener un signo "+" al final de la primera línea, Javascript sabe que el código continúa y no le pone un punto y coma. Al inicio de la última línea pasa lo mismo, con el signo "+", Javascript sabe que es la continuación de la línea anterior.

Cuando Javascript se equivoca... 👎‍‍

Pero si analizamos el siguiente ejemplo, vamos a ver como Javascript si se puede equivocar al momento de determinar dónde poner un punto y coma. Vamos a utilizar la función alert y otra función denominada forEach:

alert("Hola");
["Bienvenidos a", "CodingTube"].forEach(alert);

Lo que estamos haciendo aquí es mostrar al usuario un mensaje con la palabra "Hola", y luego la función forEach va a mostrar las frases “Bienvenidos a” y luego “CodingTube” después de presionar el botón aceptar.

Pero que pasa si omitimos los punto y coma de esta manera:

alert("Hola")
["Bienvenidos a", "CodingTube"].forEach(alert)

En el navegador solamente se muestra el primer mensaje "Hola" y luego nada más. Es decir no está poniendo un punto y coma al final de la primera sentencia y esto es como si se tuviera este código en una línea de esta forma:

alert("Hola")["Bienvenidos a", "CodingTube"].forEach(alert)

Si utilizamos la consola. La misma que se encuentra dentro del navegador presionando la tecla F12, vamos a ver un error luego de que se muestre el primer mensaje "Hola":

Uncaught TypeError: Cannot read property 'CodingTube' of undefined

Este error es el que no nos permite ejecutar la función forEach y por eso no se muestran los siguientes mensajes en el navegador. El error se crea al no haber un punto y coma antes de los corchetes [] de la función forEach.

Conclusiones 😊😊😊

• Si quieres escribir código Javascript de forma profesional siempre, siempre, siempre!! utiliza el punto y coma al final de cada sentencia. Es una buena práctica. 🙌‍‍
• En el ejemplo anterior encontrar el error es muy sencillo ya que el código es pequeño, pero si se trata de un proyecto mediano o grande con cientos o miles de líneas de código, encontrar el error puede ser una tarea agotadora, así que acostúmbrate al punto y coma que te puede ahorrar varias horas de trabajo. 😫

Si quieres ver esta explicación más a detalle, te recomiendo el siguiente video. Puedes ver todo el video que contiene varios temas o si quieres ver sólo la explicación del punto y coma, sáltate al minuto 10:22. 😉

Si te interesó este contenido me puedes seguir mis redes sociales:

✅ Twitter
✅ YouTube
✅ WEB

Icono de portada diseñado por Freepik from www.flaticon.es