Tablas de Multiplicar con JavaScript

JavaScript

En este artículo veremos como podemos generar las tablas de multiplicar con JavaScript a partir de un digito que ingresemos a nuestra aplicación, cabe recalcar que este tipo de funciones sobre calculos en muchas ocasiones es viable delegarlas al cliente y no al servidor y así evitar sobrecargas de las páginas, para este ejemplo utilizaremos en nuestro HTML un input (Caja de texto) donde el usuario ingresará el digito de la tabla de multiplicar que desea generar, seguido se realiza el calculo de todas las operaciones hasta el 10 mediante un bucle for, veamos:

<html>
    <head>
        <title></title>
    </head>
    <body>
    <fieldset>
        <legend>Tablas</legend>
        <label for="">¿Que tabla de multiplicar desea generar?:</label>
        <input type="text" id="txtN1">
        <br><br>
        <input type="button" onclick="Generar();" value="Generar">

    </fieldset>
        
    </body>
    <script>
        function Generar() {
            var tabla = document.getElementById('txtN1').value;
            for (var i = 0; i < 10; i++) {
                document.write(""+tabla+" X "+i+" = "+(i*tabla)+"<br>");
            }
        }
    </script>
</html>

Análisis Tablas de Multiplicar con JavaScript

Como mencionamos al principio tenemos un campo de texto (input) el cual espera el valor de la tabla de multiplicar que deseamos revisar, luego de tener el valor mediante un ciclo for iteramos hasta llegar a 10, teniendo en cuenta que en cada iteración mostramos el valor de la variable «i«, que es la variable de iteración, la cual al mismo tiempo vamos multiplicando con la variable tabla que almacena el valor de la tabla que el usuario desea revisar, por último haciendo uso de document.write() mostramos el valor de todo el proceso en pantalla.

Resultado

8 X 0 = 0
8 X 1 = 8
8 X 2 = 16
8 X 3 = 24
8 X 4 = 32
8 X 5 = 40
8 X 6 = 48
8 X 7 = 56
8 X 8 = 64
8 X 9 = 72

De esta manera podemos ver el uso fundamental que tienen los ciclos repetitivos en JavaScript.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *