JavaScript: lo básico - parte I

JavaScript o JS es un lenguaje de alto nivel, interpretado, dinámico y multiparadigma. Es el lenguaje de programación por defecto en los browsers (exploradores de internet), ademas de que puede ser usado en el backend, lo cual lo convierte en un lenguaje sumamente versátil y es una necesidad al momento de desarrollar una aplicación o sitio web.

Definición de variables

Javascript tiene tres formas de definir una variable:

Con varpodemos “definir” multiples veces la misma variable sin ningún problema, pero con lety const solo podemos definir la misma variable una vez en el mismo ámbito.

Ademas a diferencia de var y let, const no puede ser definida de nuevo, una vez fue definida:

Tipos de variables

JS es un lenguaje dinámico, quiere decir que los tipos de las variables se deciden en tiempo de ejecución, pero ademas es débilmente tipado, significa que los tipos de variables se pueden inferir con otro tipo de variable.

• Boolean — true o false
• Null — valor nulo
• Undefined — Sin definir, en el caso de variables sin valor asignado.
• Number —Enteros , flotantes, etc.
• String — Una cadena de caracteres
• Symbol — Un valor único que no es igual a cualquier otro valor.

Todo lo demás es un objeto en JS.

Coercion

coercion o type casting, es la acción de forzar a un objeto que se comporte como si fuera de otro tipo. Esta es una de las características que puede generar mas confusion en JS. Podemos apreciar el comportamiento de coercion en el siguiente ejemplo:

Para ver todos los casos de coercion y comparación de tipos de variables o objetos en JS recomiendo ver esta tabla comparativa.

Doble igual vs triple igual

El uso de triple igual === ayuda a comparar de forma mas estricta y sin coercion, por lo tanto:

El uso de triple igual es recomendado por encima de la forma tradicional, ya que se facilita al leer y no se espera un comportamiento inesperado o que no se ve a simple vista.

Condicionales

En JS tenemos estas palabras claves para indicar una condición.

• if para ejecutar un bloque de código si la condición es correcta
• else para ejecutar un bloque de código si la condición anterior es falsa
• else if para especificar una nueva condición, si la condición anterior es falsa

• switch para ejecutar uno de muchos bloques de código según multiples condiciones

Arreglos

En JS, Un arreglo o Array es una variable única que se utiliza para almacenar diferentes elementos. A menudo se usa cuando queremos almacenar una lista de elementos y acceder a ellos mediante una sola variable.

Iteradores básicos

JS tiene muchas formas de hacer iteraciones o recorrer un arreglo, se puede confundir con otra caracteristica mas avanzada del lenguaje llamada iteradores o iterators. Los mas básicos son for , do while y while .

Photo by Greyson Joralemon on Unsplash

Funciones

Las funciones son unas de las características mas fundamentales en JavaScript. Una función es un procedimiento de JavaScript: un conjunto de declaraciones que realiza una tarea o calcula un valor. Para usar una función, debe ser definida en algún lugar del ámbito desde el que desea llamarla.

Podemos pasar argumentos a nuestra función, pero en JS, los argumentos siempre son opcionales, por lo tanto nunca se generará un error por cantidad de argumentos y los argumentos no pasados a una función toman el valor de undefined

En JS si se quiere retornar un valor desde una función, se debe colocar de forma explicita, de lo contrario el valor undefined sera retornado.

En JS las funciones pueden ser anónimas, es decir no necesitan poseer un nombre, esto es posible ya que las funciones en JS son de primera clase (first class function), por lo que pueden ser:

• Asignadas a una variable

• Usadas como argumento de una función, estas funciones son normalmente conocidas como callbacks. (una función que toma otra función como argumento es denominada de orden superior o higher order function).

• Retornadas como resultado de la ejecución de una función ( al igual que en el caso anterior, una función que retorna otra función es denominada de orden superior o higher order function).

Photo by Nick Fewings on Unsplash

Arrow function

Existe otra forma sintáctica de definir una función, estas son llamadas arrow función, estas se comportan de la misma forma que una función tradicional a excepción de el contexto en la que esta se ejecuta, pero mas de eso en el siguiente articulo JavaScript: lo básico — parte 2

Podemos definir una arrow function de la siguiente manera

Las arrow functions pueden retornar un valor de forma automática cuando no se usa las llaves {} , pero esta se limitara a ejecutar solo una tarea o sentencia.

Podemos eliminar los paréntesis si esta recibe solo un parámetro

Photo by Markus Spiske on Unsplash

Hoisting

JS como muchos otros lenguajes interpretados, se va ejecutando linea por linea, pero antes de empezar este proceso, el motor de JS lee todo el archivo y aplica lo que se conoce como hoisting.

El efecto hoisting, es el comportamiento que JS toma al “mover” virtualmente la definición de variables ( solo en el caso de var) y la definición de funciones al tope del archivo o en el caso de que la definición este dentro de una función seria al tope de esta función.

Lo que permite hacer uso de variables var o funciones definidas antes que estas sean definidas en el código.

Como podemos ver estamos accediendo a la variable age antes de que esta sea definida, aunque no nos da el valor que tiene en su definición, tampoco se genera un error de variable no definida.

Sucede algo similar con funciones:

En este caso la función hello se comporta como si esta fuese definida al comienzo del archivo.

El hoisting que hace JavaScript lo podemos visualizar de esta forma:

Si intentamos lo mismo con las otras formas de definir una variable:

vemos que nos arroja un error ya que estamos usando la variable antes de esta ser definida, con esto vemos que el hoisting no afecta a las variables definidas con const o let

Conclusion

Conocimos un poco sobre algunas características básicas de JavaScript

• Definición de variables (var, let, const)
• Tipos de variables
• Como se comportan los diferentes tipos de variables al ser comparados entre si (coercion)
• Arreglos
• Funciones
• Las funciones en JavaScript son de primera clase
• Arrow function
• Hoisting

Y aun queda mucho mas por aprender de este lenguaje, estos fueron unos de los conceptos mas básicos para comenzar a entender y domar a JavaScript con el fin poder escribir en este lenguaje que es uno de los mas usados.