Codificación de Algoritmos
Codificación de Algoritmos
Introducción
Programar es el proceso de crear software escribiendo, probando, depurando y dando mantenimiento a las
instrucciones del computador en un lenguaje de programación. A este conjunto de instrucciones se les
denomina código fuente del software creado.
Existen centenares de lenguajes de programación, muchos de ellos fueron creados para dar respuesta a
problemas particulares o máquinas específicas. No es de interés ahora discutir todos los tipos de lenguajes
existentes, sino, más bien, conocer aquellos que pueden ser interpretados por computadores, smartphones o
que pueden ser empleados para proveer servicios informáticos a través de internet y su clasificación más
general.
Un lenguaje de programación es diferente al lenguaje de códigos que puede entender la máquina (lenguaje de
máquina). Los lenguajes de programación pueden dividirse en dos categorías: lenguajes interpretados o
lenguajes compilados, a saber:
Tabla 1
Lenguajes de programación
Compilado Interpretado
Definición
El código creado debe traducirse de manera que Un programa escrito en un lenguaje interpretado,
el procesador del computador o smartphone necesita de otro programa auxiliar (el intérprete),
pueda comprenderlo, a este proceso se le llama que traduce los códigos fuentes de un programa
compilación. y los interpreta para la máquina.
El lenguaje compilado necesita que antes de ser Un lenguaje interpretado es convertido a lenguaje
ejecutada una compilación se convierta el código de máquina cada vez que es ejecutado (para ello
fuente escrito a un lenguaje de máquina. requiere del intérprete), que traduce las
instrucciones.
Características
Cuando se está ejecutando un programa escrito Un lenguaje interpretado para ser ejecutado, debe
en un lenguaje compilado es mucho más rápido tener instalado el interpretador.
que uno interpretado, dado a que se encuentra en
código de máquina.
Los lenguajes compilados están optimizados El código fuente en un lenguaje interpretado está
para el momento de la ejecución, pero esto optimizado para hacerle la vida más fácil al
significa más trabajo para el programador programador, aunque esto signifique una carga
(compilarlo). adicional de procesamiento para la máquina.
JavaScript, al igual que cualquier otro lenguaje de programación, tiene algunas características especiales:
sintaxis, modelo de datos, etc. JavaScript es un lenguaje esencial para cualquier principiante de
programación y también para quienes ya saben programar, debido a que las diferencias con otros lenguajes
de programación son numerosas siendo un lenguaje necesario para el desarrollo de aplicaciones web y móviles
hoy en día.
En su mayoría los navegadores (Chrome, Mozilla, Edge) tienen intérprete de JavaScript y adicional se puede
instalar el intérprete para el sistema operativo de preferencia (Framebits, 2020).
Dado lo anterior, existen herramientas, manuales o videos que se emplean para el desarrollo de programas en
JavaScript y a continuación se comparten recursos de acceso y material audiovisual de apoyo de cada
herramienta, tal como se indica en la siguiente tabla.
Tabla 2
Entornos de codificación
Herramienta Recurso Web Uso y/o instalación
Editor y compilador en https://playcode.io/ Woodrow, J (2018)
línea PlayCode How to use playcode.io.
https://www.youtube.com/watch?v=9rtsvbc4KZI
Intérprete de https://nodejs.org/es/ Framebits. (19 de enero. 2020). Descargar e
JavaScript: Node js instalar Node Js en Windows 10. Youtube.
https://youtu.be/v0x1Ku5Tgac
Editor de código Visual https://code.visualstu Code Compadre. (30 de junio. 2020). How to
Studio Code dio.com/ Download and Install Visual Studio Code for
Windows 10. Youtube.
https://youtu.be/KpzkPlh_HsU
El navegador: Google https://www.google.co Choque, R. C. (2020, May 10). Cómo usar la
Chrome m/chrome/ consola de google chrome para Javascript.
Youtube. Retrieved from
https://www.youtube.com/watch?v=Hf3n-p3VYx4
En JavaScript se pueden utilizar muchas funciones matemáticas; por ejemplo, un algoritmo que toma dos
números (8 y 6) y le aplica las 4 operaciones básicas y en el editor de código online PlayCode (disponible en
https://playcode.io/) se revisan las características de la sintaxis del JavaScript y a la vez se conocen las
operaciones matemáticas del lenguaje.
Figura 3
Operaciones aritméticas con JavaScritpt
Explicación: en las líneas 1 y 2 aparece la palabra reservada let que sirve para indicar que se define una
variable accesible en el contexto donde se crea (cuando se vea programación modular quedará más claro esto
del contexto).
let numero1 = 8;
let numero2 = 6;
Codificación de algoritmos
Las palabras reservadas numero1 y numero2, se les asigna el valor correspondiente. Es de observar que se
definen y se inicializa la variable en una misma línea, esto es una característica del lenguaje.
Luego en las líneas 4 al 7 se crean o se definen unas variables con la palabra reservada var, a diferencia de la
palabra let estas variables se pueden ver desde cualquier parte o módulo del script.
Una vez se crean las variables con identificadores suma, resta, producto, division, también son inicializados
sus valores empleando las operaciones matemáticas respectivas.
Una de las formas que JavaScript permite mostrar los resultados es con la función log del objeto console y se
accede console.log() (con el operador punto .) y entre paréntesis lo que se desea mostrar en la pantalla de la
consola.
Validación: dentro de los paréntesis "la suma es: " + suma, aparece la operación más + usado para sumar dos
números antes, solo que acá no hay dos números sino una cadena de texto y un número, pero en este caso lo
que hace el operador + es concatenar o juntar el texto “la suma es:” y el valor de la variable suma. A esta
característica de los operadores se les llama sobrecarga de operadores, porque según el tipo de datos suma y
según otra concatena.
Cuando las operaciones matemáticas son más complejas como la raíz cuadrada, la función exponencial, las
funciones trigonométricas, existe un objeto que agrupa estas funciones se llama Math, puede ver la
documentación técnica de la clase completa en Math (MDN, 2021b), a continuación, un ejemplo de su uso.
Se debe crear un algoritmo que muestre el seno del valor PI (3,1416) multiplicado por 3 la función, y también
que nos eleve 6 a la tercera potencia mostrando su resultado:
Figura 4
Uso del objeto Math
Codificación de algoritmos
Se debe escribir el código fuente de las figuras 3 y 4, y obtener los mismos resultados en la consola, como se
muestra en cada imagen, de esta forma se familiariza con la herramienta de trabajo.
Tabla 1
Métodos del objeto Math
Nota: Tomada de MDN (2021b)
Todas las funciones matemáticas se pueden combinar con otras operaciones aritméticas o emplear operadores
de evaluación de condición y previo a ello es preciso conocer los diferentes tipos de datos que existen.
Existen muchos tipos de operadores para JavaScript, cuya función es realizar una operación entre dos o más
valores contenidos en variables, constantes o acumuladores:
A. Tipos de datos
JavaScript tiene los siguientes tipos de operadores (se describirán los principales para aprender a programar).
Según sea el tipo que las variables o constantes almacenan, se pueden clasificar en seis (6) tipos de datos
primitivos la referencia del lenguaje dice que son:
● Undefined: indeterminado o indefinido
● Boolean: tipo booleano los valores posibles son true o false.
● Number: números enteros, o decimales.
● String: cadenas de texto.
● BigInt: números enteros grandes.
● Symbol: referencia a otros datos
Cuando se declaran variables se debe considerar los siguientes tipos, ya se han usado dos (2) de ellas:
● var: declara una variable, opcionalmente la inicia a un valor.
● let: declara una variable local con ámbito de bloque, opcionalmente la inicia a un valor.
● const: declara un nombre de constante de solo lectura y ámbito de bloque.
Para ampliar la información de acuerdo con los tipos de datos y estructuras, se debe revisar el material
complementario dispuesto:
Una variable en JavaScript puede tener cualquier tipo de dato, entero, real, cadena de texto etc. JavaScript no
es un lenguaje fuertemente tipado de manera que queda en el programador la responsabilidad de saber qué
tipo de dato está almacenando en cada variable.
B. Operadores
Se considera una expresión, aunque de un tipo distinto, el asignar un valor a una variable. Para todas estas
operaciones se emplean los denominados ‘operadores‘. Se listan a continuación algunos de los operadores
que se utilizan con mucha frecuencia.
❖ Operadores de asignación
También hay operadores de asignación compuestos que son una abreviatura de las operaciones enumeradas
en la siguiente tabla:
Tabla 2
Operadores de asignación básicos
Nombre Operador Significado
abreviado
Asignación x=y x=y
Asignación de adición x += y x=x+y
Asignación de resta x -= y x=x-y
Asignación de x *= y x=x*y
multiplicación
Asignación de división x /= y x=x/y
Asignación de residuo x %= y x=x%y
Asignación de x **= y x = x ** y
exponenciación
Nota: Tomada de MDN (2021a)
❖ Operadores de comparación
Son operadores cuya función es comparar dos expresiones y como resultado de la comparación devuelven un
valor falso o verdadero (booleano), que representa la relación de sus valores comparados. Existen operadores
para comparar valores numéricos, pero también operadores para comparar cadenas y operadores para
comparar otros tipos de datos (tabla 3).
Tabla 3
Operadores lógicos
Codificación de algoritmos
❖ Operadores de aritméticos
Los operadores aritméticos toman valores numéricos (ya sean literales o variables) como sus operandos y
devuelve un solo valor numérico. Los operadores aritméticos básicos son suma (+), resta (-), multiplicación (*) y
división (/). Estos operadores funcionan como en la mayoría de los otros lenguajes de programación cuando se
usan con números de punto flotante, teniendo en cuenta que la división por cero produce un error (tabla 4).
Tabla 4
Operadores aritméticos
Operador Descripción Ejemplo
Residuo (%) Operador binario. Devuelve el resto entero de 12 % 5 devuelve 2.
dividir los dos operandos.
Incremento (++) Operador unario. Agrega uno a su operando. Si x es
Si se usa como operador prefijo (++x), 3, ++x establece x en 4 y
devuelve el valor de su operando después de devuelve 4, mientras
agregar uno; si se usa como operador sufijo que x++ devuelve 3 y, solo
(x++), devuelve el valor de su operando antes entonces, establece x en
de agregar uno. 4.
Decremento (--) Operador unario. Resta uno de su operando. Si x es 3,
El valor de retorno es análogo al del entonces --x establece x e
operador de incremento. n 2 y devuelve 2, mientras
que x-- devuelve 3 y, solo
Codificación de algoritmos
entonces, establece x en
2.
Negación Operador unario. Devuelve la negación de su Si x es 3,
unaria (-) operando. entonces -x devuelve -3.
Positivo Operador unario. Intenta convertir el +"3" devuelve 3.
unario (+) operando en un número, si aún no lo es. +true devuelve 1.
Operador de Calcula la base a la potencia de exponente, 2 ** 3 retorna 8.
exponenciación (* es decir, base exponente 10 ** -1 retorna 0.1.
*)
Nota: Tomada de MDN (2021a)
❖ Operadores lógicos
Con los operadores lógicos, se pueden crear condiciones compuestas, por ejemplo, cuando se deben cumplir
dos o más condiciones para elegir las operaciones ejecutar; además, se pueden describir estas combinaciones
de condiciones (tabla 5 y figura 5).
Tabla 5
Operadores lógicos
Operador Uso Descripción
AND Lógico (&&) expr1 && Devuelve expr1 si se puede convertir a false; de lo contrario,
expr2 devuelve expr2. Por lo tanto, cuando se usa con valores
booleanos, && devuelve true si ambos operandos son true; de
lo contrario, devuelve false.
OR lógico (||) expr1 || Devuelve expr1 si se puede convertir a true; de lo contrario,
expr2 devuelve expr2. Por lo tanto, cuando se usa con valores
booleanos, || devuelve true si alguno de los operandos es true;
si ambos son falsos, devuelve false.
NOT lógico (!) !expr Devuelve false si su único operando se puede convertir a true;
de lo contrario, devuelve true.
Nota: Tomada de MDN (2021a)
Figura 5
Ejemplos de operadores lógicos
Codificación de algoritmos
Se han presentado los operadores más comunes, aunque existen otros tipos de operadores que tal vez no son
los más empleados y una referencia completa la puede obtener desde el recurso web denominado Expresiones
y operadores (MDN, 2021a).
Es importante recordar que los computadores ejecutan los operadores en un orden establecido. El siguiente es
el orden (jerarquía), de acuerdo con los expuestos anteriormente, y deben conservar el orden de precedencia
de operadores:
JavaScript permite poner comentarios en el código fuente, como la mayoría de los lenguajes de programación y
existen dos tipos de comentarios en línea que comienzan con una doble barra: //, y los comentarios multilínea,
que comienzan con /* y terminan con */ tal como se observa en la siguiente figura.
Codificación de algoritmos
Figura 6
Tipos de comentarios
Los comentarios son importantes porque le dan mantenibilidad al programa, es decir que otro programador, o el
mismo, tiempo después puede revisar el código y apoyarse en los comentarios para saber qué hace el
algoritmo y como lo hace.
En adelante se procura que exista al menos un comentario en cada código fuente empleado para ejemplificar
los elementos constitutivos del lenguaje de programación JavaScript y puede hacer lo mismo durante la
creación de los diferentes códigos.
La estructura de selección se necesita cuando el código de tu programa ejecuta uno de varios resultados
posibles, basado en el valor de una condición.
Ejemplo: un aprendiz aprueba un examen cuando la calificación de este es mayor o igual a 3. Elaborar
un programa en JavaScript donde que dada una calificación, aplique el criterio de aprobación e
imprima “Aprobado” o “Reprobado”, según sea el caso.
Como resultado del análisis a este problema tenemos el diseño del siguiente algoritmo:
Figura 7
Seudocódigo calificaciones.
INICIO
calificacion = 4;
SI ( calificación >= 3)
ESCRIBIR( “Aprobo” );
SINO
ESCRIBIR( “Reprobo” );
FINSI
FIN
De la misma forma, se puede realizar el algoritmo que, dada una edad en años, evalúe e imprima si es mayor
de edad:
De acuerdo con la figura 9, no existe un contexto
Figura 9 si no se cumple la condición de mayoría de edad
Escribir en pantalla si es o no mayor de edad a esta estructura se denomina CONDICIONAL
SIMPLE.
Las estructuras de repetición permiten repetir un bloque de instrucciones, determinado o no, un número de
veces. A continuación, se ejemplifican los más comunes (FOR, WHILE) que se pueden codificar también en la
sintaxis de JavaScript.
Ejemplo 1: escribir un procedimiento que muestre siete (7) veces en pantalla la frase “Esto es un algoritmo”.
Mostrar en pantalla la salida del ejercicio:
Para recordar: el carácter punto y coma se usa para decirle al computador, o intérprete, que ha
finalizado una instrucción.
La estructura de repetición PARA (FOR) se usa cuando se sabe cuántas veces se debe repetir un
grupo de instrucciones.
Ejemplo 2: se necesita elaborar un algoritmo en JavaScript que, dado un número entero, sume todos los
números naturales que hay hasta ese número. Por ejemplo, si el usuario digita 3, el programa debe sumar: 1 +
2 + 3, si el usuario digita 5 el programa debe sumar 1+2+3+4+5. Al finalizar, debe imprimir el resultado.
A través del ejemplo del cálculo de factorial se explicará el uso y comportamiento de la sentencia while.
Recordando el algoritmo diseñado:
Codificación de algoritmos
Figura 10
Seudocódigo algoritmo cálculo de factorial
Figura 11
Seudocódigo algoritmo cálculo de factorial
Es ideal poder transcribir el código usando https://playcode.io/new/, para lo cual se debe escribir la condición del
while, es decir, contador <= numero de último, para que el sistema PlayCode no entre a un ciclo que nunca
termina. Una vez funcione correctamente, se propone el código que está entre comentarios (//) para practicar
las dos formas de sintaxis.
Es de recordar que las estructuras de repetición básicas y su sintaxis pueden pasar su aplicación más común
para recorrer la estructura de datos.
Las estructuras de datos también conocidas como arreglos, son importantes en el desarrollo de algunos
algoritmos son obligatorias a la hora de hacer aplicaciones web o móviles; por ello, se explica su sintaxis en
JavaScript para los vectores, matrices y registros.
A. Vectores
Los vectores se definen en JavaScript como un tipo de dato con métodos, y atributos que lo definen. Es ideal
analizar lo siguiente:
En la línea 1 se ve cómo se define un vector
Figura 12 con identificador frutas, de tres (3) elementos,
Definición de un vector cada uno de ellos es una cadena de texto con
una fruta.
Los índices de los vectores se comienzan en cero, en otras palabras, el índice del primer elemento de
un vector es 0, y el del último elemento es igual al valor de la propiedad length del array restándole 1. Si se
utiliza un número de índice no válido, se obtendrá undefined.
Figura 13
Indexar un vector
Codificación de algoritmos
Ahora, se debe crear un programa que guarde los resultados de la tabla de 5 en un vector, con estos resultados
recorrer el vector e imprimir la tabla del 5:
Figura 15
Crear la tabla del 5
Tabla 6
Funciones comunes de un vector
Función Descripción
Codificación de algoritmos
B. Matrices
Las matrices se pueden ver lógicamente como un vector, y cada uno de sus elementos es otro vector, así la
representación de la matriz queda codificada como muestra la figura 16:
Figura 16
Crear la tabla del 5
Hasta ahora se ha visto cómo un arreglo es la colección de datos del mismo tipo, pero un registro es una
colección de datos de diferente tipo que se relacionan entre sí:
Tabla 7
Registros
Nombre Correo Edad Saldo
Juan [email protected] 19 36.234
Luis [email protected] 18 23.234
Andrea [email protected] 22 0
m
Pedro [email protected] 12 65.234
m
Maria [email protected] 16 123
m
Codificación de algoritmos
Para recorrer todos los registros se precisan dos (2) ciclos for, uno dentro de otro (anidado) como se muestra a
continuación:
Figura 18
Recorrer registros
Codificación de algoritmos
Como se puede observar en la figura 18, se requieren dos ciclos for anidados, y cada ciclo tiene una variable
de índice de nombre diferente i y j y la manera de indexar la matriz vista anteriormente en el ejemplo de
registros [ i ][ j ].
Estas estructuras son instrucciones que permiten romper la ejecución natural o secuencial de los programas,
permitiendo que se salte a otro punto de la ejecución del programa, estas instrucciones tienen las palabras
reservadas (continue, break y return):
● Sentencia continue
La sentencia continue se salta a la siguiente iteración del ciclo for o while como se presenta en el siguiente
ejemplo y teniendo en cuenta los resultados.
Figura 19
Sentencia continue
Como se observa, cuando la variable i tiene el valor 3, se ejecuta la sentencia continue se salta la sentencia
donde debe imprimir el valor de 3, por ese motivo no aparece en la consola.
● Sentencia break
Por otro lado, la sentencia break, detiene la ejecución del ciclo independientemente de cuántas veces este
configurando el ciclo. Mire el siguiente ejemplo en la Figura 20, prestando especial atención en la salida de
consola.
Figura 20
Sentencia break
Codificación de algoritmos
En la anterior figura, cuando i tiene el valor de 3 ya no se sigue ejecutando más el ciclo, aunque esté
programado para ejecutarse 5 veces, solo ejecuta 3 iteraciones y, ya que en el tercero luego de evaluar la
condición i == 3 ejecuta la sentencia break haciendo que termine todo.
● Sentencia return
Sirve para terminar la ejecución de un bloque de instrucciones, se usa mucho en programación modular cuando
se quiere retornar un resultado, se usará más adelante.
Por ejemplo, se tiene una función que divide un número entre 4 y se ha creado para obtener resultados. En el
primer caso se le pasa 27 para que lo divida entre 4 pero como no hay return dentro, devuelve “undefined”. No
accede al número porque el número solo vive dentro de la función y no hay nada que dé el valor. Si se le agrega
return, efectivamente se obtiene el resultado de la división.
Figura 21
Sentencia return.
Con return
Sin return
Nota. Tomada de Vedia (2018)
Existen varias técnicas de ordenamiento de vectores las cuales son importantes para realizar búsquedas y, al
igual que en la vida real, es más fácil buscar en un lugar que esté ordenado que en uno que no lo esté, como
JavaScript está diseñado para pequeños algoritmos que resuelven pequeños problemas y convertirlos en
servicios, el uso de esas técnicas no tiene mucha aplicabilidad, pues la diferencia en tiempos computacionales
de ejecución es considerable solo cuando se manejan volúmenes de datos grandes, mientras que para
volúmenes de datos cortos o pequeños los tiempos computacionales no tienen diferencias comparables. Es por
eso que, si en JavaScript el volumen de datos en los arreglos no será grande, no es necesario la aplicación de
esas técnicas.
JavaScript provee un stack de funciones básicas para realizar el ordenamiento y búsqueda que es muy útil para
la implementación de servicios basados en algoritmos.
Se ordenará un vector de mayor a menor valor y de acuerdo con los datos que tiene, se debe tener en cuenta
que el arreglo se modifica al ordenarlo, devolviendo la misma matriz ordenada, pero no una nueva. Esto es
importante, si se quiere mantener inmutable el vector y obtener otro ordenado, lo que se tendría que hacer es
una copia del arreglo antes de ordenarlo.
Por defecto el método Array.sort() ordena los elementos del array como si fueran cadenas inclusive si los datos
son de tipo entero, como en este ejemplo:
Figura 22
Ordenamiento de números como cadenas de texto
Figura 23
Ordenamiento de cadenas de texto
Codificación de algoritmos
El ejemplo de la figura anterior muestra un ordenamiento de cadenas de texto. También podemos ordenar el
arreglo de forma descendente con el método Array.reverse() como se muestra en la figura 24.
Figura 24
Invertir el orden de los elementos
La función Array.reverse() no ordena los elementos, simplemente toma los elementos y les invierte el orden, es
decir, el primero pasa a ser el último, el segundo, el penúltimo y así hasta que el último pasa al primer puesto,
es por esto que primero se ordena en orden ascendente y luego se invierte para lograr el orden descendente.
Como se ve el ordenamiento con la función Array.sort() se hace considerando los elementos del arreglo como
cadenas de texto. Antes de ver cómo se ordenan con datos numéricos se explicará que es una función en
JavaScript.
Las funciones son uno de los bloques de construcción fundamentales en JavaScript. Una función en JavaScript
es similar a un procedimiento o “un conjunto de instrucciones que realiza una tarea o calcula un valor, pero para
que un procedimiento califique como función, debe tomar alguna entrada y devolver una salida donde hay
alguna relación obvia entre la entrada y la salida”. Para usar una función, se debe definir en algún lugar del
ámbito en el que se desea llamarla (MDN, 2021d).
Ejemplo: se quiere construir una función que reciba dos (2) datos numéricos, hay que multiplicar estos dos
números, al resultado se le suma el valor de 100 y, por último, retorna la mitad de este resultado.
Figura 25
Definición de una función
Como se puede observar en la línea 1 de la figura 25, se usa la palabra reservada function y luego se escoge
identificador para la función que el caso es operacion, luego entre paréntesis se seleccionan nombres para las
variables de entrada (en el ejemplo a, y b), a continuación, se define un contexto (espacio de código entre
corchetes) para indicar cuáles son las instrucciones que ejecutará la función. En la línea 2 se muestra que la
función retorna la multiplicación de a * b sumando 100 y a este resultado dividido entre 2. En la línea 4 se ve
como invocamos la función operacion, y le pasamos los parámetros 3 y 8 para las variables a y b
respectivamente, el resultado es almacenado en la variable dato1. Y como se observa la función puede
invocarse más de una vez (las que se necesiten).
Para ordenar un vector con datos numéricos se debe pasar como argumento una función al método
Array.sort(), esta función indica qué operación debe hacerse sobre los datos a comparar entre dos datos del
arreglo. Para comparar si un número es mayor que otros es muy común usar la resta porque si se resta un
número solo existen tres tipos de respuestas. Cuando a un número a le restamos un número b (a - b), si el
resultado es negativo es porque b es mayor que a, si el resultado es positivo porque a es mayor que b si el
resultado es cero solo si a y b son iguales.
Codificación de algoritmos
Figura 26
Ordenamiento de números
Como se puede ver en la figura 26 se pasa una función (sin identificador) que recibe dos datos del arreglo (a y
b) y los compara con la diferencia (resta) de ellos. A las funciones que no se les pone identificador se les llaman
funciones anónimas, también existe otra forma de sintaxis para funciones anónimas, se denomina funciones
flecha. Se verá, con la sintaxis de función flecha, cómo ordenar un arreglo número de manera inversa en la
figura 27.
Figura 27
Ordenamiento inverso de números
La figura 27 muestra cómo no se usa la palabra reservada function, tampoco se usan la identificación de
contexto (corchetes) porque la función tiene una sola línea y se reemplaza por el operador =>. Y por defecto se
retorna el resultado de la operación b – a, que es la diferencia de los dos números, pero en el otro orden (este
orden de la operación es el que determina si el ordenamiento es de mayor a menor o viceversa).
C. Ordenamiento de registros
Suponiendo que se tienen los registros de la tabla, se desea ordenarlos de mayor edad a menor edad.
Codificación de algoritmos
Tabla 8
Registros a ordenar
Usuario Edad Rol
Mariela 31 SAC
Eduardo 30 CEO
Andrés 34 Project
Manager
Figura 28
Ordenamiento de registros
Codificación de algoritmos
En esta oportunidad en la figura 28 se muestra en las líneas 6 y 8, que se puede usar contexto (corchetes) a
pesar de que dentro solo hay una sentencia (línea 7), el resultado a retornar es la diferencia entre b.edad y
a.edad para que el ordenamiento sea de mayor a menor.
D. Buscar un elemento
El método find() devuelve el valor del primer elemento del array que cumple la función de prueba proporcionada
(Array.prototype.find() – JavaScript, MDN, 2021).
Figura 29
Buscar un elemento
Como se puede ver en la figura 29, se usa el identificar elemento para referenciar a la variable que se va a
aplicar el criterio que en el ejemplo es encontrar el primer elemento que sea mayor que 10.
Muchas veces es importante que, en lugar de retornar un solo valor, el resultado sea más de uno, por ejemplo,
si en el arreglo de la figura 30, se retornan los valores que son mayores que 10, por lo tanto, debe retornar otro
vector con los valores resultados. Para esto existe la función Array.filter(), que crea un nuevo arreglo con los
datos que cumplan con la condición.
Figura 30
Buscar varios elementos
Codificación de algoritmos
Es de interés notar que la consola solo retornó los datos que cumplen la condición que el elemento es mayor
que 10.
La principal funcionalidad que se requiere en la depuración del código, es la mostrar salidas parciales de datos
de depuración del estado de las variables, o tal vez se tenga la necesidad de mostrar que se está ejecutando
determinada línea de código. Por lo general, la salida de JavaScript está dirigida hacia un navegador o hacia un
flujo de datos de un servidor web, dejando la consola para realizar estas depuraciones.
Hasta ahora se ha usado la consola para mostrar datos de depuración cuando se emplea console.log(), que es
un método usado para mostrar mensajes de confirmación de operaciones o mitificaciones de éxito en las
operaciones del algoritmo. Pero también existen más:
Figura 31
Mensaje de depuración
Codificación de algoritmos
5. Fallas de lógica
Para realizar las depuraciones y correcciones en la lógica, es preciso realizar la ejecución paso a paso de
algunas líneas de código, para poder apreciar los cambios que las variables tienen en el transcurso de la
ejecución. A continuación, se indican algunas instrucciones para realizar una revisión paso a paso, cuando la
depuración se hace desde un navegador web siguiente los siguientes pasos.
A. Chrome DevTools
Se puede ir a las herramientas de desarrollo (DevTools) pulsando "Command+Option+I" en Mac o
"Control+Shift+I" en Windows y Linux para ver el panel de inspección en la parte izquierda de la ventana del
navegador. Al inspeccionar el elemento ofrece diferentes opciones para trabajar.
Aparece varias pestañas las opciones presentes para depuración en Chrome son:
● Console: la consola se utiliza para imprimir registros, muestra errores y advertencias.
● Elements: se pueden seleccionar los elementos para inspeccionar los elementos HTML y hacer
estilos en ellos.
● Sources: permite navegar los archivos que están presentes en la página cargada y se puede elegir
el archivo que se desea consultar.
● Network: empleado para inspeccionar todas las llamadas de red que realizan los clientes al
servidor, como las cabeceras HTTP, el contenido y el tamaño.
Una vez se tiene que ir a la sección del archivo con el código fuente a depurar, se puede navegar a
través de él e identificar la porción de código en la que se sospecha ocurre un error en la lógica.
Figura 32
Seleccionar fuente
Figura 33
Marcar un break point
Figura 34
Ejecución línea a línea
Codificación de algoritmos
Figura 35
Valores de las variables
Las excepciones son errores imprevistos que ocurren en la ejecución de un programa; son anormalidades que
impiden o perturban el comportamiento o el flujo normal de las instrucciones de un programa.
El objetivo principal en el manejo de errores es separar el código de la lógica del programa, del código de
manejo de excepciones: de esta forma, al producirse la anomalía, si ocurre un error y existe un manejador de
excepciones, él toma el control de la ejecución del programa.
Codificación de algoritmos
En JavaScript, el control de errores resulta muy necesario tal vez más que en otros lenguajes debido a la
dificultad natural de este para testear aplicaciones o los cambios de versión de intérprete en múltiples
navegadores.
La forma más sencilla de disparar un error es con la palabra reservada throw, este comando permite enviar al
intérprete de JavaScript el evento de que ha ocurrido un error, generalmente permite enviar cualquier tipo de
dato, pero lo más común que envíe un “Error” como se muestra en la siguiente figura.
Figura 36
Lanzar una excepción
throw new Error( "No se puede dividir por cero" );
Existe un tipo de estructura de control en JavaScript que está pendiente de revisar en el flujo de ejecución de un
programa para detectar comportamientos inesperados, la estructura es try … catch que consta de un bloque
que intenta la ejecución de una sesión de código (contexto), a la espera de que pueda ocurrir una posible
excepción. Finalizado el contexto existe otro denominado catch que tiene un argumento o variable de contexto,
donde se captura el elemento disparado.
Figura 37
Bloque de captura de excepción
En la figura 37 se muestra un algoritmo que divide dos números y, como se sabe, en este proceso se debe
validar que no exista una división por 0 al no estar definida aritméticamente.
Codificación de algoritmos
Para eso existe el contexto try que va desde la línea 4 a la línea 10, y dentro de él se verifica el caso que el
divisor si es igual a 0 debe disparar una excepción. Ella es capturada en la línea 10 por el contexto catch en la
variable e, de esta forma, el contexto de catch de la línea 10 a la 13 maneja la excepción, mostrando un
mensaje de error y volviendo la variable resultada a nulo. Así, la excepción es lanzada y capturada y el
programa no es interrumpido abruptamente, sino que es controlado a pesar de los problemas que se puedan
presentar.