Clase 6: Introducción a Javascript

abril 24, 2021

JAVASCRIPT

JavaScript (JS) es un lenguaje programación interpretado o de scripting, débilmente tipado, de alto nivel, el cual ejecuta el código por medio de un motor V8, el cual es su entorno de ejecución y se encuentra integrado en Google Chrome. Se caracteriza por ser el "lenguaje de la web" debido a que gracias a él es posible desarrollar páginas o aplicaciones web, donde se hace uso de frameworks o librerías como React, Angular NodeJS, etc, las cuales permiten de forma más fácil implementar ciertas funciones que posibilitan la dinamización de los sitios web en su comunicación con lenguajes de estructura como HTML Y CSS.

Para poder observar la ejecución de las líneas de código en JS, se deberá crear una línea de script en el archivo de HTML y posteriormente utilizar la consola del navegador para observar la salida del código.

Fig 1. Creación del archivo HTML con incorporación de archivo de JS.

-Valores y variables: estos se definen de la siguiente forma:

Fig 2. Variable y valor

nombreEstudiante hace referencia a la variable, mientras que "Daniel Vallejo" hace referencia al valor que contiene la varibales. Normalmente la varibale está precedia por el tipo de variable que la define, el cual puede ser let, const o var. JS también puede entender que es una variable sin la necesidad de definirel tipo de varibales, sin embargo se recomienda hacerlo.

Fig 3. Impresión en consola de la variable por medio de console.log

-Tipos de datos: Están dividos en 2 grupos, los objetos y los primitivos. Los primitivos son de tipo numericos(float, int, etc), strings (cadena de caracteres), booleanos (true o false), undefined (variable sin valor definido), null (valor nulo) , symbol (variable unica que no puede ser modificada), bigint (numeros muy grandes). Para mirar que tipo de dato es, su usa la sentencia typeof.

Fig 4. Definición de algunas variables e impresión del tipo de estas.

Fig 5. Salida en consola del tipo de variables.

-let, const, var: se refiere al tipo de variable. Let permite modificar o reasignar el valor de esa variables, mientras que const no permite cambiar el valor de la variable, es constante, no cambia. Var es una identidad de variable que no se usa demasiado; cuando se tienen varios scripts la variable que se ha definido con var se configura de manera global en todos los scripts de JS, es poco específica.

Fig 6. Definición tipo de variables

-Operadores básicos: aquuí se encuentran los operadores +,-,+=,--,*=, etc.

Fig 7. Ejemplo de algunos operadores básicos

Fig 8. Salida de ejemplo anterior

CODING CHALLENGE #1

SOLUCIÓN

Fig 9. Codigo 1

Fig 10. Salida código 1

-Strings y plantillas literales: Permiten crear una secuencia de caracteres pero adicionalmente, permiten agregar variables entre sus cadenas. Se utilizan las comillas invertidas. También permiten saltar una linea sin tener que poner "\n".

Fig 11. Ejemplo plantilla literal.

Fig 12. Salida plantilla literal

-Condicionales if/else: Permiten crear código condicional.

Fig 12. Ejemplo de sentencia if.

Fig 13. Salida ejemplo de sentencia if.

CODING CHALLENGE #2

SOLUCIÓN

Fig 14. Código 2

Fig 15. Salida código 2

-Conversión de tipos y Coerción: permite el cambio de tipos de datos a otros bajo ciertos comandos. En la coerción algunos de los datos se ven forzados a convertirse en un dato diferente para obtenerse una respuesta en consola o retornar una respuesta

Fig 16. Ejemplo de conversion de datos y coerción

Fig 17. Salida de ejemplo anterior

-Valores Truthy y Falsy: Estado de verdad y falsedad de las variables. Las falsy corresponden a : undefined, null, 0, "", NaN. Las truthy corresponden al resto.

-Operadores de igualdad: corresponde a la comparación de dos valores y sus tipos. == compara si dos valores tienen un mismo valor, === compara si dos valores tienen el mismo valor y son del mismo tipo. != corresponde a la negación de == y !== corresponde a la negación de ===. Tambien se encuentran los operadores >= y <=.

-Operadores lógicos:

corresponden a la lógica booleana, && siginifica Y, || signica O.

Fig 18. Ejemplos de operadores booleanos

Fig 19. Salida del ejemplo anterior.

CODING CHALLENGE #3

SOLUCIÓN

Fig 20. Código para la prueba 1, las demás pruebas repiten el código

Fig 21. Salida del código anterior

-Sentencia switch: permite evaluar ciertos casos y ejecutar una acción según ese caso.

Fig 22. Ejemplo de switch

Fig 23. Salida de ejemplo anterior

Operador condicional (ternario): permite escribir una condición de manera más breve.

Fig 24. Ejemplo de operador ternario

Fig 25. Salida de ejemplo anterior

CODING CHALLENGE #4

SOLUCIÓN

-Funciones: para crear una función, normalmente se usa la palabra reservada function, el nombre de la función con los parámetros que recibe, y entre corchetes ejecuta la acción deseada. Posterior a eso se debe llamar a la función.