EBOOK

Fundamentos de
JavaScript
ÍNDICE
INTRODUCCIÓN AL
DESARROLLO WEB FRONT
END: HTML Y CSS DESDE CERO

5 ¿Qué es Javascript?

8 Acciones que se pueden realizar en

javascript

9 Algo de historia Javascript

14 Diferencias entre distintos

navegadores

16 API

20 ¿Qué está haciendo

JavaScript en tu página?

22 Seguridad del navegador

23 Orden de ejecución de JavaScript

25 Código interpretado versus

compilado

27 Código de lado del servidor versus

de lado del cliente

28 Código dinámico versus estático

29 ¿Cómo agregas JavaScript a tu

página?

31 Variables
ÍNDICE
INTRODUCCIÓN AL
DESARROLLO WEB FRONT END:
HTML Y CSS DESDE CERO

38 Números y operadores

39 Operadores Aritméticos

40 Arreglos o matrices

42 Declaraciones If Else
 INTRODUCCIÓN

Inicialmente las páginas se desarrollaban con HTML y CSS.

Sin embargo, surgieron necesidades de que las páginas
respondiesen a algunas acciones del usuario, para
desarrollar pequeñas funcionalidades más allá de los
propios enlaces. Por tal motivo, surgió el Javascript como
un lenguaje de programación que completa a los dos
mencionados y que nos permite crear comportamientos
dinámicos en las páginas web.

A continuación conocerás los distintos aspectos,

conceptos y nociones básicas acerca del Javascript.
 ¿QUÉ ES UN JAVASCRIPT?
Javascript es un lenguaje de
programación utilizado para crear
comportamientos dinámicos en las
páginas web. Con Javascript, al menos
en un primer paso, podrás crear
pequeños programas encargados de
realizar acciones dentro del ámbito de
una página web, que generalmente
incluye efectos especiales en las
páginas e implementar interacción con
el usuario. A estos pequeños programas
los llamamos scripts, porque a menudo
son porciones de código de tamaño
limitado, que se encargan de hacer
comportamientos muy específicos con
los que mejorar la experiencia de
usuario al visitar un sitio web.

El navegador del usuario se le conoce

como el "cliente web" y es el
encargado de interpretar las
instrucciones Javascript y ejecutarlas
para realizar estos efectos e
interactividades, de modo que el mayor
recurso, y a menudo el único, con que
cuenta este lenguaje es el propio
navegador.
 ¿QUÉ ES UN JAVASCRIPT?
Javascript es el siguiente paso, después del HTML y CSS, que
puede dar un programador de la web que decida mejorar sus
páginas y la potencia de sus proyectos. Es un lenguaje de
programación bastante sencillo y pensado para hacer las cosas con
rapidez, a veces con demasiada ligereza. Incluso las personas que
no tengan una experiencia previa en la programación podrán
aprender este lenguaje con facilidad y utilizarlo en toda su potencia
con sólo un poco de práctica.
 ¿QUÉ ES UN JAVASCRIPT?
Javascript es un lenguaje con
muchas posibilidades, aunque al
principio comenzaremos
desarrollando pequeños scripts,
también nos permite crear
programas más grandes,
orientados a objetos, con
funciones, estructuras de datos
complejas, etc. De hecho, los sitios
web más impactantes que te
puedas imaginar usan cantidad de
Javascript para conseguir que la
experiencia de uso sea tan
espectacular y personalizada. Hoy,
las aplicaciones web modernas
ofrecen gracias a Javascript una
experiencia de uso casi más
parecida a lo que sería una
aplicación de escritorio.
Prácticamente no hay fronteras a
las que no podamos llegar con
Javascript.
 ACCIONES QUE SE PUEDEN
REALIZAR EN JAVASCRIPT
Entre las acciones típicas que se pueden realizar en Javascript
tenemos dos vertientes:

Por un lado los efectos especiales sobre páginas web, para crear
contenidos dinámicos y elementos de la página que tengan
movimiento, cambien de color o cualquier otro dinamismo.

Por el otro, Javascript nos permite ejecutar instrucciones como

respuesta a las acciones del usuario, con lo que podemos crear
páginas interactivas con programas como calculadoras, agendas, o
tablas de cálculo.
 ALGO DE HISTORIA JAVASCRIPT
