El objetivo de la asignatura es que al concluir la misma hayan adquirido los conocimientos, habilidades y capacidades, para resolver problemas prácticos simples, aplicando correcta y eficientemente los fundamentos básicos de la programación.
La programación, en informática, es el proceso por el cual se instruye a una computadora o dispositivo programable, los pasos que debe seguir para llevar a cabo una tarea y/o resolver un problema.
Dichas instrucciones son impartidas con la ayuda de un lenguaje de programación. Un lenguaje de programación es la herramienta encargada de traducir instrucciones cercanas al lenguaje humano, en instrucciones que son entendidas por los dispositivos programables (ceros y unos).
Igualmente, el lenguaje de programación, se encarga de traducir las respuestas y/o mensajes que devuelve el dispositivo programable (ceros y unos) a valores y símbolos que tienen sentido para el ser humano.
Mientras más cercanas son las sentencias del lenguaje de programación al lenguaje humano, mayor es el nivel de dicho lenguaje.
Existe una amplia oferta de lenguajes que pueden ser empleados en la enseñanza y aplicación practica de la programación. Afortunadamente, la mayoría de estos lenguajes están en el ámbito del software libre, por lo que son gratuitos.
De la amplia oferta disponible se ha elegido JavaScript, principalmente por su ubicuidad, accesibilidad y aplicación inmediata: sólo se requiere de un navegador web (en cualquier dispositivo y sistema operativo) para ejecutar los programas escritos en este lenguaje. Esta característica hace posible emplear los programas escritos en JavaScript en cualquier dispositivo programable: celulares, tabletas, computadoras e inclusive consolas de juego.
Por otra parte, se ha tomado en cuenta su flexibilidad y facilidad de uso: es un lenguaje de propósito general que soporta (entre otras metodologías de programación) la programación estructurada, la programación guiada por eventos, la programación funcional y la programación orientada a objetos. Además, es compatible con C/C++ y los lenguajes de esta familia (como PHP y Java).
Si bien al principio (hace ya 30 años) se trataba de un lenguaje muy limitado, pensado sólo en la ejecución de pequeñas rutinas en las páginas WEB, hoy en día es un lenguaje completo, flexible y potente, en el cual se pueden emplear todas las estructuras de control estándar (incluido sus modificadores) emplear y crear estructuras de datos simples y complejas, hacer llamadas recursivas y circulares, ejecutar programas en paralelo, programación asíncrona, programar instrucciones binarias (WebAssembly), crear y manipular gráficas escalares y vectoriales, etc., además JavaScript puede ser ejecutado tanto en el lado del cliente como en el lado del servidor.
Para escribir los programas en Javascript sólo se requiere de un editor de textos cualquiera (por ejemplo el block de notas de Windows), sin embargo, para escribir aplicaciones complejas, se recomienda emplear una herramienta más especializada, como Visual Studio Code. Actualmente existen varias aplicaciones WEB que permiten programar JavaScript directamente en el navegador (en línea), sin instalar nada. Algunas de esas aplicaciones son: stackblitz, CodeSandbox, PlayCode, myCompiler, codePen, jsfiddle, Codespaces, Replit, One Compiler, Visual Studio Code para la Web, etc.
Los editores especializados, como los mencionados previamente, tienen la ventaja de facilitar la escritura de programas, al contar con herramientas como el resaltado de código, autocompletado, plantillas, sangría automática, búsqueda, reemplazo, etc. Además, las herramientas en línea, generalmente ofrecen espacio de almacenamiento gratuito, donde se pueden guardar los programas, de manera que puedan ser recuperados en cualquier lugar y en cualquier dispositivo.
Aunque JavaScript es el lenguaje base en la asignatura (porque es donde se programa la lógica), se hará uso también de los lenguajes HTML y CSS, que son los lenguajes de marcado con los que se construye y da formato a los componentes visuales de las páginas WEB (la interfaz de usuario de la aplicación) y se mencionarán y emplearán esporádicamente otros lenguajes de programación.
En la asignatura, muchos de los programas serán elaborados y ejecutados en la Calculadora Javascript (empleada ya en el capítulo anterior). La calculadora Javascript es una aplicación WEB, de elaboración propia, programada con Javascript, HTML y CSS. Permite escribir y ejecutar instrucciones y programas en Javascript, así como instrucciones HTML y CSS. Para utilizarla simplemente se debe hacer clic en el enlace de este párrafo, o clic en el enlace disponible en la página de la materia.
Para resolver los capítulos de la materia, se recomienda emplear Google Chrome o Microsoft Edge y es importante que siempre estén actualizados.
La calculadora Javascript hace uso del editor CodeMirror, que cuenta con capacidades de edición para la escritura de programas, tales como resaltado de código, sangría automática, autocompletado (teclas Ctrl+Spacio), cierre automático de signos de agrupación, selección y edición múltiple, búsquedas, reemplazos, etc. Las características más sobresalientes disponibles en la calculadora, así como los atajos Sublime Text respectivos, pueden ser consultadas en la página: Atajos Sublime Text para CodeMirror .
Se recuerda que, en los dispositivos móviles: teléfonos y tabletas, para tener acceso a teclas especiales: "Ctrl", "Alt", "Shift", "Tab", "Page Up", "Page Down", cursores, etc., se debe instalar la aplicación Hacker's-Keyboard, disponible en la página de la materia.
Para trabajar con comodidad en un teléfono inteligente (o tableta), se recomienda conectar un teclado y mouse externos. El teclado y mouse pueden ser conectados por cable o de forma inalámbrica por Bluetooth o empleando un adaptador OTG, al cual se puede conectar un teclado normal o el receptor inalámbrico de un teclado y mouse inalámbricos.
En primera instancia, como su nombre sugiere, la calculadora JavaScript puede ser empleada para realizar algunos cálculos matemáticos. Así, se pueden hacer cálculos aritméticos simples, siendo los operadores aritméticos:
| + | Suma |
| − | Resta |
| * | Multiplicación |
| / | División |
| % | Residuo (módulo) |
| ** | Potencia |
El operador de potencia **, permite calcular el resultado de elevar un número a una potencia, por ejemplo 2**3, devuelve 8, que es el resultado de elevar 2 al cubo (23).
Los operadores matemáticos (con excepción del residuo y la potencia) son los mismos en prácticamente todos los lenguajes de programación. Así, PHP, tiene exactamente los mismos operadores. Python igualmente, pero además tiene un operador para el cociente (//). Java y C/C++, tiene los mismos operadores pero sin el operador de potencia. Octave, tiene los mismo operadores pero sin el operador de residuo (para el residuo cuenta con la función mod ). MatLab y Mathematica emplean el operador ^ para la potencia y no tienen operador para el residuo (para el residuo cuentan con las funciones mod y Mod, respectivamente).
Como ya se vio en el anterior capítulo, para evaluar una expresión matemática en la calculadora, se escribe la expresión y luego se pulsan las teclas Shift+Enter, que es lo que se ha hecho en los siguientes ejemplos, que no son imágenes, sino expresiones escritas en la calculadora, por lo que pueden ser modificadas y evaluadas (con Shift+Enter, haga la prueba):
| \[ 2+2 \] |
| \[ 3\times4+5 \] |
| \[ 3.4+2.2-1.5 \] |
| \[ \text{residuo de } \dfrac{54}{7} \] |
| \[ 5.2^{3.1} \] |
En una expresión, los operadores aritméticos se evalúan de acuerdo a su orden de prioridad. Cuando dos o más operadores tienen el mismo orden de prioridad, se evalúan en secuencia de izquierda a derecha, excepto con los operadores de potencia, donde el orden se invierte y se evalúan de derecha a izquierda, así la instrucción 3**4**5 es equivalente a 3**(4**5). Si no tienen el mismo nivel de prioridad, los operadores se evalúan de acuerdo a su nivel de prioridad. El nivel de prioridad de los operadores aritméticos es el siguiente: a) La potenciación; b) La multiplicación, la división y el residuo y c) La suma y la resta. Es decir que en una expresión, se evalúan primero todas las operaciones de potenciación, luego las operaciones de multiplicación, división y residuo y finalmente las operaciones de suma y resta.
Para alterar el orden en que se avalúan los operadores se emplean paréntesis: las expresiones escritas entre paréntesis se evalúan en primer lugar.
Así, para evaluar la siguiente expresión:
| \[{3^2-3 \times 2+\dfrac{6}{2}\times 5} \over {3^2\times 2 - \dfrac{15}{5}\times 3}\] |
Se deben emplear paréntesis, porque primero se deben evaluar las expresiones del numerador y del denominador, para luego dividir esos resultados:
Para evaluar esta expresión, primero (dentro los paréntesis) Javascript realiza las operaciones de primer nivel, es decir que evalúa primero las potencias:
| \[\dfrac {(3^2=\bold{\textcolor{blue}{9}})-3 \times 2+\dfrac{6}{2}\times 5} {(3^2=\bold{\textcolor{blue}{9}})\times 2 - \dfrac{15}{5}\times 3} = \dfrac {\bold{\textcolor{blue}{9}}-3 \times 2+\dfrac{6}{2}\times 5} {\bold{\textcolor{blue}{9}}\times 2 - \dfrac{15}{5}\times 3}\] |
Luego evalúa las operaciones de multiplicación y división, evaluándolas, igualmente, de izquierda a derecha cuando existen dos o más multiplicaciones y/o divisiones consecutivas:
| \[\dfrac {\bold{\textcolor{blue}{9}}-\left(3 \times 2 = \bold{\textcolor{blue}{6}} \right)+\left(\left(\dfrac{6}{2}=3\right)\times 5=\bold{\textcolor{blue}{15}}\right)} {\left(9\times 2=\bold{\textcolor{blue}{18}} \right) - \left(\left(\dfrac{15}{5}=3 \right) \times 3=\bold{\textcolor{blue}{9}} \right)} = \dfrac {\bold{\textcolor{blue}{9}}-\bold{\textcolor{blue}{6}}+\bold{\textcolor{blue}{15}}} {\bold{\textcolor{blue}{18}}-\bold{\textcolor{blue}{9}}}\] |
Luego lleva a cabo las operaciones de suma y resta (igualmente evaluándolas de izquierda a derecha cuando existen dos o más operaciones consecutivas):
| \[\dfrac {\left(\left(9-6=3\right)+15=\bold{\textcolor{blue}{18}}\right)} {\left(18-9=\bold{\textcolor{blue}{9}}\right)} = \dfrac {\bold{\textcolor{blue}{18}}} {\bold{\textcolor{blue}{9}}}\] |
Finalmente evalúa esta última división, siendo el resultado:
| \[\dfrac {18} {9} = {\bold{\textcolor{blue}{2}}}\] |
Si no se emplean paréntesis, no se evalúan primero las expresiones del numerador y denominador, sino que todas las operaciones se evalúan de acuerdo a su nivel de prioridad (y de izquierda a derecha cuando tienen el mismo nivel), así, al evaluar las operaciones de primer nivel, se obtiene:
| \[\left(3^2=\bold{\textcolor{blue}{9}}\right)-3 \times 2+\dfrac{6}{2}\times \dfrac{5}{\left(3^2=\bold{\textcolor{blue}{9}}\right)}\times 2 - \dfrac{15}{5}\times 3\\ =\\ \bold{\textcolor{blue}{9}}-3 \times 2+\dfrac{6}{2}\times \dfrac{5}{\bold{\textcolor{blue}{9}}}\times 2 - \dfrac{15}{5}\times 3\] |
Note que, al no existir paréntesis, el divisor sólo afecta al último término del numerador (5) y al primero del denominador (3**2 = 9).
Entonces, se llevan a cabo las operaciones de segundo nivel:
| \[9-\left(3 \times 2 = \bold{\textcolor{blue}{6}} \right)+\left(\left(\left(\left(\dfrac{6}{2}=3\right)\times 5=15\right)/9=1.66... \right)\times 2 = \bold{\textcolor{blue}{3.33...}}\right)\\ - \left(\left(\dfrac{15}{5}=3\right)\times 3=\bold{\textcolor{blue}{9}}\right)\\ =\\ {\bold{\textcolor{blue}{9}}}-\bold{\textcolor{blue}{6}}+\bold{\textcolor{blue}{3.3333333333333335}} - \bold{\textcolor{blue}{9}}\] |
Realizando las operaciones de tercer nivel, se obtiene:
| \[\left(\left(\left(9-6=3\right)+3.33...= 6.33...\right)- 9=\bold{\textcolor{blue}{−2.66...}}\right)= \bold{\textcolor{blue}{−2.666666666666666}}\] |
Resultado que puede ser corroborado escribiendo la expresión en la calculadora:
Que, por supuesto, no es el resultado correcto porque, al no haberse empleado paréntesis, se ha programado la siguiente ecuación (no la ecuación original):
| \[3^2-3 \times 2+\dfrac{\dfrac{6}{2}\times 5}{3^2\times 2} - \dfrac{15}{5}\times 3\] |
Si el numerador sólo tiene operaciones de igual o mayor nivel a la división (potenciación, multiplicación y residuo), no se requieren paréntesis, porque las operaciones de mayor nivel (la potenciación) se evalúan primero y las de igual nivel (multiplicación y división) se evalúan de izquierda a derecha, por lo que el resultado del numerador se obtiene antes de que se evalúen las operaciones del denominador. Así dada la siguiente expresión:
| \[{2^3\times\dfrac{4}{3^2}\times{4}\times\dfrac{12}{3}} \over {3+\dfrac{9}{3}}-2\] |
Sólo se requieren paréntesis en el denominador, porque el denominador tiene operaciones de menor nivel que la división (suma y resta):
Si el denominador tiene más de un término y esos términos son del mismo o mayor nivel que la división (potenciación, multiplicación y residuo) no se requieren paréntesis. En ese caso primero se evalúan las operaciones de potenciación y luego las operaciones de multiplicación y división (de izquierda a derecha), sin embargo, como estas operaciones se evalúan después de obtener el resultado del numerador, quedan invertidas, por lo que, para obtener el resultado correcto, las multiplicaciones deben convertirse en divisiones y las divisiones en multiplicaciones:
Así, para evaluar la siguiente expresión:
| \[{3\times 2^4\times\dfrac{8}{2}} \over {5\times\dfrac{3^2}{2}\times 4}\] |
Se escribe:
Pero, como se puede ver, la expresión resultante es confusa y al ser necesario invertir las operaciones de multiplicación y división, es muy fácil cometer errores. Por esa razón, para evitar errores, cuando el denominador tiene dos o más términos se deben emplear paréntesis:
Igualmente, aunque en ocasiones no se requieran paréntesis en el numerador, si la expresión es muy compleja, se recomienda emplearlos, para reducir probables errores:
Si ayuda a escribir una expresión más legible, se pueden emplear paréntesis adicionales tanto en el numerador como en el denominador:
No obstante, si se emplean paréntesis en exceso, la expresión resultante, en lugar de ser más legible resulta más confusa:
Por esa razón, se recomienda emplear paréntesis adicionales solo cuando con ello se logra una expresión más legible.
Continuando con el uso de la calculadora JavaScript para evaluar expresiones matemáticas, en esta sección se introducen las funciones matemáticas predefinidas en el lenguaje.
En realidad, casi todo en JavaScript son objetos, incluidas las funciones matemáticas. Desde un punto de vista práctico, el que una función sea parte de un objeto, implica que se debe escribir primero el nombre del objeto, luego un punto y recién el nombre de la función (el nombre del método).
Por ejemplo, para calcular el seno de 6.23 radianes, se escribe Math.sin(6.23):
Las funciones matemáticas disponibles en el objeto Math son:
| abs(x) | Valor absoluto de "x". |
| acos(x) | Arco coseno de "x". |
| acosh(x) | Arco coseno hiperbólico de "x". |
| asin(x) | Arco seno de "x" (resultado en radianes). |
| asinh(x) | Arco seno hiperbólico de "x". |
| atan(x) | Arco tangente de "x". |
| atanh(x) | Arco tangente hiperbólico de "x". |
| atan2(y,x) | Arco tangente del cociente de "y" entre "x". |
| cbrt(x) | Raíz cúbica de "x". |
| ceil(x) | Entero más cercano mayor o igual a "x". |
| clz32(x) | Número de ceros iniciales del entero "x" de 32 bits. |
| cos(x) | Coseno de "x". |
| cosh(x) | Coseno hiperbólico de "x". |
| exp(x) | Exponente de "x": \( e^x \). |
| expm1(x) | Devuelve \( e^x-1 \). |
| floor(x) | Entero más cercano menor o igual "x". |
| fround(x) | Devuelve el número real de simple precisión más cercano a "x". |
| hypot([x[,y[, ...]]]) | Raiz cuadrada de la suma de los cuadrados de "x", "y", ... |
| imul(x,y) | Multiplica los enteros de 32 bits "x" y "y". |
| log(x) | Logaritmo natural de "x": \( \ln(x)\). |
| log1p(x) | Logaritmo natural de "1+x": \(\ln(1+x)\). |
| log10(x) | Logaritmo en base 10 de "x": \(\log(x)\). |
| log2(x) | Logaritmo en base 2 de "x": \(\log_{{}_2}(x)\). |
| max([x[,[y[, ...]]]]) | Mayor de los números "x", "y", ... |
| min([x[,[y[, ...]]]]) | Menor de los números "x", "y", ... |
| pow(x,y) | "x" elevado a "y", (\(x^y\)), igual a x**y. |
| random() | Número aleatorio comprendido entre 0 y 1. |
| round(x) | Redondea "x" al entero más cercano. |
| sign(x) | Devuelve 1, si "x" es positivo, -1 si es negativo y 0 si es cero. |
| sin(x) | Seno del "x". |
| sinh(x) | Seno hiperbólico de "x". |
| sqrt(x) | Raíz cuadrada de "x". |
| tan(x) | Tangente del "x" ("x" en radianes). |
| tanh(x) | Tangente hiperbólica de "x". |
| trunc(x) | Parte entera de "x". |
Donde, en las funciones trigonométricas, los ángulos deben ser escritos en radianes.
La mayoría de los lenguajes de programación tienen los mismos nombres para las funciones matemáticas, aunque la forma en que se escriben (la sintaxis) suele diferir ligeramente. Así, Java emplea la misma sintaxis que JavaScript, Python emplea "math" en lugar de "Math", PHP, C/C++, Octave y Matlab, no requieren "Math" ni "math", pues son funciones (no métodos). En Mathematica son también funciones, pero los nombres se escriben con mayúscula inicial (como ocurre con todas las funciones de dicho lenguaje).
Además, en la calculadora Javascript, se pueden emplear también las siguientes funciones matemáticas.
| cot(x) | Cotangente de "x". |
| coth(x) | Cotangente hiperbólica de "x". |
| csc(x) | Cosecante de "x". |
| csch(x) | Cosecante hiperbólica de "x". |
| even(x) | Verdadero si "x" es par. |
| factorial(x) | Factorial de "x". |
| frac(x) | Parte fraccionaria de "x". |
| log(b,x) | Logaritmo en base "b" de "x". |
| odd(x) | Verdadero si "x" es impar. |
| quot(x,y) | Cociente (parte entera) de "x/y". |
| sec(x) | Secante de "x". |
| sech(x) | Secante hiperbólica de "x". |
| sqr(x) | Cuadrado de "x" (x2). |
| toDeg(x) | Convierte "x" de radianes a grados. |
| toRad(x) | Convierte "x" de grados a radianes. |
| nthroot(x,n) | Raíz enésima (n) de "x". |
En el objeto Math se han definido también algunas constantes:
| E | Número de Euler. |
| LN2 | Logaritmo natural de 2. |
| LN10 | Logaritmo natural de 10. |
| LOG2E | Logaritmo en base 2 del número de Euler. |
| LOG10E | Logaritmo en base 10 del número de Euler. |
| PI | Número pi. |
| SQRT1_2 | Raíz cuadrada de 1/2. |
| SQRT2 | Raíz cuadrada de 2. |
Que se emplean de forma similar a las funciones, excepto que no se escriben paréntesis después del nombre.
En programación, los nombres de las variables, funciones, constantes, objetos, etc., se conocen como identificadores.
Aunque no es una regla del lenguaje, sino una convención, los nombres de las constantes se escriben en mayúsculas (como SQRT2) y si son nombres compuestos se separan con guiones bajos (como en MAX_INTEGER). Los nombres de las variables y funciones se escriben en minúsculas (como en floor) y, si son nombres compuestos, la segunda y subsiguientes palabras se escriben con la letra inicial en mayúsculas (como en firstElementChild). Las clases (y objetos constructores) se escriben con la letra inicial en mayúsculas (como en Math).
Además, Javascript, diferencia entre mayúsculas y minúsculas, por lo tanto, para Javascript, Math y math son dos nombres diferentes.
Debido a que es muy fácil olvidar tanto las funciones como las diferentes instrucciones del lenguaje, es conveniente contar con una ayuda memoria. En el caso de la calculadora y gracias a CodeMirror, se cuenta con esa ayuda y se accede a la misma pulsando las teclas Ctrl+Espacio, como se muestra en el siguiente video:
Es conveniente acostumbrarse a emplear este procedimiento no sólo como una ayuda memoria, sino para acelerar la escritura de código y reducir los errores.
Empleando paréntesis y las funciones matemáticas de Javascript, se puede calcular el valor de prácticamente cualquier expresión matemática.
Por ejemplo, para calcular el valor de la siguiente expresión matemática:
| \[\sqrt{{\sin(4.5)-\cos(1.2)}\over{\tan(2.3)}}\] |
Se escribe en la calculadora:
Y para calcular el valor de las siguiente expresión:
| \[\Big({\sin(1.2)+\cos(3.1)+\tan(0.7)}\Big)^{0.32}\] |
Se escribe:
Que también puede ser calculada con pow:
Como se puede ver en este ejemplo, en Javascript y en los lenguajes de programación en general, casi siempre existe más de una forma de obtener el mismo resultado (o resolver el mismo problema).
En la calculadora, como ocurre en la mayoría de los editores, para deshacer la última acción se pulsan las teclas Ctrl+Z. Si bien es posible copiar y pegar en la forma estándar (Ctrl+C y Ctrl+V o Ctrl+Arrastrar con el mouse) es más eficiente recuperar instrucciones anteriores pulsando las teclas Ctrl+Arriba y las teclas Ctrl+Abajo para instrucciones posteriores.
Por ejemplo para calcular los cosenos de 5, 7, 10, 15 y 25 radianes, se procede de la siguiente forma:
Se recomienda emplear el anterior procedimiento siempre que sea posible. Así, para calcular el valor de las siguientes expresiones (que sólo difieren en dos signos):
| \[\sqrt{{3+4^{1.2}+6^{3.2}}\over{\text{e}^{6.5}+\cos(6.7)}}\] \[\sqrt{{3-4^{1.2}+6^{3.2}}\over{\text{e}^{6.5}-\cos(6.7)}}\] |
Se procede de la siguiente manera:
Los siguientes ejercicios, tienen el propósito de adquirir práctica en el manejo de la calculadora y al mismo tiempo, fijar en memoria los operadores y algunas funciones matemáticas.