TEMA 1: Introducción a JavaScript

Tabla de contenidos

¿Qué es JavaScript y Cómo se relaciona con HTML y CSS?

JavaScript es un lenguaje de programación que se utiliza principalmente en el desarrollo de aplicaciones web. Es un lenguaje de alto nivel, lo que significa que es más fácil de leer y escribir para los humanos que los lenguajes de bajo nivel, como el ensamblador.

  • JavaScript se utiliza para añadir interactividad y dinamismo a las páginas web. Por ejemplo, se puede utilizar para validar formularios, crear animaciones, mostrar mensajes emergentes y mucho más.
  • HTML (HyperText Markup Language) es el lenguaje de marcado utilizado para estructurar el contenido de una página web. HTML define la estructura y el contenido de una página, como títulos, párrafos, enlaces y imágenes.
  • CSS (Cascading Style Sheets) es el lenguaje utilizado para estilizar el contenido de una página web. CSS permite controlar el diseño y la presentación de una página.

JavaScript, HTML y CSS se utilizan juntos para crear páginas web/aplicaciones web modernas y atractivas. JavaScript se ejecuta en el lado del cliente (es decir, en el navegador del usuario), mientras que HTML y CSS se utilizan para estructurar y dar estilo al contenido de la página.

Para utilizar JavaScript en una página web, se puede incluir una etiqueta <script> en el código HTML de la página. La etiqueta <script> puede contener código JavaScript directamente o puede hacer referencia a un archivo externo con el código JavaScript.

Aquí tienes un ejemplo de cómo incluir una etiqueta <script> con código JavaScript directamente en una página HTML:

LRVqlnItkzjDaGCOJi1wiFKJkVrXuPjkO OG4xyc3xg9H1buLbGR4MoyCboZNZjSvXYNzAkWDcdabrkBgAuT0GGt2SHGskcZdYjU m7mq4pedv5z0O1hWCfMgcg 4y7 iL68RJV 0BuLqBNVk4 OF FC w6Sa0pMpKsqb8zR45Noq5DqOA2cSz0S1uY80J o=s2048

 

Y aquí tienes un ejemplo de cómo incluir una etiqueta <script> que hace referencia a un archivo externo llamado “mi-archivo-javascript.js con código JavaScript:

py2sWmiM0Gao4NUNwSVkho7 JJq63YP8DkaOlhK8Zptct7xDq2oqZBl0kHb2yx9xVtDXZC23hYYGBkiQRgoKcHKSUl2gI9BYOmiTPGvZWRoe0czdrZ8 wSAVjKQZDp01bcbXQD1eIbpMs7tdpDNCRH

Sintaxis básica de JavaScript

  • Comentarios
  • Variables
  • Tipos de datos

Comentarios

