FUNDAMENTOS

DE
PROGRAMACIÓN

SÍLABO - TEMARIOS
DEL CURSO

6 AGOSTO

Soluciones Tecnológicas S.A.RESULTEC

Creado por:
 TABLA DE CONTENIDOS

SECCIÓN 1........................................................................................................................................... 1
1. Conceptos de programación ....................................................................................................... 1
1.1 ¿Qué es programación? ......................................................................................................... 1
1.2 Ramas de la programación ..................................................................................................... 1
1.3 Introducción a los lenguajes de programación ........................................................................ 2
1.4 Código de programación (Presentación visual) ....................................................................... 4
SECCIÓN 2........................................................................................................................................... 5
2. Algoritmos .................................................................................................................................... 5
2.1 Concepto ................................................................................................................................ 5
2.2 Pseudocódigo ......................................................................................................................... 5
2.3 Diagramas de flujo .................................................................................................................. 5
2.4 Característica de un algoritmo ................................................................................................ 7
2.5 Variable .................................................................................................................................. 8
2.6 Operadores aritmeticos ........................................................................................................... 9
2.7 Condicionante IF/ELSE ........................................................................................................... 9
2.8 Operadores lógicos ............................................................................................................... 11
2.9 Ciclo For ............................................................................................................................... 12
2.10 Algoritmos y diagramas de flujos ......................................................................................... 13
2.10.1 Ejemplo: Persona mayor de edad...................................................................................... 13
2.10.2 Ejemplo: Numero Par/impar .............................................................................................. 13
2.10.3 Ejemplo: Serie de numeros primos .................................................................................... 14
SECCIÓN 3......................................................................................................................................... 15
3. Variables y datos ....................................................................................................................... 15
3.1 Tipos de datos ...................................................................................................................... 15
3.1.1 Navegador ......................................................................................................................... 16
3.1.2 Html................................................................................................................................... 16
3.1.3 JavaScript ......................................................................................................................... 17
3.2 Introducción a JavaScript ...................................................................................................... 17
3.2.1 Sintaxis.............................................................................................................................. 18
3.2.2 Prompt............................................................................................................................... 19
3.2.3 Alert ................................................................................................................................... 19
FUENTES BIBLIOGRÁFICAS ............................................................................................................ 20
 TEMARIO PARA EL CURSO DE FUNDAMENTOS DE PROGRAMACIÓN (inicia 8:30 – finaliza 12:45)

DURACIÓN
TEMA PRINCIPAL CONTENIDO

• ¿Qué es la programación?
• Ramas de la programación
CONCEPTOS DE
• Introducción a los lenguajes de programación 20 minutos
PROGRAMACIÓN
• Código de programación(Visual)

• Conceptos (5 min)
• Pseudocódigo (15 min)
• Algoritmo (10 min)
• Características de un algoritmo (20 min) – material instructivo
• Variable (5 min)
• Operadores aritméticos(15 min)
ALGORITMOS • Condicionante if / else (10 min) 2:30 minutos
• Operadores lógicos (15 min)
• Ciclo- For (10 min)
• Algoritmo y diagrama de flujo (30 min)
o Persona mayor edad
o Par / Impar
o Serie de numero primos
• Desarrollo de un algoritmo (Ejercicio práctico – 15 min)
o Serie de número impar/par (desarrollar)

• Concepto de datos (10 min)

- Navegador
- Html
- JavaScript
VARIABLES Y DATOS • Introducción a JavaScript (20 min)
60 minutos
(JavaScript) - Sintaxis
- Qué es variable(refuerzo)
- Herramientas de desarrollo (navegador)
- Prompt, alert
• Ejercicio práctico sobre persona mayor de edad (20 min)
• Ejercicio de par/impar (individual) (10 min)
LUNCH BREAK De 10:30 – 10:45
INTERVENCIÓN DEL INGENIERO (Después del break) 15 a 20 minutos
TOTAL HORAS 4:20 horas
 HERRAMIENTAS Y RECURSOS
HERRAMIENTA CANTIDAD
Hoja de registro de datos 1
Sílabo 1 sílabo
Presentación PPT 1
Formulario o encuesta al finalizar el curso 1
Instructivo 1 por persona
Carpeta RESULTEC, lunch 1
Certificado de aprobación y asistencia al curso 1 por persona
Agua -
Proyector 1
Fondo blanco 1
Ordenadores Uno por dos persona
Internet Por considerar
Herramienta de desarrollo (para ejercicio) DFD
Pizarra 1
Marcadores Pizarra 2
 SECCIÓN 1
