Tutorial Javascript. Aprende JS paso a paso y gratis. Apuntes de alumno.

En este tutorial Javascript encontraréis los resúmenes de clase de la asignatura de JS del curso de confección y publicación de páginas web IFCD0110.

Los apuntes están pensados para todos los niveles. Usarlos a modo de repaso de los conocimientos adquiridos en clase.

Si estás estudiando en fuentes alternativas pueden ser un buen complemento para tu aprendizaje.

Javascript es un lenguaje de script apasionante que nos permite dotar una página web  de dinamismo.

Es una gran herramienta para introducirse en el mundo de la programación.

Aprender JS te ayudará a romper el hielo.

Inicialmente, sobre todo si nunca antes habéis programado, veréis como os cuesta asimilar los conceptos. Es necesario equivocarse para poder aprender.

Pero con un poco de esfuerzo recogeréis frutos y cada vez os plantearéis retos más ambiciosos.

Temáticas JS de este tutorial

  1. Primero hay que aprender la sintaxis y el vocabulario del lenguaje.
  2. A continuación hay que familiarizarse con el código y aprender la lógica de programación.
  3. Más adelante se interactuará con el DOM y el BOM.
  4. Podréis entonces empezar a plantear animaciones.
  5. Y después llegará el momento de reciclar todo lo aprendido mediante el uso de una librería de javascript llamada jQuery.

Algunos consejos antes de lanzarse a aprender Javascript

Lo bonito de javascript es que cuando le pillas el tranquillo después quieres más.

Ser pacientes y no tiréis la toalla. El simple hecho de haber llegado a esta compendio de publicaciones significa que ya tenéis una inquietud.

Palabras como jquery, json, angular es posible que ahora queden muy lejanas pero si llegáis hasta al final de este tutorial muy probablemente veréis como les vais perdiendo el respeto.

En este índice encontraréis el conjunto de entradas ordenadas que resumen los conceptos necesarios para aprender este lenguaje desde la base.

Las iré desarrollando a medida que vaya impartiendo más formaciones y las iré complementando con vídeos explicativos y ejercicios.

Estas publicaciones están pensadas para mis alumnos y para aquellos que queráis aprender web.

Aunque todo requiere un tiempo así que estar atentos.

Esta sección poco a poco se irá transformando en un completo tutorial gratuito sobre Javascript.

Índice de contenidos de la guía

Ejercicios Javascript

La siguiente colección de ejercicios y prácticas está ordenada siguiendo el orden de conceptos de este tutorial.

Todos los ejercicios están concebidos para usar javascript puro. Aquí no encontrarás jquery. Para ello te remito al tutorial jquery.

  1. Ejercicio 1 – Acoplamiento de un script.
  2. Ejercicio 2 – Corrige los errores
  3. Ejercicio 3 – ¿Qué declaraciones de variables son erróneas?
  4. Ejercicio 4 – Escribir un mensaje guardado en una variable.
  5. Ejercicio 5 – Corrige los errores de sintaxis
  6. Ejercicio 6 – Cálculo del perímetro de un rectángulo mediante funciones
  7. Ejercicio 7 – Corrige los errores de sintaxis en unas funciones.
  8. Ejercicio 8 – Sumas con letras.
  9. Ejercicio 9 – Diferencia entre x++ y ++x
  10. Ejercicio 10 – Uso de length y acceso a las posiciones de un array.
  11. Ejercicio 11 – Generación de fechas personalizadas.
  12. Ejercicio 12 – ¿Qué hora es? Programación de un reloj muy sencillo
  13. Ejercicio 13 – Programación de una ventana emergente cansina.
  14. Ejercicio 14 – Generación de encabezados html iterativamente
  15. Ejercicio 15 – Vamos a dormir. Hay 100 ovejas que contar.
  16. Ejercicio 16 – ¿Estamos en fin de semana?
  17. Ejercicio 17. – ¿Qué día de la semana es hoy?
  18. Ejercicio 18. – Generación de un dado de 6 caras.
  19. Ejercicio 19. – Contar vocales en un texto.
  20. Ejercicio 20. – El juego del ahorcado numérico.
  21. Ejercicio 21 – Análisis de un documento web mediante llamadas al DOM.
  22. Ejercicio 22 – Escribir el nombre y apellidos de un usuario en el documento web dentro de una caja html.
  23. Ejercicio 23 – Introducir una imagen aleatoria en un documento web al hacer clic en un botón.
  24. Ejercicio 24. Modificar el destino de todos los enlaces de un documento web con javascript puro.
  25. Ejercicio 25. Anular el comportamiento por defecto de todos los enlaces de un documento web con javascript puro.

Últimos contenidos sobre Javascript del blog

Muchos alumnos me habéis pedido esta entrada sobre los carácteres , . : ; \ [] {} () en Javascript. Y es que tenéis razón. Hay pocos recursos en internet que los aglutinen y nos expliquen dónde debemos usar cada uno de ellos. Voy a intentar aportar un pequeño resumen que os sea de utilidad....

El desconocimiento hace que a menudo muchos usuarios decidan desactivar la opción de que nuestra navegador acepte y/o interprete este lenguaje de script. ¿Que podemos hacer para avisar a los usuarios que nuestra web necesita javascript para visualizarse y funcionar correctamente?...

Vamos a ver como mediante Javascript podemos interactuar con las etiquetas html que constituyen un documento web. Podemos acceder a una etiqueta, un párrafo, un enlace, una imagen, o incluso a los metas de la web y entonces consultar, modificar, añadir o eliminar el contenido que queramos....

El DOM es un tipo especial de objeto que esquematiza las relaciones y interacciones entre los nodos de un documento web y que es creado por el navegador cada vez que interpreta una página web. Cada etiqueta de un documento web es un nodo del mismo y puede ser interpretada a su vez como un objeto con propiedades definidas por los atributos, eventos y contenido de cada etiqueta....

Podemos escribir una estructura condicional mediante el if(){}else if(){}else{} o mediante el switch(){}. ¿Cuando usar una opción y no la otra? En esta entrada vemos un ejemplo para el switch y comentamos los inconvenientes y ventajas....

Hasta el momento hemos estado programando mediante secuencias de instrucciones que se iban sucediendo en orden cronológico. Hemos aprendido la sintaxis y vocabulario mínimo necesario del lenguaje javascript. Ahora toca asimilar la lógica de programación....

Javascript es un lenguaje basado en el uso de objetos. Los objetos son recursos que nos permiten agrupar un conjunto de propiedades alrededor de una idea común. Un constructor es un tipo especial de función que dados unos parámetros de entrada es capaz de crear un nuevo objeto. Veamos un caso práctico....