Conociendo JavaScript

¿Para qué sirve JavaScript?

• Lenguaje de programación empleado para la

creación de páginas web dinámicas
• Una página web dinámica es aquella que
incorpora efectos
– texto que aparece y desaparece
– animaciones
– acciones que se activan al pulsar botones
– ventanas con mensajes de aviso al usuario
• Lenguaje interpretado, no requiere de
compilación para ejecutarse
¿Cómo incluir JavaScript en
documentos HTML?
1. Incluir JavaScript en el mismo documento HTML
 ¿Cómo incluir JavaScript en
documentos HTML?
2. Definir JavaScript en un archivo externo
HTML

JS
¿Cómo incluir JavaScript en
documentos HTML?
3. Incluir JavaScript en elementos HTML
 Programación básica

Comentarios

• Una línea de código:

//

• Un bloque de código:
/*
*/
 Programación básica

Variables
• Elemento empleado para almacenar y hacer
referencia a un valor
• Uso de palabras reservada var para
declararlas:
var x;
• Inicializarlas es darle valor a las variables:
x = 5;
• Sintaxis:
var identificador [= valor]
 Programación básica

Variables
• Se le puede asignar:
– Número (entero o decimal) 5 ó 6.7
– Carácter ‘G’
– Cadena de caracteres "JavaScript"
– Boleano true o false

• El identificador (nombre de la variable) debe:

– Sólo estar formado por letras, números y los
símbolos $ y _
– El primer carácter no puede ser un número
 Programación básica

Operadores

• Permiten realizar operaciones con las

variables o literales
• Existen diferentes tipos:
– Asignación
– Aritméticos
– Incremento y decremento
– Relacionales
– Lógicos
 Programación básica

Operadores
Asignación

• Permiten guardar el valor específico de una

variable
• El símbolo es =
• Sintaxis
– var identificador = valor;
 Programación básica

Operadores
Aritméticos

• Permiten realizar operaciones matemáticas

• Los símbolos son: +, -, *, /, %
• Sintaxis
– operando operador operando;
 Programación básica

Ejercicios secuenciales
Aritméticos 1

• Hacer un script para obtener el área de un

triangulo
 Programación básica

Ejercicios secuenciales
Aritméticos 2

• Elaborar un algoritmo para calcular el promedio

final de todas las materias de un estudiante de 5°
semestre de preparatoria. Los datos disponibles
son: nombre del alumno, calificaciones finales. La
información requerida es: nombre del alumno, el
promedio final del semestre. El promedio se
obtiene sumando todas las calificaciones finales y
dividiendo la suma entre el número de materias
cursadas.
 Programación básica

Ejercicios secuenciales
Aritméticos 3

• Elaborar un script que calcule e imprima el

precio de venta de un artículo. Se tiene los
datos: descripción del artículo y costo de
producción. El precio de venta se calcula
añadiéndole al costo el 120% como utilidad y
el 15% de impuesto.
 Programación básica

Ejercicios secuenciales
Aritméticos 4

• Dados los lados A y B de un triángulo

rectángulo, según el teorema de Pitágoras, el
cuadrado de la hipotenusa (C), es igual a la
suma del cuadrado de los catetos (lados)
c2 = a2 + b2
Elaborar un script que lea el tamaño de los
lados A y B, y calcule e imprima C
(hipotenusa).
 Programación básica

Ejercicios secuenciales
Aritméticos 5

• El volumen de un cilindro se calcula

multiplicando la constante Pi
(¶=3.1415926536) por el cuadrado del radio
de la base(r) por la altura(h).
v = ¶ r2 h
Elaborar un script que lea el radio de la base y
la altura de un cilindro, y que calcule e
imprima el volumen.
 Programación básica

Ejercicios secuenciales
Aritméticos 6

• Elaborar un script que lea los valores para X y

Y; e imprima los valores de V, W y Z. Utilizando
las fórmulas:
W = X5 – Y-2/3
V = Y3 – X-5/4
Z = WX + VY – X-Y
 Programación básica

Ejercicios secuenciales
Aritméticos 7

• La velocidad de la luz es 300,000 kilómetros

por segundo. Elaborar un script que lea un
tiempo en segundos e imprima la distancia
que recorre en dicho tiempo.
 Programación básica

Ejercicios secuenciales
Aritméticos 8

• Elaborar un algoritmo que lea una

temperatura en grados Fahrenheit e imprima
su equivalente en grado Celsius y Kelvin. Para
convertir a Celsius a la temperatura
Fahrenheit se le resta 32 y se multiplica por
5/9. Para convertir a Kelvin, se le suma 273 a
los grados Celsius.
 Programación básica