1. Conceptos de programación
1.1 ¿Qué es programación?

La programación es el arte de especificar la estructura y el comportamiento de un

programa, creando un conjunto de instrucciones para que el computador entienda como
realizar su tarea; proceso por el cual se diseña, limpia, codifica y protege el código fuente.
(Juganaru, 2014)

1.2 Ramas de la programación

Dentro del artículo “¿Cuáles son las áreas de la programación?” del autor (Guido,
2020) se definen las siguientes ramas:

a) Desarrollo web: Es todo aquello que se puede ejecutar desde el navegador. Se

pueden dividir en 2 partes:
• Sitios web: Son aquellas páginas web de tipo informativa, cuya función es
la de informar al usuario sobre algún negocio, empleo, etc. Existen
diferentes CMS que ayudan en la creación de este tipo de sitios, entre el
más conocido se encuentra Worpress.
• Aplicaciones web: Es aquel sitio denominado como completo debido a
que contiene una lógica compleja donde se crean funciones como las de
crear, actualizar o modificar alguna información.

b) Desarrollo móvil: Tal y como se indica es la técnica de desarrollar aplicaciones

para teléfonos que pueden funcionar en dos sistemas operativos muy conocidos:
Android y IOS Apple. Para Android se pueden desarrollar en lenguaje Kotlin o
Java y para IOS el lenguaje Swift.

c) Desarrollo de videojuegos: Tienen sus propias consolas, están en dispositivos

móviles, en ordenadores y consolas. Entre los diferentes motores o entornos de
desarrollo de videojuegos se encuentran, Unity 3D que utiliza el lenguaje de
programación C# y Unreal Engine que usa C++.

d) Desarrollo de aplicaciones de escritorio: Son aquellas aplicaciones que se

instalan directamente en el sistema operativo del computador, su entorno de
desarrollo se enfoca en los lenguajes de programación como Java, C# o Python.

e) Seguridad informática: Es un tema que todo desarrollador o equipo de

desarrollo deben conocer y se pueden clasificar en 2 áreas.
• Ofensiva: Se encuentra el hacking ético el cual es aquel que es contratado
por una empresa para detectar vulnerabilidades de sus sistemas y

1
 posterior a esto poder corregir aquellas brechas, el Hacking no ético es lo
contrario al ético donde el individuo se encarga de buscar vulnerabilidades
dentro de un sistema para explotarlas y robar información, dinero o
cualquier otro tipo de delito informático.

• Defensiva: Se encuentran la infraestructura que es aquella donde se

realiza la configuración de seguridad nivel de hardware y software en los
sistemas, y también se encuentra el desarrollo donde se realizan las
buenas prácticas de programación para no dejar vulnerabilidades
expuestas.

f) Machine Learning: Consiste en enseñarles a las computadoras a través de una

gran cantidad de datos, los programadores tienen la función de crear modelos o
secuencia de pasos para que el machine Learning pueda crear algo y así crear
patrones de predicción que se podrán usar a futuro, un ejemplo claro de machine
Learning es Netflix donde los usuarios reciben recomendaciones en base a las
películas o series que observaron previamente.

1.3 Introducción a los lenguajes de programación

Para que un ordenador realice un proceso en concreto, se le debe suministrar un

algoritmo adecuado, del cual conocemos como programa, donde el procesador debe ser
capaz de interpretar el algoritmo, lo que significa que debe comprender las instrucciones de
cada paso y además realizar las operaciones correspondientes (Domingo, 2022).

Dentro de los lenguajes de programación se encuentran las siguientes

clasificaciones:

Lenguaje de máquina: Son aquellos que están escritos en lenguajes que

directamente entiende el ordenador, ya que sus instrucciones son cadenas binarias
(Secuencias de ceros y unos), los cuales especifican una operación.

Podemos identificar a un código de máquina por las siguientes características:

• Las instrucciones en lenguaje de máquina ciertamente dependen del

hardware del ordenador y por lo tanto serán diferentes de un ordenador a otro.
• Se pueden transferir un programa a memoria sin necesidad de traducción
posterior, lo que supone una mayor velocidad de ejecución a cualquier otro
lenguaje
• Es un poco complejo y con lentitud en la codificación
• Mantiene operaciones muy elementales

