38 - Bucles for anidados, Price Matrix (Lecciones JS)
📘 Tarea: Price Matrix
El usuario ingresa un número del 1 al 10.
Después de hacer clic en el botón, se debe mostrar el siguiente resultado:
$1
( $11 $21 $31 $41 $51 )
$2
( $12 $22 $32 $42 $52 )
$3
( $13 $23 $33 $43 $53 )
- Usar bucles
for anidados
- Usar
if para comprobar el rango
- Si el número es menor que 1 o mayor que 10 — mostrar un mensaje de error
📐 Lógica de funcionamiento:
- Obtener el número del input
- Comprobar que está en el rango de 1 a 10
- El bucle externo crea las filas (
$1, $2, $3...)
- El bucle interno crea los valores dentro de los paréntesis
- Añadir cada nuevo valor con
+=
🧪 Ejemplo:
Input: 3
$1
( $11 $21 $31 $41 $51 )
$2
( $12 $22 $32 $42 $52 )
$3
( $13 $23 $33 $43 $53 )
📐 Estructura HTML del resultado:
- Cada fila debe estar dentro de un
div class="price-row"
<div>
$2
( $12 $22 $32 $42 $52 )
</div>
📌 Importante:
- El bucle externo es responsable de las filas
- El bucle interno es responsable de los valores dentro de la fila
- La comprobación del rango debe hacerse con
if