Scribd
Cargar
22 vistas

Isil Ip S03

Este documento introduce HTML, CSS y JavaScript como las tres tecnologías principales para crear sitios web. Explica la estructura y sintaxis básica de cada uno, incluyendo cómo interactúan entre sí a través del modelo de objetos del documento.

Cargado por

pieromogollon18
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
22 vistas

Isil Ip S03

Este documento introduce HTML, CSS y JavaScript como las tres tecnologías principales para crear sitios web. Explica la estructura y sintaxis básica de cada uno, incluyendo cómo interactúan entre sí a través del modelo de objetos del documento.

Cargado por

pieromogollon18
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 25

INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

HTML, CSS y JavaScript


1. VISUAL STUDIO CODE:
Es un editor de código gratuito, de código abierto y mul�plataforma que admite muchos
lenguajes y caracterís�cas.
Esta será nuestra herramienta para la creación de nuestros archivos tanto html, css y javascript.

1. Primero creamos un nuevo archivo

2. Le asignamos un nombre y le damos la extensión correspondiente, si es .html, .css,


.js

DOCENTE: EMERSON DAVID YRENE HERRERA 3


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

2. ESTRUCTURA GENERAL:
HTML, CSS y JavaScript son las tres tecnologías principales que u�lizarás para crear un si�o web:

• El lenguaje de marcado de hipertexto, o HTML, es un lenguaje de marcado que consta de


diferentes elementos en los que puedes ajustar (marcar) el contenido para darle significado
(semán�ca) y estructura. El HTML simple se ve así:

Si adoptamos una analogía de la construcción de casas, HTML sería como los cimientos y las
paredes de la casa, que le dan estructura y la man�enen unida.

• Hojas de es�lo en cascada (CSS por "Cascading Style Sheets") es un lenguaje basado en reglas
que se u�liza para aplicar es�los a tu HTML, por ejemplo, establecer colores del texto y del fondo,
agregar bordes, animar cosas o diseñar una página de cierta manera. Como un sencillo ejemplo,
el siguiente código conver�rá nuestro párrafo HTML en rojo:

En la analogía de la casa, CSS es como la pintura, el papel tapiz, las alfombras y los cuadros que
usarías para hacer que la casa se vea bien.

DOCENTE: EMERSON DAVID YRENE HERRERA 4


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

• JavaScript es el lenguaje de programación que usamos para agregar interac�vidad a los si�os
web, desde el cambio de es�lo dinámico hasta la obtención de actualizaciones desde el servidor,
pasando por gráficos complejos en 3D. El siguiente JavaScript simple almacenará en la memoria
una referencia a nuestro párrafo y cambiará el texto dentro de él:

En la analogía de la casa, JavaScript es como la cocina, el televisor, el microondas o la secadora


de pelo — las cosas que le dan a tu casa una ú�l funcionalidad.

3. SINTAXIS BASICA:
HTML:
Una estructura básica de HTML consiste en las siguientes etiquetas:
 Un documento HTML comienza con la
etiqueta <html> y termina con
</html>.
 El contenido se encuentra entre estas
etiquetas.
 La parte dentro de <head> es la
cabecera de la página, donde se coloca
información como el título, metas y
enlaces a recursos de la página.
 La parte dentro de <body> es el
contenido visible de la página
 Las etiquetas se abren con el símbolo
“menor que” (<) y se cierran con el
Se interpreta en el navegador: símbolo “mayor que” (>).
 Para escribir un comentario en html
seria de la siguiente manera: <!-- Esto
es un comentario -->

DOCENTE: EMERSON DAVID YRENE HERRERA 5


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

CSS (Cascading Style Sheets):


Para agregar estilos a nuestras etiquetas HTML podemos realizarlos de dos formas:
1. Hoja de estilo interna:
Significa colocar el CSS dentro de un elemento <style> en la sección <head> del HTML.
• Escribir el nombre de la etiqueta que queremos estilizar (por ejemplo, p) seguido de una llave
de apertura ({).
• Escribir el nombre de la propiedad que queremos modificar (por ejemplo, color) seguido de dos
puntos (:).
• Escribir el nuevo valor o estilo que queremos darle a esa propiedad (por ejemplo, green) seguido
de un punto y coma (;).
• Escribir una llave de cierre (}).
• Para escribir un comentario en CSS seria de la siguiente manera: < /* Esto es un comentario */