Lenguaje de bajo nivel (Ensamblador): Son aquellos considerados más fáciles de

usar, el lenguaje de bajo nivel por excelencia es el ensambador y al igual que los otros
lenguajes tambien dependen de la maquina en particular. Un programa escrito en lenguaje
2
ensamblador no puede ser ejecutado directamente por la máquina, sino que requiere una
fase de traducción al lenguaje máquina. El programa original escrito en lenguaje
ensamblador se denomina programa fuente y el programa traducido en lenguaje máquina
se conoce como programa objeto, ya directamente entendible por el ordenador.

Lenguaje de alto nivel

Son los más utilizados por los desarrolladores debido a que se encuentran diseñados
para que las personas escriban y entiendan los programas de un modo mucho más fácil
que los lenguajes de máquina y ensambladores.

Al igual que sucede con los lenguajes ensambladores, los programas fuente tienen
que ser traducidos por programas traductores, llamados en este caso compiladores o
intérpretes.

Compiladores

• Convierte a un programa escrito en alto nivel (código fuente), a un programa

maquina (código ejecutable).
• Para poder ejecutarlo el código no debe tener errores de sintaxis
• Se necesita de un compilador para cada arquitectura y sistema operativo
• Los programas ejecutables no son compatibles entre plataformas
• Una vez que el programa es ejecutable, no es necesario tener el código fuente

Interpretes

• La traducción y ejecución de código fuente a código máquina se hace línea

por línea.
• Los errores de sintaxis aparecen cuando se interpreta la instrucción con error.
• Necesitamos el código fuente para ejecutar el programa.
• Los lenguajes interpretados suelen ser más lentos en su ejecución
• Ejemplos: Python, PHP.
Máquina virtual

• La traducción se hace en dos pasos.

• Primero se compila el código fuente a un código intermedio (bytecode).
• Segundo, este bytecode se interpreta y ejecuta por una “máquina virtual”.
• El bytecode es multiplataforma.
• Necesito una “máquina virtual” para cada plataforma.
• No necesito el código fuente.
• Ejemplo: Java, C#

3
1.4 Código de programación (Presentación visual)

Figure 1. Código de programación

4
 SECCIÓN 2
2. Algoritmos
2.1 Concepto

Constituye una lista bien ordenada, definida y finita de operaciones, que permite
encontrar la solución a un problema. Se sabe que para realizar un programa es
necesario tener el diseño o una realización previa del algoritmo (Pinales, 2016).

El algoritmo es la infraestructura de cualquier solución, escrita luego en cualquier tipo

de lenguaje.

2.2 Pseudocódigo

El seudocódigo es una de las herramientas más conocidas para el diseño de la

solución de problemas por computadora. Esta herramienta permite pasar casi de manera
directa la solución del problema a un lenguaje de programación específico. El
pseudocódigo es una serie de pasos bien detallados y claros que conducen a la
resolución del problema (Pinales, 2016).

Ejemplo de pseudocódigo para determinar las dimensiones A, B y C de una

caja.
1. Inicio.
2. Leer las medidas A, B y C.
3. Realizar el producto de A * B * C y guardarlo en V
(V = A * B * C).
4. Escribir el resultado V.
5. Fin.
Figure 2. Ejemplo práctico de pseudocódigo

2.3 Diagramas de flujo

Los diagramas de flujo son una herramienta que permite representar visualmente
qué operaciones se requieren y en qué secuencia se deben efectuar para solucionar un
problema dado. Por consiguiente, un diagrama de flujo es la representación gráfica
mediante símbolos especiales, de los pasos o procedimientos de manera secuencial y
lógica que se deben realizar para solucionar un problema dado (Pinales, 2016).

Los diagramas de flujo desempeñan un papel vital en la programación de un

problema, ya que facilitan la comprensión de problemas complicados y sobre todo
aquellos en que sus procesos son muy largos; generalmente, los diagramas de flujo se
dibujan antes de comenzar a programar el código fuente, que se ingresará
posteriormente a la computadora. Los diagramas de flujo facilitan la comunicación entre
los programadores y los usuarios, además de que permiten de una manera más rápida
detectar los posibles errores de lógica que se presenten al implementar el algoritmo.

5
• Símbolos que se utilizan en los diagramas de flujo

Figure 3 Simbología usada en diagramas de flujo

• Símbolos y operaciones utilizados en los diagramas de flujo

Figure 4 Operaciones permitidas en diagramas de flujo

6
Ejemplo del diagrama de flujo para determinar el volumen de una caja de dimensiones A, B y
C.

Figure 5 Ejemplo de un diagrama de flujo

2.4 Característica de un algoritmo

• Debe ser preciso con el fin de definirse de manera rigurosa, sin dar lugar a
las ambigüedades
• Definido: si se sigue el mismo proceso más de una vez llegaremos al mismo
resultado
• Finito, es aquel que debe finalizar en algún momento.
• Puede tener cero o más elementos de entrada
• Debe producir un resultado, donde los datos de salida serán los resultados
de efectuar las instrucciones

7
2.5 Variable
Son todos aquellos objetos cuyo valor cambia durante la ejecucion o proceso de
solución del problema, por ejemplo, el sueldo, el pago, el descuento, etc, que se deben
calcular con un algoritmo determinado.

El nombre de una variable debe ser único y no ambiguo. La unicidad del nombre
de la variable durante su ciclo de vida asegura una semántica correcta de las
operaciones (expresiones, órdenes o proposiciones) que implican a la variable. De esta
forma, el nombre de una variable es un identificador diferente de cualquier palabra clave
utilizada en el lenguaje o nombre de una función externa (Krall, s.f.).

Tipos de variables
Los elementos que cambian durante la solución de un problema se denominan
variables, se clasifican dependiendo de lo que deben representar en el algoritmo, por lo
cual pueden ser:
• Entero
• Real
• String
• Cadena

Las variables son de varios tipos; en la mayoría de los lenguajes de programación

imperativa predominan los siguientes tres tipos:
• Variables simples: Son propias de los tipos básicos, para los datos
enteros, flotantes, caracteres y lógicos (pero no en el lenguaje C)
• Variables compuestas: La definición del tipo de una variable compuesta
depende de la sintaxis del lenguaje de programación y de su poder
semántico
• Arreglos de variables de tipo simple o tipo compuesto: Los arreglos
sirven para almacenar una sucesión de valores del tipo indicado

En la mayoría de los lenguajes en los que cada variable tiene una declaración, se
indica el nombre y el tipo. En ocasiones, también se indica si la variable es estática o
dinámica o si el acceso al contenido de la variable es público o privado.

Si la semántica del lenguaje impone la declaración de cualquier variable que se

usa, la ausencia de dicha declaración genera un error de compilación. Del mismo modo,
si existen variables que están declaradas, pero que no se utilizan, la mayoría de los
compiladores envían mensajes explícitos de advertencia, que no son errores, pero sí
informaciones realizadas por el programador (Krall, s.f.).

8
2.6 Operadores aritméticos

Operadores aritméticos unarios

Table 1 Operadores aritméticos unarios
Operador Operación Descripción

+ Signo positivo Los operadores unarios

devuelven expresiones de
- Signo negativo mismo tipo que la expresión
a la que afectan

Operadores aritméticos binarios

Table 2 Operadores aritméticos binarios
Operador Operación

+ Suma

- Resta

* Multiplicación

/ División

div División entera

mod Modulo (resto)

2.7 Condicionante IF/ELSE

La instrucción if/else funciona de forma analógica, permite controlar que procesos

tienen lugar, típicamente en función del valor de una variable o varias variables, de un
valor de cálculo o booleano, o de las decisiones del usuario (Krall, s.f.).
Table 3 Ejemplo de la estructura If/Else
Ejemplo de la estructura if/else

if (condición) {
instrucciones
} else {
instrucciones
}

9
 Esquemáticamente en forma de diagrama de flujo:
Table 4 Condicionante If/Else presentada en un Diagrama de flujo

La cláusula else (no obligatoria) sirve para indicar instrucciones a realizar en caso
de no cumplirse la condición. En algunos lenguajes como JavaScript se permite escribir
un else vacío; se interpreta como que contemplamos el caso pero que no hacemos nada
en él.

Cuando se quieren evaluar distintas condiciones una detrás de otra, se usa la