En Internet se han creado multitud de servicios para realizar muchos
tipos de comunicaciones, como correo, charlas, transferencias,
búsquedas de información, etc. Pero ninguno de estos servicios se ha
desarrollado tanto como la Web. Si estamos leyendo estas líneas no
vamos a necesitar ninguna explicación de lo que es la web, pero sí
podemos hablar un poco sobre cómo se ha ido desarrollando con el
paso de los años.

La Web es un sistema Hipertexto, una cantidad de enorme de textos

interrelacionados por medio de enlaces. Cada una de las unidades
básicas donde podemos encontrar información son las páginas web. En
un principio, para diseñar este sistema de páginas con enlaces se
pensó en un lenguaje que permitiese presentar cada una de estas
informaciones junto con unos pequeños estilos, este lenguaje fue el
HTML.
 ALGO DE HISTORIA JAVASCRIPT

Conforme fue creciendo la Web y

sus distintos usos, se fueron
complicando las páginas y las
acciones que se querían realizar
a través de ellas. Al poco tiempo
quedó patente que HTML no era
suficiente para realizar todas las
acciones que se pueden llegar a
necesitar en una página web. En
otras palabras, HTML se había
quedado corto ya que sólo sirve
para presentar el texto en un
página y poco más.

Al complicarse los sitios web,

una de las primeras necesidades
fue que las páginas respondiesen
a algunas acciones del usuario,
para desarrollar pequeñas
funcionalidades más allá de los
propios enlaces. El primer
ayudante para cubrir las
necesidades que estaban
surgiendo fue Java, que es un
lenguaje de propósito general.
 ALGO DE HISTORIA JAVASCRIPT
Java ofrecía una manera de incrustar programas en páginas web,
a través de la tecnología de los Applets, con los que se podía
crear pequeños programas que se ejecutaban en el navegador
dentro de las propias páginas web, pero que tenían
posibilidades similares a los programas de propósito general. La
programación de Applets fue un gran avance y Netscape, por
aquel entonces el navegador más popular, había roto la primera
barrera del HTML, al hacer posible la programación dentro de las
páginas web. No cabe duda que la aparición de los Applets
supuso un gran avance en la historia del web, pero no ha sido
una tecnología definitiva y muchas otras han seguido
implementando el camino que comenzó con ellos.
 ALGO DE HISTORIA JAVASCRIPT
Netscape, después de hacer sus
navegadores compatibles con los applets,
comenzó a desarrollar un lenguaje de
programación al que llamó LiveScript que
permitiese crear pequeños programas en
las páginas y que fuese mucho más
sencillo de utilizar que Java. De modo
que el primer Javascript se llamo
LiveScript, pero no duró mucho ese
nombre, pues antes de lanzar la primera
versión del producto se forjó una alianza
con Sun Microsystems, creador de Java,
para desarrollar en conjunto ese nuevo
lenguaje.

La alianza hizo que Javascript se

diseñara como un hermano pequeño de
Java, solamente útil dentro de las páginas
web y mucho más fácil de utilizar, de
modo que cualquier persona, sin
conocimientos de programación pudiese
adentrase en el lenguaje y utilizarlo sin
mayores dificultades. Además, para
programar Javascript no es necesario un
kit de desarrollo, ni compilar los scripts,
ni realizarlos en ficheros externos al
código HTML, como ocurría con los
applets.
 ALGO DE HISTORIA JAVASCRIPT

Netscape 2.0 fue el primer navegador que entendía Javascript y

su estela fue seguida por otros clientes web como Internet
Explorer a partir de la versión 3.0. Al motor de ejecución de
Javascript dentro de Internet Explorer Microsoft lo bautizó como
JScript y tenía ligeras diferencias con respecto a Javascript, lo
que hacía que no fuera al 100% compatible con el motor que se
ejecutaba en Netscape.
 DIFERENCIAS ENTRE DISTINTOS
NAVEGADORES
Como hemos dicho el Javascript de
Netscape y el de Microsoft Internet
Explorer tenían ligeras diferencias de
partida. Incluso, a medida que el propio
lenguaje fue evolucionando en las
distintas versiones de navegadores y a la
par que las páginas web se hacían más
dinámicas y exigentes, las diferencias se
fueron acentuando.