Para definir el color de nuestra etiqueta p, por ejemplo, debemos escribir el siguiente código CSS:

DOCENTE: EMERSON DAVID YRENE HERRERA 6


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

2. Hoja de estilo externa:


• El método más común para aplicar CSS a un documento es mediante una hoja de estilo externa.
• En este enfoque, el CSS se escribe en un archivo independiente con extensión .css.
• Luego, vinculamos ese archivo CSS desde un elemento <link> en el HTML.

Siendo de este modo el uso mas recomendado de utlizar los estilos css.

JAVASCRIPT (JS):
Primero entendamos mediante un ejemplo como interactúa el html, css y javascript:
Imagina que nuestra página web es un auto. La maqueta, materiales externos y demás estructura
de este auto se construyen en HTML. Los colores, forma, textura y el resto de la decoración son el
CSS. Y con JavaScript programamos los circuitos necesarios para que nuestro auto obedezca las
órdenes que sus usuarios envían a través de un control o timón (que en un sitio web sería
equivalente a dar clics en el navegador).

DOCENTE: EMERSON DAVID YRENE HERRERA 7


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

Segundo definiremos el DOM y como interactúa con el lenguaje de programación JavaScript:


El Modelo de Objetos del Documento (DOM) es un concepto importante en el desarrollo web.
1. ¿Qué es el DOM?
 El DOM (por sus siglas en
inglés, Document Object Model) es
una representación en memoria de la
estructura de un documento HTML.
 Conecta páginas web con scripts o
lenguajes de programación, como
JavaScript.
 El DOM representa cada elemento HTML
(como etiquetas, atributos y contenido)
como objetos que se pueden manipular
mediante código.
2. Funciones del DOM:
 Acceso y manipulación: Permite acceder
y modificar elementos HTML desde
JavaScript.
 Eventos: Facilita la interacción con el
usuario mediante eventos (clics, teclas,
etc.).
 Dinamismo: Permite actualizar la página
sin recargarla completamente.

Para agregar archivos JavaScript a nuestro HTML podemos realizarlos de dos formas:

1. JavaScript de forma interna:

Significa colocar el código JavaScript


directamente dentro de un elemento
<script> en la sección <body> (en la
parte final de todo el body) del HTML.

DOCENTE: EMERSON DAVID YRENE HERRERA 8


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

2. JavaScript de forma externa:

• El método más recomendado para aplicar JavaScript


a un documento HTML es mediante un archivo script
externo.
• En este enfoque, JavaScript se escribe en un archivo
independiente con extensión .js.
• Luego, vinculamos ese archivo JS desde un elemento
<script> en el HTML.

La estructura básica de un programa en JavaScript consta de varios elementos que te permiten


escribir código funcional. Aquí tienes una descripción de los componentes esenciales:

COMENTARIOS
Los comentarios en JS se indican con el símbolo "//". Todo lo que sigue después de "//" en una línea se
considera un comentario y se ignora durante la ejecución del programa.

PALABRAS RESERVADAS
Las palabras clave son parte de la sintaxis del lenguaje de programación. No puedes usarlas como
nombres de variables o funciones. Algunas palabras clave en JavaScript son:

const break async


let con�nue import
var true export
if false yield
else null Array
switch undefined Date
for this Math
while class Object
do extends String,
func�on super onclick
return await onblur

DOCENTE: EMERSON DAVID YRENE HERRERA 9


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

DECLARACION DE VARIABLES Y TIPO DE DATOS


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.

SINTAXIS SE DECLARA
Identificador; Una variable
Identificador1, identificador2, … , etc. Mas de una variable
Identificador = valor; Y inicializa una variable
Identificador = valor1, identificador2=valor2, … , etc. Y inicializa varias variables