expresión else if { }. De este modo, la evaluacion que se produce es que, si se cumple
la primera condición, se ejecutan ciertas instrucciones; si no se cumple, se comprueba
la segunda, tercera… n condición. Si no se cumple ninguna de las condiciones, se
ejecuta el else final en caso de que exista.
Table 5 Ejemplos de If/Else
If sencillo If con else if y cláusula final else
if (DesplazamientoX == 0 &&
if (admitido == true) { DesplazamientoY == 1) {
alert ("Se ha admitido el valor"); alert ("Se procede a bajar el personaje 1
} else { posición");
alert ("No se ha admitido el valor"); }
} else if (DesplazamientoX == 1 &&
DesplazamientoY == 0) {
alert ("Se procede a mover el personaje
1 posición a la derecha"); }

else if (DesplazamientoX == -1 &&

DesplazamientoY == 0) {
alert ("Se procede a mover el personaje
1 posición a la izquierda");
}
else {
alert ("Los valores no son válidos");
}

10
2.8 Operadores lógicos

Los operadores lógicos son aquellos que comparan valores booleanos y devuelven
respuestas booleanas. Hay dos tipos de operadores logicos AND y OR. Estos dos
operadores por lo general se describen como && (AND) y || (OR).

Operador logico AND (&&).

Este operador lógico compara dos expresiones. Si la primera se evalúa como

"verdadera" (truthy), la sentencia devolverá el valor de la segunda expresión. Si la primera
expresión se evalúa como "falsa"(falsy), la sentencia devolverá el valor de la primera
expresión.

Cuando solo se incluyen valores booleanos (true o false), se devuelve verdadero si

las dos expresiones son verdaderas. Si una o ambas expresiones son falsas, la sentencia
completa se devolverá como falsa.
Table 6 Ejemplos del operador lógico And

true && true //devuelve el segundo valor, verdadero

true && false //devuelve el segundo valor, falso
false && false //devuelve el primer valor, falso
123 && 'abc' // devuelve el segundo valor, 'abc'
'abc' && null //devuelve el segundo valor, nulo
undefined && 'abc' //devuelve el primer valor, indefinido
0 && false //devuelve el primer valor, 0

Operador lógico OR (||).

Este operador lógico compara dos expresiones. Si la primera se evalúa como "falsa",
la sentencia devolverá el valor de la segunda expresión. Si la primera se evalúa como
"verdadera", la sentencia devolverá el valor de la primera expresión.

Cuando solo se incluyen valores booleanos (true o false), se devuelve como true si
cualquiera de las dos expresiones es verdadero. Ambas expresiones pueden ser
verdaderas, pero solo se necesita una para que el resultado sea verdadero.

11
 Table 7 Ejemplos del operador lógico OR

true || true //devuelve el primer valor, verdadero

true || false //devuelve el primer valor, verdadero
false || false //devuelve el segundo valor, falso
123 || 'abc' //devuelve el primer valor, 123
'abc' || null //devuelve el primer valor, 'abc'
undefined || 'abc' //devuelve el segundo valor, 'abc'
0 || false //devuelve el segundo valor, falso

2.9 Ciclo For

Un ciclo for se repite hasta que una condición especificada se evalué como false. El
bucle for de JavaScript es similar al bucle for de Java y C.

Una declaracion for tiene el siguiente aspecto:

Table 8 Estructura del ciclo For

for ([expresiónInicial]; [expresiónCondicional];

[expresiónDeActualización])
Instrucción

En diagrama de flujo:
Table 9 Ciclo For presentado en diagramas de flujo

12
 Otro ejemplo del ciclo for:
Table 10 Ejemplo práctico del ciclo For
<?php
print "<p>Comienzo</p>\n";
for ($i = 0; $i < 3; $i++) {
print "<p>$i</p>\n";
}
print "<p>Final</p>\n";
?>

En la expresión inicial se inicializa una variable que se evalúa en la expresión de

continuación y que se modifica en la expresión de paso.

2.10 Algoritmos y diagramas de flujos

2.10.1 Ejemplo: Persona mayor de edad

const edadDelUsuario = parseInt(prompt("¿Cuál es tu edad?"));

if(edadDelUsuario >= 18){
alert("Eres mayor de edad");
}else{
alert("Eres menor de edad");
}

2.10.2 Ejemplo: Numero Par/impar

var numero;
numero=prompt('Ingrese valor del numero:','');
if (numero % 2 == 0){
document.write('El numero introducido es par');
}else {document.write('El numero introducido es impar');
}

13
2.10.3 Ejemplo: Serie de numeros primos

let N=prompt("ingrese el número");

N=parseInt(N);
let primo;
i=0;
primo=true;
for(let i = 2; i < N; i++){
if(N%i==0){
primo=false;
}
}
if(primo==true){
document.write("El numero " +N+" es primo");
}else{
document.write("El numero " +N+ " no es primo")
}

14
 SECCIÓN 3
3. Variables y datos

JavaScript permite trabajar con variables, como es habitual en los lenguajes de

programación. Además, permite trabajar con objetos, un tipo de información más compleja que
una variable simple. De forma general podríamos referirnos a tipos de datos en JavaScript, y
dentro de esos tipos de datos tenemos dos grupos fundamentales: los tipos primitivos y los
tipos objeto (Krall, s.f.).

3.1 Tipos de datos

Los tipos de datos JavaScript se dividen en dos grupos: tipos primitivos y tipos objeto
(Krall, s.f.).

Los tipos primitivos incluyen: cadenas de texto (String), variables booleanas cuyo valor
puede ser true o false (Boolean) y números (Number). Además, hay dos tipos primitivos
especiales que son Null y Undefined. Es en los tipos primitivos donde vamos a centrarnos por
el momento.

Los tipos objeto son datos interrelacionados, no ordenados, donde existe un nombre
de objeto y un conjunto de propiedades que tienen un valor. Un objeto puede ser creado
específicamente por el programador. No obstante, se dice que todo aquello que no es un tipo
primitivo es un objeto y en este sentido también es un objeto, por ejemplo, una función.

Table 11 clasificación de los diferentes tipos de datos

Datos de tipos primitivos
Nombre Descripción
String Cadenas de texto
Number Valores numéricos
Boolean Verdadero o falso
Null Tipo especial, contiene Null
Undefined Tipo especial, contiene Undefined
Tipos Objeto
Date (fechas)
Tipos predefinidos RegExp (Expresiones regulares)
Error (datos de error)
Tipos definidos por el Funciones simples
programador/desarrollador Clases
Serie de elementos o formación tipo vector o
Array
matriz. Lo consideramos un objeto especial
Objeto global
Objetos especiales Objeto prototipo
Otros

15
 3.1.1 Navegador
Table 12 Navegadores que hacen uso de JavaScript
Navegadores que nos permiten usar JavaScript

Microsoft Edge Windows

Mozilla Firefox Windows

Apple Safari Apple (macOS)

3.1.2 Html

HTML es el lenguaje de Marcas de Hipertexto, del inglés (HyperText Markup

Language), es el componente más básico de la web. Define el significado y la estructura
del contenido web. Además de HTML, generalmente se usan otras tecnologías para
describir la apariencia7presentación de una página web tales como el CSS o la
funcionalidad de comportamiento JavaScript.

"Hipertexto" hace referencia a los enlaces que conectan páginas web entre sí, ya
sea dentro de un único sitio web o entre sitios web. Los enlaces son un aspecto
fundamental de la Web. Al subir contenido a Internet y vincularlo a las páginas creadas
por otras personas, te conviertes en un participante activo en la «World Wide Web» (Red
Informática Mundial).

Estructura básica de un HTML5:

Figure 6 Estructura básica de HTML5

16
 Table 13 Estructura en código de HTML5

<!DOCTYPE html>
<html lang="es">
<head>
<title>Título de la WEB</title>
<meta charset="UTF-8">
<meta name="title" content="Título de la WEB">
<meta name="description" content="Descripción de la WEB">
<link href="estilos.css" rel="stylesheet">
</head>
<body>
<header>
<h1>Título de la WEB</h1>
</header>
<nav>
<a href="#">IR SECCIÓN 2</a>
<a href="#">IR SECCIÓN 3</a>
</nav>
<section>
<article>
<h2>CONTENIDO PRINCIPAL</h2>
<p>Este es el contenido principal de mi web.</p>
</article>
</section>
<aside>
<h3>Testimonios</h3>
<p>Me gusta mucho esta página.</p>
</aside>
<footer>
<h4>Redes sociales</h4>
<a href="#">Facebook</a>
<a href="#">Tiwtter</a>
</footer>
</body>
</html>

3.1.3 JavaScript

JavaScript es el lenguaje de programación que debes usar para añadir

características interactivas a tu sitio web, (por ejemplo, juegos, eventos que ocurren cuando
los botones son presionados o los datos son introducidos en los formularios, efectos de
estilo dinámicos, animación, y mucho más.

3.2 Introducción a JavaScript

JavaScript es un robusto lenguaje de programación que se puede aplicar a un

documento HTML y usarse para crear interactividad dinámica en los sitios web. Fue
inventado por Brendan Eich, cofundador del proyecto Mozilla, Mozilla Foundation y la
Corporación Mozilla.
JavaScript por sí solo es bastante compacto, aunque muy flexible, y los
desarrolladores han escrito gran cantidad de herramientas encima del núcleo del lenguaje

17
JavaScript, desbloqueando una gran cantidad de funcionalidad adicional con un mínimo
esfuerzo. Esto incluye:

• Interfaces de Programación de Aplicaciones del Navegador (APIs),

construidas dentro de los navegadores que ofrecen funcionalidades como
crear dinámicamente contenido HTML y establece r estilos CSS, hasta
capturar y manipular un vídeo desde la cámara web del usuario, o generar
gráficos 3D y muestras de sonido.
• APIs de terceros, que permiten a los desarrolladores incorporar
funcionalidades en sus sitios de otros proveedores de contenidos como Twitter
o Facebook.
• Marcos de trabajo y librerías de terceros que puedes aplicar a tu HTML para
que puedas construir y publicar rápidamente sitios y aplicaciones.

3.2.1 Sintaxis

La sintaxis de JavaScript define un conjunto de reglas que deben seguirse para

escribir código correctamente, y darle así instrucciones al programa en el que estemos
trabajando, ejecutando la tarea especificada de dicho código.

• No se tienen en cuenta los espacios en blanco y las nuevas líneas: como sucede
con XHTML, el intérprete de JavaScript ignora cualquier espacio en blanco sobrante, por
lo que el código se puede ordenar de forma adecuada para entenderlo mejor (tabulando
las líneas, añadiendo espacios, creando nuevas líneas, etc.)
• Se distinguen las mayúsculas y minúsculas: al igual que sucede con la sintaxis de
las etiquetas y elementos XHTML. Sin embargo, si en una página XHTML se utilizan
indistintamente mayúsculas y minúsculas, la página se visualiza correctamente, siendo
el único problema la no validación de la página. En cambio, si en JavaScript se
intercambian mayúsculas y minúsculas el script no funciona.
• No se define el tipo de las variables: al crear una variable, no es necesario indicar el
tipo de dato que almacenará. De esta forma, una misma variable puede almacenar
diferentes tipos de datos durante la ejecución del script.
• No es necesario terminar cada sentencia con el carácter de punto y coma (;): en la
mayoría de los lenguajes de programación, es obligatorio terminar cada sentencia con
el carácter; Aunque JavaScript no obliga a hacerlo, es conveniente seguir la tradición de
terminar cada sentencia con el carácter del punto y coma (;).
• Se pueden incluir comentarios: los comentarios se utilizan para añadir información en
el código fuente del programa. Aunque el contenido de los comentarios no se visualiza
por pantalla, sí que se envía al navegador del usuario junto con el resto del script, por lo
que es necesario extremar las precauciones sobre la información incluida en los
comentarios.

18
 3.2.2 Prompt

Prompt() es un método del objeto Windows de JavaScript que se usa para

mostrar un cuadro de diálogo con un mensaje que solicita al usuario que ingrese algún
texto o información, tal como se muestra en las siguientes figuras.

Figure 7 Ejemplo del método Promt()

Y su resultado es el siguiente:

Figure 8 Método Promt implementado

3.2.3 Alert

Alert es una palabra clave de JavsScript que permite hacer aparecer una ventana o
cuadro emergente, también llamado “pop-ip”, donde podemos incluir un mensaje.

Y se muestra un ejemplo a continuación:

Table 14 Código de ejemplo de un alert

alert("¡Hola…, Soy un mensaje de alerta…!");

Figure 9 Ejemplo resultante del código alert

19
 FUENTES BIBLIOGRÁFICAS

Domingo, J. (2022). Recuperado el 4 de 2022, de http://bitly.ws/qwHn

Guido, J. (2020). Áreas de la programación. Recuperado el 4 de 2022, de
http://bitly.ws/qwH7
Juganaru, M. (2014). Introduccion a la programación. Recuperado el 4 de 2022, de
http://bitly.ws/qwGN
Krall, C. (s.f.). Recuperado el 4 de 2022, de http://bitly.ws/qwHC
Pinales, f. (2016). Problemario de algoritmos resueltos con diagramas de flujo y
pseudocódigo. Recuperado el 4 de 2022, de http://bitly.ws/qwHp

20