Ejercicios secuenciales
Aritméticos 9

• Dados dos ángulos de un triángulo se puede

calcular el tercer ángulo. Se sabe que la suma
de los ángulos de un triángulo es 180°, por
ejemplo, sean A y B los ángulos conocidos,
entonces C = 180 – (A+B). Elaborar un script
que lea los ángulos A y B e imprima el ángulo
C.
 Programación básica

Ejercicios secuenciales
Aritméticos 10

• Elaborar un script que calcule e imprima el

costo de un terreno cuadrado o rectangular,
teniendo como datos la anchura y la longitud
en metros, y el costo del metro cuadrado.
 Programación básica

Operadores
Relacionales

• Permiten realizar operaciones de tipo

relacional
• Los símbolos son: <, >, <=, >=, ==, !=
• Sintaxis
– operando operador operando;
 Programación básica

Operadores
Lógicos

• Permiten realizar operaciones de tipo lógico

• Los símbolos son: !, &&, ||
• Los operandos deben ser de tipo boleano
• Sintaxis
– operando operador operando;
 Programación básica

Operadores
Incremento y decremento

• Permiten incrementar o decrementar una

unidad el valor de la variable numérica
• Los símbolos son: ++, --
• Existe el pre (incremento o decremento) y
post (incremento o decremento)
• Sintaxis:
– operador identificador; pre
– Identificador operador; post
 Programación básica

Estructuras de control
Selectivas (if)

• Permiten tomar decisiones a través de una

condición
• Sintaxis:
if(condicion) {
…
}
• Si condición true se ejecutan las instrucciones
dentro del bloque { … }; si es false no entra al
bloque
 Programación básica

Ejercicios selectivos
Relacionales y lógicos 11

• Elaborar un script que calcule el sueldo de un

empleado. Se cuenta con nombre del
empleado, horas trabajadas y cuota por hora.
Para obtener el valor del sueldo se multiplica
las horas trabajadas por la cuota por hora.
Cuando el empleado haya trabajado 40 horas
o más se le otorga un incentivo extra al sueldo
del 5%.
 Programación básica

Ejercicios selectivos
Relacionales y lógicos 12

• Elaborar un script que calcule e imprima el

precio de un terreno del cual se tienen los
siguientes datos: largo, ancho y precio por
metro cuadrado. Si el terreno tiene más de
400 metros cuadrados se hace un descuento
de 10%.
 Programación básica

Estructuras de control
Selectivas (if-else)

• Permiten ejecutar un bloque de instrucciones

u otro
• Sintaxis:
if(condición) {
…
} else { … }
• Si condición true se ejecutan las instrucciones
dentro del bloque { … } del if; si es false entra
al bloque { … } del else
 Programación básica

Ejercicios selectivos
Relacionales y lógicos 13

• Elaborar un script que calcule el sueldo de un

empleado. Se cuenta con nombre del empleado,
horas trabajadas y cuota por hora. Para obtener
el valor del sueldo se multiplica las horas
trabajadas por la cuota por hora. Si el número de
horas trabajadas es mayor que 40, el excedente
de 40 se paga al doble de la cuota por hora. En
caso de no ser mayor que 40 se paga a la cuota
por hora normal.
 Programación básica

Ejercicios selectivos
Relacionales y lógicos 14

• Elaborar un script que calcule el promedio

final obtenido por un alumno que curso 6
materias en el semestre. Imprimir si su
promedio final es aprobatorio (mayor o igual a
6) o reprobatorio (menor a 6).
 Programación básica

Ejercicios selectivos
Relacionales y lógicos 15

• Elaborar un script que lea dos números y

calcule e imprima el mayor. Los números
deben ser diferentes.
 Programación básica

Estructuras de control
Selectivas (if anidado)

• Sintaxis:
if(condición) {
if(condición) { … }
else { … }
} else { if(condición) { … }
else { … }
}
• Permite ejecutar bloques condicionales dentro de
otro bloque condicional. Sirve para múltiples
evaluaciones.
 Programación básica

Ejercicios selectivos
Relacionales y lógicos 16

• Elaborar un script que lea tres números y

calcule e imprima el mayor. Los números
deben ser diferentes.
 Programación básica

Ejercicios selectivos
Relacionales y lógicos 17

• Elaborar un script que lea el tamaño de un

ángulo en grados e imprimir si es: Agudo
(menor a 90°), Recto (igual a 90°), Obtuso
(mayor a 90°, pero menor que 180°), Llano
(igual a 180°) y Cóncavo (mayor a 180° pero
menor a 360°).
 Programación básica

Ejercicios selectivos
Relacionales y lógicos 18

• Elaborar un script que haga conversiones de