Declaración de variables
1. let: Es la forma moderna de declarar variables. Se utiliza para crear un “almacén con un nombre”
para guardar datos.

2. Contast: Se utiliza para declarar constantes. Una vez que asignas un valor a una constante, no
puedes cambiarlo.

3. Var: Es importante mencionar que el uso de var ha sido reemplazado en gran medida
por let y const en JavaScript moderno. Estos proporcionan un mejor control sobre el alcance de
las variables y evitan algunos problemas asociados con var.
• El principial motivo es que permite declarar la misma variable una y otra vez

Declaración de funciones
Las funciones son bloques de código reutilizables que
realizan una tarea específica, puedes definir
funciones utilizando la palabra clave function.

DOCENTE: EMERSON DAVID YRENE HERRERA 10


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

Inicialización de variables
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.

Tipos de Datos
JavaScript es un lenguaje débilmente tipado y dinámico. Las variables en JavaScript no están asociadas
directamente con ningún �po de valor en par�cular, y a cualquier variable se le puede asignar (y
reasignar) valores de todos los �pos:

 Tipos de Datos Primi�vos:


Estos son valores inmutables y se representan directamente en el nivel más bajo del lenguaje. Los
�pos primi�vos incluyen:
• Número (Number): Representa valores numéricos, como 42 o 3.14.
• Cadena (String): Representa texto, como "Hola, mundo".
• Booleano (Boolean): Puede ser true o false.
• Símbolo (Symbol): U�lizado para crear iden�ficadores únicos.
• BigInt: Permite trabajar con números enteros grandes.
• Null: Representa la ausencia intencional de un valor.
• Undefined: Indica que una variable no �ene un valor asignado.

Estos �pos primi�vos son inmutables, lo que significa que no se pueden cambiar directamente.

DOCENTE: EMERSON DAVID YRENE HERRERA 11


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

 Objetos y Tipos Estructurales:


Los objetos en JavaScript son estructuras de datos flexibles que pueden contener propiedades y
métodos. Algunos �pos estructurales incluyen:
• Objeto (Object): Puede contener múl�ples propiedades y métodos.
• Arreglo (Array): Una lista ordenada de valores.
• Mapa (Map): Asocia claves con valores.
• Conjunto (Set): Con�ene valores únicos.
• Fecha (Date): Representa fechas y horas.
• Función (Func�on): Un bloque de código reu�lizable.

Los objetos también pueden ser creados por el usuario u�lizando la palabra clave new.

EXPRESIÓN
Es una combinación de operadores, operandos, funciones espaciales, paréntesis entre otros que se
forman para representar las operaciones aritmé�cas, relacionales y lógicas que se u�liza en un
programa.

• 3 + 4 (suma de dos números)


• x * y (mul�plicación de variables)
• nombre + " �ene " + edad + " años" (concatenación de cadenas)

OPERANDOS Y OPERADORES
Los operadores son símbolos que se u�lizan para representar una operación determinada que se va a
realizar en un programa.
Se clasifican en:

• Aritmé�cos

Operador Aritmeticos Significado Expresión Arit. Resultado


+ Suma a+b 12
- Resta a-b 5
* Multiplicación a*b 56
/ Divisón a/b 2
% Resto de una a%b 2
división
** Potencia a**b 4

DOCENTE: EMERSON DAVID YRENE HERRERA 12


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

• Asignación

Operador Asignación Significado Expresión Arit. Resultado


= Asignación simple x=5 5
+= Suma y asignación x += 3 8
-= Resta y asignación x -= 4 4
*= Multiplicación y x *= 3 12
asignación
/= Division y asignación x /=2 6

• Comparación

Operador Comparación Significado Expresión Arit. Resultado


> Mayor que a>b true
>= Mayor o igual que a >= b true
< Menor que a<b false
<= Menor o igual que a <= b false
!= Distinto valor a!=b true
! == Distinto valor y tipo
== Igual a, a==b true
comparación de
valor
=== Igual a, a===b false
comparación de
valor y tipo

• Lógicos