Los comentarios son líneas de código que se ignoran al ejecutar el programa y se utilizan para documentar y explicar el propósito del código. En JavaScript, existen dos tipos de comentarios:

 

 

  • Comentarios de una línea: se escriben precedidos por dos barras diagonales (//). 
  • Comentarios de varias líneas: se escriben entre una barra diagonal seguida de un asterisco (/*) y un asterisco seguido de una barra diagonal (*/).
umJGlNZPZuRt0HzFD0UM09ORBIx8x8K22WsRl82qAhECQ9xjP9V iP8pwdTsR HClI jq4jefKZdT40hvxMAsLpAY6MEQAIu mPfCLAgrMqHTRQTcyOpttd Dt844H5zqg0Yopi1brCtrwcIVi3t9yTGqTVqVNcDuGhHZKiFMQvg yTWlp mePRWc0z5ZIAV=s2048

 

Declaración de variables

En JavaScript, existen tres tipos de variables: var, let y const.

Cada una de ellas tiene sus propias características y usos específicos.

Variables de tipo VAR

Es como se declaraban variables anteriormente. Las variables de tipo var son globales, es decir, no importa dónde se declaren que podremos acceder a ellas desde cualquier parte del código. Esto aumenta la probabilidad de que, sin darnos cuenta, haya errores.

 

zdAxL9FCSh797CH6S0dg626ELfo52c2IxzWSIvaalqaJ9tsO rCkTUXfOPRpigDDGp4Rk Sr SLYS8xVMKIAgVqQ

 

 

Variables de tipo LET

A diferencia de var, las variables declaradas con let tienen un alcance de bloque y son visibles solo desde el punto de declaración hasta el final del bloque en el que se encuentran.

 

 NwwcRlflUjhZVSDbU8JISZAvdxi0avaduF8E6hwBCXg2fQbAjYspeSucPxUcgN65kloWKuR9lZkRCTnRc3EIwHUqdi9uPHa5eY XMeZnyHXJqMBSGuvtVZ1ZyNftVIAYRj4YUtrOaoeh

 

Variables de tipo CONST

La palabra clave const se utiliza para declarar variables que no pueden ser reasignadas. Al igual que let, las variables declaradas con const tienen un alcance de bloque.

 

uWkMmZ3l3Ik9gw4vR8GKHjL17abbIzkTbAxSLGt59iBvdYSv785pjmAEMBCr91Zb3uDLErVq70xEAOi w5K63z94AMxYONIoCQZT0RwvDlOXDmCHa4MTLQGTmXKOmGr7DKpTvIXcCVjAdmzVlDm PnT1426Bld UIIUQ3qsTR0ccOVRNpCmAn SSeuYM4qIE=s2048

Tipos de datos en JavaScript

JavaScript es un lenguaje de tipado dinámico, lo que significa que no es necesario especificar el tipo de datos de una variable al declararla. El tipo de datos se determina automáticamente en tiempo de ejecución.

Estos son los principales tipos de datos:

  • Números: pueden ser enteros o decimales.
  • Cadenas de texto: se escriben entre comillas simples (‘) o dobles («).
  • Valores booleanos: true o false.
  • Objetos: conjuntos de pares clave-valor que representan una entidad.
  • Arrays: listas ordenadas de valores.
  • Funciones: bloques de código que se pueden ejecutar más tarde.
  • Valores especiales: null y undefined8177a ZOlF4Ti5O f87d80qdaLONVTHQ5SpU6A 5Du HLxgwsb u

Ejercicios

  1. El Oso Yogui y las Canastas de Picnic:

    Imagina que estás en el Parque Jellystone con el Oso Yogui. Te ha dicho que le des todas tus canastas de picnic, pero quieres saber cuántas tienes primero. Crea una variable que contenga el número de canastas de picnic y muéstrala en la consola.

  2. El Bot de los Cumpleaños:

    Eres un bot que organiza fiestas de cumpleaños. Crea dos variables: una para el nombre del cumpleañero y otra para su edad. Luego, imprime un mensaje de felicitación.

  3. El Calcetín Desparejado:

    Todos tenemos calcetines desparejados en el cajón. Imagina que tienes 20 calcetines en total. Crea una variable para el número total de calcetines y otra para el número de calcetines emparejados (p. ej., 7 pares). Calcula cuántos calcetines desparejados tienes.

  4. El Gato en el Teclado:

    Tienes un gato que ama caminar sobre tu teclado y escribir cosas sin sentido. Crea una variable que contenga la cadena de texto que tu gato ha escrito y luego imprímela en la consola.

  5. Superhéroe de Fin de Semana:

    Eres un superhéroe que solo trabaja los fines de semana. Crea una variable booleana que indique si hoy es fin de semana o no. Luego, imprime un mensaje en la consola que diga si es momento de salvar el mundo o no.

  6. La Caja Misteriosa:

    Tienes una caja misteriosa y quieres saber qué hay dentro. Puede contener cualquier tipo de dato en JavaScript. Crea una variable para la caja misteriosa y luego imprime en la consola el tipo de dato que contiene.

  7. El Cambiazo:

    Tienes una moneda y un billete. Crea una variable para el valor de cada uno, pero luego cambia el valor de cada variable por el del otro (sin usar números directamente). Verifica si el cambio se realizó correctamente.

let picnicBaskets = 5;

console.log(picnicBaskets);

let birthdayPerson = «Pedro»;

let age = 27;


console.log(«¡Feliz cumpleaños, «+ birthdayPerson+»! ¡Ahora tienes»+age+» años!»);

let totalSocks = 20;
let pairedSocks = 7 * 2;
let unpairedSocks = totalSocks – pairedSocks;
console.log(unpairedSocks);

let catTyping = «asjdfkjdsakjdfksd»;
console.log(catTyping);

let isWeekend = true;

if(isWeekend){

console.log(«¡Hora de salvar el mundo!»);

}else{

console.log(«Descanso del superhéroe»);

}

let mysteryBox = «Un mensaje secreto»;
console.log(typeof mysteryBox);

let coin = 1;
let bill = 5;

let temp = coin;
coin = bill;
bill = temp;

console.log(`Moneda: ${coin}, Billete: ${bill}`);

Ventajas de Sumérgete en JavaScript

Metodologia

Metodología con mucha práctica

La teoría está bien, y es por eso que el curso cuenta con +12h en vídeo, pero lo realmente importante es la práctica y aquí hay mucha práctica.

Profesionales

Profesores Profesionales

Curso diseñado y realizado por profesores profesionales con experiencia tanto en el sector de la programación como en el educativo.

De por vida

Acceso de por vida

Compra el curso y ten acceso a él siempre que lo necesites. Obtendrás todas las actualizaciones.

certificado

Certificado de finalización

Realizando el Proyecto Final obtendrás un certificado de finalización. El certificado cuenta con un código de verificación, para que las empresas puedan comprobar que realmente sabes JavaScript.

Comunidad

Comunidad de Discord

Conecta con los profesores y otros estudiantes a través de la comunidad de Discord. Haz nuevos amigos, contactos en el sector y pide ayuda a tus profesores, todo desde una sola plataforma.

garantia 14 dias

Pruébalo 14 días

No tienes que decidir ahora. Puedes acceder al curso y tomar una decisión en las próximas dos semanas. Si no te gusta el contenido o te das cuenta que el curso no es para tí, solo tienes que avisarnos y te devolvemos el 100% de tu dinero.

Testimonios de algunos estudiantes

Ellos ya han aprendido JavaScript

Deja de poner excusas, y dale un impulso a tu carrera laboral

SÚMERGETE EN JAVASCRIPT

Únete a

Disponible en Euros (€) y Dólares ($), para que aprender JavaScript no sea un impedimento