Esta situación tardó años en corregirse y

durante este tiempo las diferencias de
funcionamiento de Javascript entre
navegadores marcaron la historia del
lenguaje y el modo en el que los
desarrolladores se relacionan con él.
Durante mucho tiempo los
desarrolladores estábamos obligados a
crear código que funcionase
correctamente en diferentes plataformas
y diferentes versiones de las mismas. A
día de hoy, siguen habiendo algunas
diferencias, aunque desde la aparición de
HTMl 5 los fabricantes llegaron a un
acuerdo para ser fieles a los estándares
abiertos y se fueron corrigiendo los
problemas de compatibilidad.
 DIFERENCIAS ENTRE DISTINTOS
NAVEGADORES
Sin embargo, no todos los navegadores se actualizaban por igual y las
versiones viejas de Internet Explorer hacían que siguiera siendo
necesario un esfuerzo extra para poder crear Javascript compatible
con todos los clientes web. Para solucionar todos estos problemas
han surgido muchos productos como los Frameworks Javascript, que
ayudan a realizar funcionalidades avanzadas de DHTML sin tener que
preocuparse en hacer versiones distintas de los scripts para cada uno
de los navegadores posibles del mercado. En este sentido jQuery fue
el claro dominador del mercado.

En la actualidad hemos llegado a un punto en el que,

afortunadamente, Javascript funciona de manera prácticamente
idéntica en todos los navegadores, al menos las partes fundamentales
del lenguaje. Sin embargo, el estándar de Javascript sigue
evolucionando y por ese motivo la siempre tenemos que llevar en
cuenta que no todo navegador puede disponer de todos los avances
más nuevos del lenguaje.
 API
Las interfaces de programación de aplicaciones (API) son
conjuntos de bloques de construcción de código listos para usar
que permiten a un desarrollador implementar programas que de
otro modo serían difíciles o imposibles de implementar. Hacen
lo mismo para la programación que los kits de muebles
prefabricados para la construcción de viviendas — es mucho más
fácil tomar paneles precortados y atornillarlos para hacer una
estantería que elaborar el diseño tú mismo, que ir y encontrar la
madera correcta, cortar todos los paneles del tamaño y la forma
correctos, buscar los tornillos del tamaño correcto y luego
júntalos para hacer una estantería. Generalmente se dividen en
dos categorias..
 APIS DEL NAVEGADOR
Las APIs del navegador están integradas en tu navegador web pueden
exponer datos del entorno informático circundante o realizar tareas
complejas y útiles. Por ejemplo:

La API del DOM (Document Object Model) te permite

manipular HTML y CSS, crear, eliminar y cambiar el
HTML, aplicar dinámicamente nuevos estilos a tu
página, etc. Cada vez que ves aparecer una ventana
emergente en una página, o se muestra algún nuevo
contenido (como vimos anteriormente en nuestra
sencilla demostración), por ejemplo, ese es el DOM en
acción.

La API de Geolocalización recupera información

geográfica. Así es como Google Maps puede encontrar
tu ubicación y trazarla en un mapa.
 APIS DEL NAVEGADOR
Las APIs del navegador están integradas en tu navegador web pueden
exponer datos del entorno informático circundante o realizar tareas
complejas y útiles. Por ejemplo:

Las APIs Canvas y WebGL te permiten crear gráficos

animados en 2D y 3D. Las personas están haciendo
cosas increíbles con estas tecnologías web — consulta
Experimentos de Chrome y webglsamples.

APIs de audio y video como HTMLMediaElement y

WebRTC te permiten hacer cosas realmente
interesantes con multimedia, como reproducir audio y
video directamente en una página web, o tomar video
de tu cámara web y mostrarlo en la computadora de
otra persona (prueba nuestra sencilla demostración
instantánea para hacerte una idea).
 APIS DE TERCEROS

Las APIs de terceros no están integradas en el navegador de forma

predeterminada y, por lo general, debes obtener su código e
información de algún lugar de la Web. Por ejemplo:

La API de Twitter te permite hacer cosas como

mostrar tus últimos tweets en tu sitio web.

La API de Google Maps y la API de OpenStreetMap te