Operador Lógicos Significado Expresión Arit. Resultado


&& Conjunción (y). (7>4) & (2=1) false
|| Disyunción (o). (1=1 | 2=1) true
! Negación (no). ! (2<5) false

DOCENTE: EMERSON DAVID YRENE HERRERA 13


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

• Ternario
Es una forma abreviada de una estructura if-else:
condición ? expresión_verdadera : expresión_falsa

Ejemplo:

• Unarios
Trabajan con un solo operando:

 ++ (incremento)
 - -(decremento)

Ejemplo:

VALOR DE RETORNO
 En JavaScript, una función puede devolver un valor utilizando la palabra clave return.
 Aquí tienes un ejemplo simple de una función que devuelve el cuadrado de un número:

DOCENTE: EMERSON DAVID YRENE HERRERA 14


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

CONVERTIR A NUMERO
La función parseInt()en JavaScript se utiliza para analizar una cadena de texto (string) y convertirla en
un número entero en la base especificada.
 Parámetros:
o string: La cadena de texto que deseas conver�r.
o base (opcional): Un entero que representa la base
de la cadena. Por defecto, se asume base 10
(decimal).
 Valor de retorno:
o Retorna un número entero o NaN (Not-a-Number) si no se puede realizar la conversión.
Un ejemplo:

La función parseFloat()en JavaScript se utiliza para analizar una


cadena de texto (string) y convertirla en un números decimales en la
base especificada.

La función Number() en JavaScript se u�liza para conver�r otros �pos de datos en números.
 Parámetros:
o valor: El valor que deseas conver�r a un número.
Puede ser un número, una cadena de texto que
representa un número o cualquier otro �po de dato.
 Descripción:
o Number(valor) se u�liza para conver�r un valor en un �po numérico.
o Si el argumento no puede ser conver�do a un número, la función devuelve NaN (que
significa “no es un número”).

DOCENTE: EMERSON DAVID YRENE HERRERA 15


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

CONCATENAR CADENAS
En JavaScript es el proceso de unir dos o más cadenas para formar una nueva cadena. Hay varias
formas de hacerlo:
 Operador +: El operador + se utiliza para concatenar cadenas:

 Método concat(): El método concat() también se puede usar para unir cadenas:

 Plantillas literales: Las plantillas literales (también conocidas como template literals) son una