equivalencias de metros, yardas, pies y pulgadas.
Primero preguntar al usuario qué desea convertir
e indicar una de las medidas empleando la
siguiente nomenclatura: M para metros, Y para
yardas, P para pies y U para pulgadas. Para
ejecutar las operaciones se siguen las siguientes
equivalencias: 1 pie = 12 pulgadas, 1 yarda = 3
pies, 1 pulgada = 2.54 cm, 1 metro = 100 cm.
 Programación básica

Estructuras de control
Selectivas (switch)

• Sintaxis:
switch(selector) {
case 1: …
break;
case 2: …
break;
case n: …
break;
default: …
}

• Permite ejecutar diversos bloques de código de acuerdo a

un caso numérico o carácter.
 Programación básica

Ejercicios selectivos
Relacionales y lógicos 19

• Elaborar un script que lea un valor entre 1 y 7

e imprimir el día lunes si es 1, martes si es 2,
miércoles si es 3, jueves si es 4, viernes si es 5,
sábado si es 6, domingo si es 7
 Programación básica

Ejercicios selectivos
Relacionales y lógicos 20
• Una empresa vende hojas de hielo seco, con las condiciones
siguientes:
Si el cliente es tipo 1 se le descuenta el 5%
Si el cliente es tipo 2 se le descuenta el 8%
Si el cliente es tipo 3 se le descuenta el 12%
Si el cliente es tipo 4 se le descuenta el 15%

Cuando el cliente realiza una compra se deben leer los siguientes

datos: Nombre del cliente, Tipo de cliente (1, 2, 3, 4), Cantidad de
hojas de hielo y Precio por hoja de hielo. La impresión debe ser:
Nombre del cliente, Subtotal a pagar (Cantidad de hojas de hielo *
Precio por hoja de hielo), Descuento (El porcentaje correspondiente
del Subtotal a pagar) y Total a pagar (Subtotal – Descuento).
 Programación básica

Estructuras de control
Repetitivas (for)

• Sintaxis:
for(inicialización; condición; incremento) {
…
}

• Permite realizar un determinado número de

repeticiones sobre un bloque de instrucciones.
 Programación básica

Ejercicios selectivos
Repetitivos 21

• Elaborar un script calcule e imprima la suma

de los números del 1 al 10.
 Programación básica

Ejercicios selectivos
Repetitivos 22

• Elaborar un script calcule e imprima la suma

de los números pares del 2 al 100.
 Programación básica

Ejercicios selectivos
Repetitivos 23

• Elaborar un script que calcule el sueldo de tres

empleados. Se cuenta con nombre del
empleado, horas trabajadas y cuota por hora.
Para obtener el valor del sueldo se multiplica
las horas trabajadas por la cuota por hora.
Cuando el empleado haya trabajado 40 horas
o más se le otorga un incentivo extra al sueldo
del 5%.
 Programación básica

Ejercicios selectivos
Repetitivos 24

• Elaborar un script que solicite N números y

determinar e imprimir el promedio de dichos
números.
 Programación básica

Estructuras de control
Repetitivas (while)

• Sintaxis:
while(condición) {
…
}

• Permite realizar una serie de repeticiones

siempre y cuando se cumpla la condición
indicada.
 Programación básica

Estructuras de control
Repetitivas (do…while)

• Sintaxis:
do {
…
} while(condición);

• Realiza la misma acción que el while, pero la

condición se evalúa al final, por lo que
siempre se realiza al menos una repetición
 Programación básica

Ejercicios selectivos
Repetitivos 25

• Elaborar un script que calcule e imprima el

sueldo de varios empleados. Preguntar
después de cada cálculo si se desea continuar
calculando el sueldo de otro empleado o no.
 Programación básica

Ejercicios selectivos
Repetitivos 26

• Elaborar un script que lea el nombre de una

persona menor a 18 años y su edad. Ir
incrementándola en 1 dentro de un ciclo.
Evaluar dentro de cada repetición si “ya es
mayor de edad” o “aún no es mayor de edad”.
Cuando ya sea mayor de edad imprimir el
mensaje “Ahora puedes obtener tu credencial
de elector”.
 Programación básica

Ejercicios selectivos
Repetitivos 27

• En una elección para presidente hubo tres

candidatos. Cada partido se encuentra
representado por el siguiente número: 1 (PRI), 2
(PAN), 3 (PRD). Imprimir el número de votos que
recibieron cada uno de ellos, el porcentaje que
obtuvieron respecto al del total de los votantes y
quién es el ganador de la elección. El usuario dará
los votos de manera desorganizada tal y como se
obtuvieron en la elección. El final de los datos
está representado por un 0 (cero)