permiten insertar mapas personalizados en tu sitio
web y otras funciones similares.
 ¿QUÉ ESTÁ HACIENDO
JAVASCRIPT EN TU PÁGINA?
Recapitulemos brevemente sobre la historia de lo que sucede
cuando cargas una página web en un navegador (de lo que hablamos
por primera vez en nuestro artículo Cómo funciona CSS). Cuando
cargas una página web en tu navegador, estás ejecutando tu código
(HTML, CSS y JavaScript) dentro de un entorno de ejecución (la
pestaña del navegador). Esto es como una fábrica que toma materias
primas (el código) y genera un producto (la página web).
 ¿QUÉ ESTÁ HACIENDO
JAVASCRIPT EN TU PÁGINA?

Un uso muy común de JavaScript es modificar dinámicamente

HTML y CSS para actualizar una interfaz de usuario, a través de la
API del modelo de objetos del documento (como se mencionó
anteriormente). Ten en cuenta que el código de tus documentos
web generalmente se cargan y ejecutan en el orden en que aparece
en la página. Si JavaScript se carga e intenta ejecutarse antes de
que se hayan cargado el HTML y el CSS al que afecta, pueden
producirse errores.
 SEGURIDAD DEL NAVEGADOR
Cada pestaña del navegador tiene su
propio depósito separado para ejecutar
código (estos depósitos se denominan
"entornos de ejecución" en términos
técnicos) — esto significa que, en la
mayoría de los casos, el código de cada
pestaña se ejecuta de forma
completamente independiente y el código
de una pestaña no puede afectar el
código en otra pestaña, o en otro sitio
web. Esta es una buena medida de
seguridad — si este no fuera el caso, los
piratas podrían comenzar a escribir
código para robar información de otros
sitios web y otras cosas muy malas.

Existen formas de enviar código y datos entre

diferentes sitios web/pestañas de manera
segura, pero estas son técnicas avanzadas que
no cubriremos en este curso.
 ORDEN DE EJECUCIÓN DE
JAVASCRIPT
Cuando el navegador encuentra un bloque de JavaScript,
generalmente lo ejecuta en orden, de arriba a abajo. Esto significa
que debes tener cuidado con el orden en el que colocas las cosas.
Por ejemplo, veamos al bloque de JavaScript que se encuentra a
continuación:

Aquí seleccionamos un párrafo de texto (línea 1), luego adjuntamos

un detector de eventos (línea 3) de modo que cuando se hace clic
en el párrafo, el bloque de código updateName() (líneas 5-8) se
ejecuta. El bloque de código updateName() (estos tipos de bloques
de código reutilizables se denominan "funciones") pide al usuario un
nuevo nombre y luego inserta ese nombre en el párrafo para
actualizar la pantalla.
 ORDEN DE EJECUCIÓN DE
JAVASCRIPT

Si cambiaras el orden de las dos

primeras líneas de código, ya no
funcionaría — en su lugar,
obtendrías un error en la consola
del desarrollador del navegador —
TypeError: para is undefined. Esto
significa que el objeto para aún no
existe, por lo que no podemos
agregarle un detector de eventos.

Este es un error muy común; debes tener

cuidado de que los objetos a los que se hace
referencia en tu código existan antes de
intentar hacer algo con ellos.
 CÓDIGO INTERPRETADO
VERSUS COMPILADO
Es posible que escuches los términos interpretados y compilados en
el contexto de la programación.

En los lenguajes interpretados, el código se ejecuta

de arriba a abajo y el resultado de ejecutar el código
se devuelve inmediatamente. No tienes que
transformar el código en una forma diferente antes de
que el navegador lo ejecute. El código se recibe en su
forma de texto amigable para el programador y se
procesa directamente desde allí.

Los lenguajes compilados, por otro lado, se

transforman (compilan) a código máquina antes de
que sean ejecutados por la computadora. Por ejemplo,
C/C++ se compila a código máquina que luego ejecuta
la computadora. El programa se ejecuta desde un
formato binario, que se generó a partir del código
fuente del programa original.
 CÓDIGO INTERPRETADO
VERSUS COMPILADO

JavaScript es un lenguaje de programación interpretado ligero. El

