Lecciones del curso

Aprende a programar con JavaScript GRATIS

Bienvenid@ a la terminal
6m
Git y Github
14m
Creando un repositorio en Github
15m
Clonando un repositorio de Github
4m
Comenzando con JS
9m
HTML5 no es sólo HTML
3m
Tu primer documento HTML5
8m
Estructura Básica de un documento HTML
4m
Agregando CSS
8m
Previsualizando nuestro trabajo en el navegador
7m
Previsualizando nuestro trabajo en el navegador
7m
Conectando css a nuestro index.html
6m
Agregando interactividad con JS
6m
Undefined
2m
Null
3m
Intro a funciones
9m
Return
8m
Iconos de fontawesome
8m
FlexBox
4m
FlexBox avanzado
7m
Selectores CSS
7m
Position: [absolute, relative, fixed]
13m
Cascada CSS
11m
Arrays
8m
Intro a estructuras de datos
4m
Objetos
7m
Nodos
5m
Manipulación de nodos
10m
Crear nodos
6m
Listeners
7m
Agregar Clases CSS con JS
11m
Sobre jQuery
2m

Comenzando con JS

JavaScript es un lenguaje muy emocionante por mucuchas razones que iremos aprendiendo poco a poco porque también es un lenguaje muy grande y extenso que ha sufrido muchos cambios con el paso del tiempo, JavaScript que nombraremos en este curso simplemente como JS, tiene mucha fama de ser un lenguaje "feo" o "raro" y lo es si, pero lo raro no necesariamente es malo, solo diferente, y vaya que es un lenguaje diferente. Pero no perdamos de vista que en la última década se ha convertido en el lenguaje más importante para programar en la "web" y entiendase por "web" cualquier programa que se ejecute en el navegador, como paginas web(WebPages) o aplicaciones web (WebApps).

En los enlaces de esta learning, te he dejado algunas lecturas interezantes sobre la historia de este apasionante lenguaje recuerda que la teoría esta en su lugar, en el mejor lugar: Internet, para nosotros poder concentrarnos en practicar y aprender a codear.

En esta learning vamos a aprender que son los tipos, variables y constantes para luego escribir algunos ejemplos.

¿Qué es una variable?

Una variable es una ubicación nombrada para almacenar un valor. De esta manera se puede acceder a un valor impredecible por medio de un nombre predeterminado. ¿wat? imagina una pequeña caja de regalo, sabes que es un regalo, si es para ti, sabes que puede ser algo que te va a gustar, pero es impredecible saber que contendrá (a menos que tengas 8 años y tus papas son tan ingeniosos que siempre te dan calcetines) eso es una variable, un contenedor pero ¿un contenedor de qué?. Una variable de JS puede contener varios TIPOS de datos que veremos a continuación. La forma de "declarar" (escribir, definir, por primera vez) una variable es la siguiente:

let cajita = 'bliss'

Si observas hay 3 piezas fundamentales en la declaración de variables:

  1. let let es la palabra reservada para decirle al interprete (Repl) que en esta linea estamos CREANDO (definiendo, iniciando, por primera vez) nuestra variable y que lo que sigue a continuación es su nombre.
  2. cajita cajita es el nombre que le dimos a nuestra variable, yo no soy ingenioso (mi perro se llama trapito, ¡imaginate!) pero tu sí, asegurate de tener en mente buenos nombres de variables, en futuras clases hablaremos mucho sobre las buenas prácticas para nombrar variables, por ahora no olvides revisar los links sobre este tema.
  3. 'bliss' bliss es el dato que queremos guardar en nuestra variable, en mi caso decidí guardar texto por eso la palabra bliss está en medio de 2 comillas simples '' lo que representa que el tipo de dato es texto (string) aprenderemos más sobre los tipos de dato más adelante 😉

Variables vs Constantes

Gracias a las últimas actualizaciones de JS tenemos la posibilidad de usar 2 diferentes variables let y const. La primera ya la hemos explorado un poco, la gran diferencia con const es que NO ES UNA VARIABLE. ¿wat?, bueno el nombre variable implica que puede "variar" o que el dato que contiene puede cambiar con el tiempo, por ejemplo:

let nombre = 'bliss'
nombre = 'juanita'

si te fijas en la segunda linea no escribimos la palabra reservada let porque la "declaración" sucede 1 sola vez, es decir hemos creado la cajita (variable) en la primer linea, pero en la segunda una vez que ya existe, podemos simplemente reutilizarla, imagina que has sacado tu producto de amazon, y ahora piensas usar la caja en la que llegó, como contenedor de juguetes, la caja llego con un proposito pero adquirió otro mejor (guardar tus juguetes, obvio tienes juguetes aunque seas un/una adult@) es importante no declarar 2 veces una variable con el mismo nombre. Ahora el asignarle un nuevo valor o dato es solo posible porque es una variable de tipo let y esot significa que es posible, mientras que si declaramos con la palabra reservada const esto no es posible:

const nombre = 'bliss'
nombre = 'pablito' 🚫// Esto arrojará un error

No podemos cambiar el contenido de nombre porque la declaramos como una constante, y eso justamente es a lo que me refería con que const no es una variable, es una CONSTANTE que no cambia con el tiempo.

[Ejercicio] Vamos a usar variables

Abre tu Repli.com y vamos a intentar cambiar el valor de 2 variables y veremos el resultado. Ejecicio1: Escribe esto en replit.com y da clic en RUN:

let edad = 22 edad = 32 console.log(edad)

Observa cuál es el resultado en la consola.

Ejercicio2: Escribe esto en replit.com y da clic en RUN:

const edad = 22 edad = 32 console.log(edad)

Observa cuál es el resultado en la consola

Más sobre el tema:


Happy Coding! ❤