forma más moderna de concatenar cadenas. Puedes usar comillas invertidas (`) para crear
plantillas literales. Además, puedes insertar valores o expresiones dentro de ellas
utilizando ${}:

Las plan�llas literales son especialmente ú�les cuando necesitas combinar texto con valores
dinámicos.

DOCENTE: EMERSON DAVID YRENE HERRERA 16


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

FUNCIONES MATEMATICAS
Se pueden u�lizar dentro de cualquier expresión, y cuando se evalúe la misma, se reemplazará por el
resultado correspondiente.
Actualmente, todas las funciones disponibles son matemá�cas (es decir que devolverán un resultado de
�po numérico) y reciben un sólo parámetro de �po numérico. A con�nuación, se listan algunas de las
funciones más usadas:

Función Significado
Math.max(x,y,z) Devuelve el valor más grande
Math.min(x,y,z) Devuelve el valor más pequeño.
Math.PI Valor PI
Math.pow(base, exponente) Potencia de un número
Math.sqrt(x) Raíz cuadrada de un número.
Math.log1p(x) Devuelve el logaritmo natural de x + 1 (loge,
también ln) de un número.
Math.log10(x) Devuelve el logaritmo en base 10 de x.
Math.log2(x) Devuelve el logaritmo en base 2 de x.

ACCIONES SECUENCIALES
• Entrada (Escritura y Lectura).
• Proceso (Asignación).
• Salida (Escritura).

ESCRITURA:
Esta instrucción sirve para mostrar en pantalla datos de alguna de las siguientes formas:
 Texto: mostrar al usuario un mensaje como, por ejemplo, “Digite un numero”, “Bienvenida” y
otros.
 Valor: mostrar el valor almacenado en una variable o en una constante.
 Texto y valor: mostrar tanto texto como algún valor almacenado en una variable o en una
constante.
 El texto se coloca en comillas dobles “” o simples ‘’.

1. La función console.log() se u�liza para imprimir mensajes en la consola del navegador. Es


especialmente ú�l para depurar tu código y ver los resultados de tus operaciones. Puedes usarlo
así:

Esto mostrará el mensaje “¡Hola, mundo!” en la consola del navegador.

DOCENTE: EMERSON DAVID YRENE HERRERA 17


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

2. La función document.write() se u�liza para imprimir contenido directamente en el documento


HTML. Puedes usarlo así:

Esto insertará el mensaje “¡Hola, mundo!” directamente en el cuerpo del documento HTML.

LECTURA:
La función de esta instrucción es leer los datos que el usuario ingresa al sistema. En muchas ocasiones,
el sistema pedirá que al usuario que ingrese algún �po de dato como, por ejemplo, nombre, edad,
iden�ficación, dirección, entre muchos otros.

a) La función prompt() muestra una ventana emergente que permite al usuario ingresar un valor.
El valor ingresado se almacena en una variable y puede u�lizarse en el código.

En este ejemplo, el usuario introduce su nombre, y luego se muestra un saludo personalizado en la


página.

b) La función window.confirm() muestra una ventana emergente con un mensaje y botones “Aceptar”
y “Cancelar”.
El usuario puede confirmar o cancelar la acción.

DOCENTE: EMERSON DAVID YRENE HERRERA 18


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

c) Similar a window.prompt(), pero permite mostrar un mensaje personalizado en la ventana


emergente.

d) Formularios en HTML con campos de entrada (<input>) para que los usuarios ingresen datos.
Luego, puedes acceder a esos valores en JavaScript u�lizando el atributo value.

ASIGNACIÓN:
La asignación se u�liza cuando se requiere asignar valor a una variable o una constante. El valor que
se asigna puede ser un dato fijo como, por ejemplo, un numero o una letra o puede ser el resultado
de alguna expresión.

El signo que se emplea para hacer la


asignación es el igual (=).

3. HERRAMIENTAS DE DESARROLLO DEL NAVEGADOR


Todos los navegadores web modernos incluyen un potente conjunto de herramientas para
desarrolladores. Estas herramientas hacen una variedad de cosas, desde inspeccionar HTML, CSS y
JavaScript actualmente cargados, hasta mostrar qué ac�vos ha solicitado la página y cuánto �empo
tardaron en cargarse.

DOCENTE: EMERSON DAVID YRENE HERRERA 19


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

ABRIR DEVTOOLS EN EL NAVEGADOR:


Las herramientas para desarrolladores (devtools) viven dentro de tu navegador en una subventana
que se ve más o menos así, dependiendo del navegador que estés u�lizando:

Existen tres dis�ntas maneras:

• Teclado: Ctrl+Mayús+I, excepto en


• Internet Explorer y Edge: F12
• macOS: ⌘+⌥+I

EL INSPECTOR: EXPLORADOR DEL DOM Y EDITOR CSS


Las herramientas para desarrolladores (devtools) viven dentro de tu navegador en una subventana que
se ve más o menos así, dependiendo del navegador que estés u�lizando:

DOCENTE: EMERSON DAVID YRENE HERRERA 20


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

Si no ves al inspector,

• Toca o haz clic en la pestaña Inspector.


• En Internet Explorer, toca/haz clic en Explorador del DOM o presiona Ctrl + 1.
• En Microso� Edge u Opera, toca/haz clic en Elementos.
• En Safari, los controles no se presentan con tanta claridad, pero deberías ver el HTML si no
has seleccionado otra cosa para que aparezca en la ventana. Presiona el botón Es�lo para
ver el CSS.

EXPLORADOR DEL DOM


Las opciones disponibles en el menú varían según el navegador:
• Eliminar nodo (A veces Eliminar elemento). Elimina el elemento actual.
• Editar como HTML (A veces Agregar atributo/Editar texto). Te permite cambiar el HTML y
ver los resultados en tiempo real. Muy útil para depurar y probar.
• :hover/:active/:focus. Obliga a que se activen los estados de los elementos, para que puedas
ver cómo se vería su estilo.
• Copiar/Copiar como HTML. Copie el HTML seleccionado actualmente.
• Algunos navegadores también disponen de Copiar ruta CSS y Copiar XPath, para permitirte
copiar el selector CSS o la expresión XPath que seleccionaría el elemento HTML actual.

Intenta editar algo de tu DOM ahora. Haz doble clic en un elemento o haz clic con el botón
derecho del mouse y selecciona Editar como HTML en el menú contextual. Puedes realizar los
cambios que desees, pero no los puedes guardar.

DOCENTE: EMERSON DAVID YRENE HERRERA 21


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

EDITOR CSS
De manera predeterminada, el editor CSS muestra las reglas CSS aplicadas al elemento
seleccionado actualmente:

EL DEPURADOR DE JAVASCRIPT
El depurador de JavaScript te permite observar el valor de las variables y establecer puntos de
interrupción, lugares en tu código en los que deseas pausar la ejecución e identificar los problemas
que impiden que tu código se ejecute correctamente.

DOCENTE: EMERSON DAVID YRENE HERRERA 22


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

Para llegar al depurador:

• Firefox:
o Desarrollador Web
o Depurador o presiona Ctrl+Mayús+S para abrir el depurador de JavaScript. Si
ya estás viendo las herramientas, haz clic en la pestaña Depurador.
• Chrome: Abre las herramientas para desarrolladores y luego selecciona la pestaña
Fuentes. (Opera funciona de la misma manera).
• Edge e Internet Explorer 11: presiona F12 y luego Ctrl+3, o si ya estás viendo las
herramientas, haz clic en la pestaña Depurador.
• Safari: Abre las herramientas para desarrolladores y luego selecciona la pestaña
Depurador.

LA CONSOLA DE JAVASCRIPT
La consola de JavaScript es una herramienta increíblemente ú�l para depurar JavaScript que no
funciona como se esperaba. Te permite ejecutar líneas de JavaScript en la página actualmente
cargada en el navegador e informa los errores encontrados cuando el navegador intenta ejecutar tu
código. Para acceder a la consola en cualquier navegador:

• Si deseas ejecutar código JavaScript en la consola del navegador, puedes hacerlo.


• Abre la consola del navegador (generalmente presionando F12 o haciendo clic derecho en la
página y seleccionando “Inspeccionar” o “Inspeccionar elemento”).
• En la consola, puedes escribir cualquier código JavaScript válido y presionar la tecla Enter
para ejecutarlo.
• Por ejemplo, si quieres imprimir un mensaje en la consola, puedes escribir:
console.log("Hola, mundo!");

DOCENTE: EMERSON DAVID YRENE HERRERA 23


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

4. EJERCICIOS RESUELTOS
A. Crear un algoritmo que permita suma de cuatro números, posteriormente le asignas valores y
muestre el resultado obtenido.

B. Crear un algoritmo que permita el ingreso de un valor numérico y que nos muestre como su
resultado el doble de su valor.

DOCENTE: EMERSON DAVID YRENE HERRERA 24


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

C. Desarrollar un algoritmo que permita calcular el promedio de 3 notas de un alumno del 5to año,
el programa nos debe mostrar como resultado de las notas inicializadas del alumno.

D. Desarrollar un algoritmo para la siguiente situación, supongamos que una persona desea
depositar su dinero en el banco y saber cuánto recibirá al cabo de un mes, si el banco paga un
interés del 2% mensual.

DOCENTE: EMERSON DAVID YRENE HERRERA 25


INTRODUCCIÓN A LA PROGRAMACIÓN – SESIÓN 03

E. Diseñar un algoritmo que permita el ingreso de las horas trabajadas de un obrero y el costo por
hora, el programa debe calcular el sueldo bruto del trabajador.

DOCENTE: EMERSON DAVID YRENE HERRERA 26

También podría gustarte