navegador web recibe el código JavaScript en su forma de texto
original y ejecuta el script a partir de ahí. Desde un punto de vista
técnico, la mayoría de los intérpretes de JavaScript modernos
utilizan una técnica llamada compilación en tiempo real para mejorar
el rendimiento; el código fuente de JavaScript se compila en un
formato binario más rápido mientras se usa el script, de modo que
se pueda ejecutar lo más rápido posible. Sin embargo, JavaScript
todavía se considera un lenguaje interpretado, ya que la compilación
se maneja en el entorno de ejecución, en lugar de antes.
 CÓDIGO DE LADO DEL SERVIDOR
VERSUS DE LADO DEL CLIENTE

También puedes escuchar los términos

código de lado del servidor y de lado del
cliente, especialmente en el contexto del
desarrollo web. El código de lado del
cliente es un código que se ejecuta en la
computadora del usuario — cuando se ve
una página web, el código de lado del
cliente de la página se descarga, luego se
ejecuta y se muestra en el navegador.

El código de lado del servidor, por otro

lado, se ejecuta en el servidor, luego sus
resultados se descargan y se muestran en
el navegador. Ejemplos de lenguajes web
populares de lado del servidor incluyen a
¡PHP, Python, Ruby, ASP.NET y...
JavaScript! JavaScript también se puede
utilizar como lenguaje de lado del
servidor, por ejemplo, en el popular
entorno Node.js
 CÓDIGO DINÁMICO VERSUS
ESTÁTICO
La palabra dinámico se usa para describir tanto a JavaScript de
lado del cliente como a los lenguajes de lado del servidor — se
refiere a la capacidad de actualizar la visualización de una página
web/aplicación para mostrar diferentes cosas en diferentes
circunstancias, generando contenido nuevo según sea necesario.

El código de lado del servidor genera dinámicamente nuevo

contenido en el servidor, p. ej. extraer datos de una base de
datos, mientras que JavaScript de lado del cliente genera
dinámicamente nuevo contenido dentro del navegador del cliente,
p. ej. creando una nueva tabla HTML, llenándola con los datos
solicitados al servidor y luego mostrando la tabla en una página
web que se muestra al usuario. El significado es ligeramente
diferente en los dos contextos, pero relacionado, y ambos
enfoques (de lado del servidor y de lado del cliente) generalmente
funcionan juntos.

Una página web sin contenido que se actualiza dinámicamente se

denomina estática — simplemente muestra el mismo contenido
todo el tiempo.
 ¿CÓMO AGREGAS JAVASCRIPT A
TU PÁGINA?
JavaScript se aplica a tu página HTML de manera similar a CSS.
Mientras que CSS usa elementos <link> para aplicar hojas de estilo
externas y elementos <style> para aplicar hojas de estilo internas
a HTML, JavaScript solo necesita un amigo en el mundo de HTML:
el elemento {htmlelement("script")}}. Aprendamos cómo funciona
esto.

JavaScript interno

Puedes ingresarlo directamente en tu documento HTML con la

etiqueta <script> </script>.
¿CÓMO AGREGAS JAVASCRIPT A
TU PÁGINA?

JavaScript externo

Debes crear un nuevo archivo en el mismo directorio que tu

archivo HTML del ejemplo. Como nombre ponle script.js;
1 asegúrate de que el nombre tenga la extensión .js, ya que así
es como se reconoce como JavaScript.

En el head de tu documento HTML, coloca lo siguiente:

2

En tu documento .js escribe el código a usar. Guarda y

3 actualiza tu navegador,
 VARIABLES
Una variable es un contenedor para un valor, como un número
que podríamos usar en una suma, o una cadena que podríamos
usar como parte de una oración. Pero una cosa especial acerca de
las variables es que los valores que contienen pueden cambiar.

Otra cosa especial acerca de las variables es que pueden contener

casi cualquier cosa, no solo cadenas y números. Las variables
también pueden contener datos complejos e incluso funciones
completas para hacer cosas asombrosas. Aprenderás más sobre
esto a medida que avances.

Decimos que las variables contienen valores. Ésta es una

importante distinción que debemos reconocer. Las variables no
son los valores en sí mismos; son contenedores de valores.
Puedes pensar en ellas como pequeñas cajas de cartón en las que
puedes guardar cosas.
 DECLARAR UNA VARIABLE

Para usar una variable, primero

debes crearla — precisamente,
a esto lo llamamos declarar la
variable. Para hacerlo,
escribimos la palabra clave var
o let seguida del nombre con el
que deseas llamar a tu variable:

INICIAR UNA VARIABLE

Una vez que hayas declarado

una variable, la puedes iniciar
con un valor. Para ello, escribe
el nombre de la variable,
seguido de un signo igual (=),
seguido del valor que deseas
darle. Por ejemplo:
 TIPOS DE VARIABLES

Números

Puedes almacenar números en variables, ya sea números enteros

como 30 (también llamados enteros — "integer") o números
decimales como 2.456 (también llamados números flotantes o de
coma flotante — "number"). No es necesario declarar el tipo de las
variables en JavaScript, a diferencia de otros lenguajes de
programación. Cuando le das a una variable un valor numérico, no
incluye comillas:
 TIPOS DE VARIABLES

Cadenas de caracteres
(Strings)

Las strings (cadenas) son piezas de texto. Cuando le das a una

variable un valor de cadena, debes encerrarlo entre comillas
simples o dobles; de lo contrario, JavaScript intenta interpretarlo
como otro nombre de variable.
 TIPOS DE VARIABLES

Booleanos

Los booleanos son valores verdadero/falso — pueden tener dos

valores, true o false. Estos, generalmente se utilizan para probar
una condición, después de lo cual se ejecuta el código según
corresponda.
 TIPOS DE VARIABLES

Arreglos

Un arreglo es un objeto único que contiene múltiples valores

encerrados entre corchetes y separados por comas.
 TIPOS DE VARIABLES

Objetos

En programación, un objeto es una estructura de código que

modela un objeto de la vida real. Puedes tener un objeto simple
que represente una caja y contenga información sobre su ancho,
largo y alto, o podrías tener un objeto que represente a una
persona y contenga datos sobre su nombre, estatura, peso, qué
idioma habla, cómo saludarlo, y más.
 NÚMEROS Y OPERADORES
En programación, incluso el simple sistema numérico decimal que
todos conocemos tan bien, es más complicado de lo que podrías
pensar. Usamos diferentes términos para describir diferentes
tipos de números decimales, por ejemplo:

Enteros son números sin parte decimal, e.j. 10, 400 o -5.

Números con coma flotante (floats): tienen punto decimal y parte

decimal, por ejemplo,12.5 y 56.7786543.

Doubles: son un tipo específico de números de coma flotante que

tienen una mayor precisión que los numeros de coma flotante
comunes (lo que significa que son más precisos en cuanto a la
cantidad de decimales que poseen).
 OPERADORES ARITMÉTICOS

Los operadores aritméticos son operadores básicos que usamos para

hacer sumas:
 ARREGLOS O MATRICES
Las matrices se describen como "objetos tipo lista"; básicamente
son objetos individuales que contienen múltiples valores
almacenados en una lista. Los objetos de matriz pueden
almacenarse en variables y tratarse de la misma manera que
cualquier otro tipo de valor, la diferencia es que podemos acceder
individualmente a cada valor dentro de la lista y hacer cosas útiles y
eficientes con la lista, como recorrerlo con un bucle y hacer una
misma cosa a cada valor. Tal vez tenemos una serie de productos y
sus precios almacenados en una matriz, y queremos recorrerlos e
imprimirlos en una factura, sumando todos los precios e
imprimiendo el total en la parte inferior.

Si no tuvieramos matrices, tendríamos que almacenar cada

elemento en una variable separada, luego llamar al código que hace
la impresión y agregarlo por separado para cada artículo. Esto sería
mucho más largo de escribir, menos eficiente y más propenso a
errores. si tuviéramos 10 elementos para agregar a la factura, ya
sería suficientemente malo, pero ¿ qué pasa con 100 o 1000
artículos? Volveremos a este ejemplo más adelante en el artículo.
 ARREGLOS O MATRICES
Las matrices se construyen con corchetes, que contiene una lista
de elementos separados por comas.

En este caso, cada elemento de la matriz es una cadena, pero ten en

cuenta que puedes almacenar cualquier elemento en una matriz —
cadena, número, objeto, otra variable, incluso otra matriz. También
puedes mezclar y combinar tipos de elementos — no todos tienen
que ser números, cadenas, etc.
 DECLARACIONES IF ELSE
Una sintaxis básica if...else luce así:

Este código es fácil de leer — está diciendo "si (if) la condición

retorna verdadero (true), entonces ejecute el código A, sino (else)
ejecute el código B"
 DECLARACIONES IF ELSE

Aquí tenemos:
1. La palabra clave if seguida de unos paréntesis.
2. Una condición a probar, puesta dentro de los paréntesis
(típicamente "¿es este valor mayor que este otro valor?", o
"¿existe este valor?"). Esta condición usará los operadores de
comparación que hemos hablado en el módulo anterior y retorna
un valor true o false (verdadero o falso).
3. Un conjunto de llaves, en las cuales tenemos algún código —
puede ser cualquier código que deseemos, código que se
ejecutará sólamente si la condición retorna true.
4. La palabra clave else.
5. Otro conjunto de llaves, dentro de las cuales tendremos otro
código — puede ser cualquier código que deseemos, y sólo se
ejecutará si la condición no es true.
 DECLARACIONES IF ELSE

Así luce un ejemplo real:

Para comprender mejor la sintaxis, realicemos un ejemplo real.

Imagínese a un niño a quien su madre o padre le pide ayuda con una
tarea. El padre podría decir: "¡Hola, cariño! Si me ayudas yendo y
haciendo las compras, te daré un subsidio adicional para que puedas
pagar ese juguete que querías". En JavaScript, podríamos
representar esto así:
 CONCLUSIÓN

Javascript sirve perfetamente para crear

comportamientos dinámicos en las páginas
web.

Si bien aplicar y dominar cada uno de los

conceptos, variables, sintaxis... es un trabajo
complejo, con la práctica podrás dominar estos
lenguajes y generar webs cada vez más
complejas.

Recuerda siempre ser cuidadoso con el código

para evitar errores inesperados o no deseados.

Con los conocimientos adquiridos anímate al

desarrollo web front end y expande tus límites.
 REFERENCIAS BIBLIOGRÁFICAS
Álvarez, M. (2022). Introducción a Javascript en el navegador.
https://desarrolloweb.com/articulos/introduccion-javascript.html

Mdn web docs. (2020). Almacenando la información que necesitas -

Variables.
https://developer.mozilla.org/es/docs/Learn/JavaScript/First_steps/Va
riables

Mdn web docs. (2020). Arreglos o Matrices.

https://developer.mozilla.org/es/docs/Learn/JavaScript/First_steps/Ar
rays

Mdn web docs. (2020). Manejar texto — cadenas en JavaScript.

https://developer.mozilla.org/es/docs/Learn/JavaScript/First_steps/Str
ings

Mdn web docs. (2020). Métodos útiles con cadenas.

https://developer.mozilla.org/es/docs/Learn/JavaScript/First_steps/Us
eful_string_methods

Mdn web docs. (2021). Matemáticas básicas en JavaScript — números y

operadores.
https://developer.mozilla.org/es/docs/Learn/JavaScript/First_steps/Ma
th
 REFERENCIAS BIBLIOGRÁFICAS
Mdn web docs. (2021). ¿Qué es JavaScript?
https://developer.mozilla.org/es/docs/Learn/JavaScript/First_steps/W
hat_is_JavaScript

Mdn web docs. (2021). Bucles.

https://developer.mozilla.org/es/docs/Learn/JavaScript/Building_block
s/Looping_code

Mdn web docs. (2022). Tomando decisiones en tu código —

condicionales.
https://developer.mozilla.org/es/docs/Learn/JavaScript/Building_block
s/conditionals
 EBOOK: FUNDAMENTOS DE JAVASCRIPT

ACCEDE A NUESTRA ESCUELA DE TECNOLOGÍA

Fundamentos de Desarrollo Web en

JavaScript WordPres

¡Inscríbete ahora! ¡Inscríbete ahora!

Scrum: Gestionando Diseñador Web Freelance:

equipos de trabajo Independiza tu talento

¡Inscríbete ahora! ¡Inscríbete ahora!

 EBOOK
Fundamentos de
JavaScript

¡GRACIAS!
NOS VEMOS EN UN
PRÓXIMO CURSO