Programando en JavaScript

Clase 36 de 47 • Curso Básico de Algoritmos y Pensamiento Lógico

Carlos Eduardo Gomez García

teacher•

¡No te rindas!

Aquí ya empezamos a tocar código puro y duro (y de hecho fue una introducción un poco... hardcore... jaja) mi mejor consejo para ti son estos: .

Razona: trata de entender qué hace cada línea, si no puedes apoyate de un diagrama de flujo, pero trata de entender bien qué sucede.
Debuguea: Recuerda que usar las instrucciones para imprimir en pantalla te pueden ayudar ver cómo los programas se comportan en cierto punto.
Busca la documentación: Recuerda siempre buscar documentación, léela y mira cómo funciona cada cosa que usas

. Por ejemplo, en este caso, ¿por qué me imprimer 8? No lo sé, pero puedo usar debugging:

function secondLargestNumber(numbers) {
  console.log(numbers);
  numbers.sort();
  console.log(numbers);
  numbers.reverse();
  console.log(numbers);
  return numbers[1];
}

Aquí puedes ver cómo use debugging para ver qué valores contenía mi elemento numbers después de cada acción. . Después de esto me doy cuenta de que contiene estos valores, el primer par de corchetes es a como mis valores llegan, el segundo par es después del método sort y el tercer par es después del método reverse: .

. Uhmm interesante, ¿por qué el método sort me está ordenando los valores de esa manera? 🤔 ¡No tiene ningún sentido! ¡Vamos a buscar la documentación! (hay varias páginas donde puedes documentarte, yo te dejo esta, aunque en archivos de la clase hay otra): . https://www.w3schools.com/jsref/jsref_sort.asp . Leyendo veo el método sort() ordena todo como si fueran strings, y en un string, "4" es mayor que "20", ¿Por qué? porque estamos comparando strings, no números. De hecho un string podría decirse que compara el primer caracter, por lo que 4 es mayor que 2. . Ahora, si miro más abajo veo que ellos ya me proponen un algoritmo donde puedo ordenar los números directamente de forma descendiente, ya ni si quiera necesito el método reverse! Así que puedo usarlo, este algoritmo tiene su explicación, pero por ahora quédate con que te va a ordenar los números de mayor a menor:

function secondLargestNumber(numbers) {

    numbers.sort( function(a, b){
        return b-a
    } );

    return numbers[1];
  
}

let nums = [8, 4, 6, 10, 9, 11, 20];
console.log(secondLargestNumber(nums))

¡Y listo!, mi programa ya funciona, problema solucionado! . Así es como tienen que empezsar a pensar para resolver problemas, y el debugging y la documentación serán sus mejores herramientas, ¡no se rindan!

Jorge Bernal

student•

wow

Luis Angel Pasos Montalvo

student•

Que buen aporte bro :') muy claro explicando los problemas con los que nos podemos encontrar y como solucionarlos, mil gracias.

De igual forma si estuviera empezando de cero no sabría ni donde empezar a escribir el código, ni como ejecutarlo para hacer el debuggin etc. si fue un poco hardcore el ejemplo.

MAXIMO DARIL MESARES SOLANO

student•

Al inicio no entendí muy bien así que decidí hacerlo en papel para comprenderlo mejor.

como vemos en la imagen de arriba numbs es el array y la i es el espacio que ocupa cada número como lo dijeron en clases anteriores en los arrays la primera posición es el 0. Como vemos en esta línea for (let i=0; i < numbers.length; i++), nos indica que el número de iteraciones que tendremos será 6 porque numbers.length es la cantidad de elementos que tenemos en nuestro array que es 6 y después de cada iteración se le sumara uno a i para la siguiente iteración hasta llegar a i = 5.

Como podemos ver en la imagen de arriba no se cumple ninguna de las condiciones, así que first y second se mantienen igual; el único que se modificaría seria i al que se le sumaría 1.

En la imagen de arriba se ve la segunda iteración donde i = 1 y numbers[1]=4, se ve que si cumple la segunda condición y second toma el valor de 4 y este se mantendrá para la siguiente iteración como lo veremos en la siguiente imagen.

como podemos ver en la imagen de la cuarta iteración se cumple la primera condición y second toma el valor de 8 y firts el valor de 10; la segunda condición no se cumple. Para la quinta iteración i = 4.

en la sexta iteración firts = 11 y second = 10 y nos retornaria el valor de second que es 10. Ya no se podria hacer una séptima iteración porque no cumpliría con la condición del for que i < 6, ya que para la séptima iteración el valor de i sería 6.

Grace Linda Romero Arancibia

student•

excelente aporte! gracias, me ayudaste a recordar y entender mejor !!

Juan Antonio Galdo Ustares

student•

Mil gracias por la explicacion, estaba un poco confundido pero es nomas ser ordenado a cada iteracion, gracias!

Katerin Calderón

student•

Yo hice antes de este curso el de Programación Básica que da Freddy que de hecho es gratis y explica muy bien Javascript, luego de ese puedes seguir con los cursos definitivos y es el curso si quieres ser desarrollador web Fronted como yo :) Te lo recomiendo mucho, en esta clase la verdad si no hubiera hecho ese curso hubiera quedado un poco asustada con el lenguaje

Juan Gui Arenas

student•

El curso de Javascript basico :D Explica muy bien los temas quedan aqui vacios o se ven un poco complejos al principio

Federico Gómez

student•

necesito hacer ese curso ! gracias Katerin

Jesus Sebastian Ayala Mendez

student•

Al principio no entendi . . . . . . . . . . . . . . al final después de revisar todo paso por paso y con los conocimientos técnicos de los cursos anteriores.

tampoco entendí nada

Jeffer Steven Nuñez Aragon

student•

Hahahaha yo tamboco lo entendi asi que lo deje pero al siguien dia los lei varias veces hasta que SI! lo entendi. :D

Laidon Manolo Ayala Dominguez

student•

hahaha estamos igual

David Castro

student•

¡hasta aquí llegue! esta señora se salta por completo la curva de aprendizaje. vamos en la parte 36 sin tan siquiera usar, o tan siquiera explicar Node.js y pega un salto olímpico a escribir código. no critico lo de escribir código, pero debió introducir esto bastante atrás. parece que le toco pisar el acelerador a mitad de curso.

lo único bueno era encontrar en este curso cursos alternativos de fundamentos así al menos enterarme de algo, por que los demás instructores no trabajan asi, hacen cosas como poner ejemplos concretos de lo que esta explicando no solo información teórica. porque en todo lo que duro la parte de diagrama de flujo el único ejemplo practico fue el de Pokémon, y fue un video de Freddy.

si no es por la comunidad, ya hace mucho dejo tirado esto. ¡¿como es posible que usuarios expliquen mejor que la que se supone esta dictando el curso?!

me salto este curso, voy a seguir con el curso de Freddy de programación básica y los que le siguen.

Edudardo Lara

student•

Yo igual estoy sorprendido con eso, entiendo más con los comentarios de la comunidad que con la instructora. La metodología de este curso es mala, los ejemplos no son prácticos y el ejercicio de esta clase no es básico. Concuerdo contigo que el video de pokemon fue un buen ejemplo, para mí fue el más fácil de entender, así deberían explicar la lógica de los problemas en este curso.

César Andre Porras Ccente

student•

Como asi?, en la ruta de desarrollo web esta primero el curso básico de programación de Fredy, luego esta este curso. 🤔🤔

Fernando Fabricio Feijoo Feijoo

student•

Me quede... ... ... Pero si yo aún no sé programar en js... Bueno de momento lo voy viendo. Toca verlo más adelante y ahí ya tendrá más sentido esto de seguro.

Laidon Manolo Ayala Dominguez

student•

yo estoy igual y me frustra yo no se porque ponen ejemplos tan complejos

Tomás Felipe Beltrán Pulido

student•

Recomiendo que hagan antes el curso gratis de programación básica que este. Les será más claro así ;)

Alexis Eduardo Mora Gonzalez

student•

Creo que entre a a la clase equivocada. apenas me estoy familiarizando con lo conceptos básico y salen con este ejemplo.

Pedro Hernandez

student•

Te recomiendo el programación estructurada, con ese curso aclararas mas conceptos.

Laidon Manolo Ayala Dominguez

student•

literal apenas conozco este mundo y esta clase la saca del estadio

Jenifer Zamudio

student•

No me gusto esta parte, en mi caso estoy desde cero en la programación, no explicaron bien como descargar, como escribir, indicaron todo como si personas como yo supiéramos, pienso que la idea de estos cursos es explicar un poco mas a detalle

Aldo Miguel Ortiz Parodi

student•

¡Hola! Esta ha sido una introducción un tanto fuerte porque mezcla conociemiento de algoritmos con uso del lenguaje y funciones propias de arrays. En todo caso, te sugiero iniciar con el curso de programación Básica que dicta Fredy, es súper entretenido y verás que paso a paso desde 0 vas haciendo cosas geniales: https://platzi.com/clases/programacion-basica/

Laidon Manolo Ayala Dominguez

student•

concuerdo contigo me parece una burla este curso

Usuario anónimo

user•

🐱‍💻 Interesante como podemos optimizar el código cuando conocemos las funciones que tiene el lenguaje de programación.

function secondLargestNumber(numbers){
  numbers.sort();
  numbers.reverse();
  return numbers[1];
}

let nums = [8, 4, 6, 10, 9, 11, 20];
console.log(secondLargestNumber(nums));

Jorge Cruz Perez

student•

Mas claro, pero optimizado es reducir el numero de operaciones, con sort estas ordenando todo el arreglo y con reverse lo inviertes, en ese sentido es mas tardado ergo, menos optimo, saludos :)

Juan Castro

teacher•

Esta solución es más corta. ¡Super! Pero debemos probar nuestros algoritmos más de una vez para evaluar distintos casos de uso.

En este caso, por ejemplo, la función se rompe cuando tenemos números repetidos.

La profesora explica un poco más las limitantes de esta nueva solución en la siguiente lectura: https://platzi.com/clases/2218-pensamiento-logico/37427-introduccion-al-ejercicio-en-javascript/

Erick Eduardo Díaz Carreón

student•

No entendí nada... :(

SILVIA DANIELA RINCON RINCON

student•

con calma he aprendido que un curso de 2 horas puede convertirse en un dia entero, no te desanimes

Erick Eduardo Díaz Carreón

student•

Gracias :D

Carlos Abel Tarazona Aranda

student•

Me costó entender como corría este código Al visualizar los resultados de cada iteración del ciclo for con el console.log(), se puede comprender mejor el código ñ.ñ

<function secondLargesNumber(numbers)
{
  let first = numbers[0];
  let second = 0;
  for (let i = 0; i < numbers.length; i++)
  {
    if(numbers[i] > first)
    {
      second = first;
      first = numbers[i];
    }
    if(numbers[i] > second && numbers[i] < first)
    {
      second = numbers[i];
    }
    console.log(numbers[i], first, second, );
  }
  return second;
}
let nums = [8, 4, 6, 10, 9, 11];
console.log(secondLargesNumber(nums));>

El resultado de cada iteración que ocurre en el ciclo es el siguiente: . Al iniciar numbers[ 0 ] es: 8, first es: 8 y second es: 0 Luego: numbers[ 1 ] es: 4, first es: 8 y second es: 4 numbers[ 2 ] es: 6, first es: 8 y second es: 6 numbers[ 3 ] es: 10, first es: 10 y second es: 8 numbers[ 4 ] es: 9 first es: 10 y second es: 9 numbers[ 5 ] es: 11, first es: 11 y second es: 10 . finalmente return nos retorna second = 10 . Recuerden que el ciclo ocurre hasta que se cumpla la condición i < numbers.length y numbers.length es igual a 6 porque es la cantidad de números que contiene nuestro arrays nums = [8, 4, 6, 10, 9, 11]. :D

José Iván Ballín González

student•

Excelente explicación, me había costado trabajo entender el código.

Félix Elá Nsí Adá

student•

Wuay! muchas gracias por tu explicacion ha sido expectacular y al final logré entender el ejercicio muy bien. Muchas gracias.

Edudardo Lara

student•

Para los que apenas comienzan en la programación esta clase es demasiado abrumadora. Deberían poner ejemplos más prácticos y sencillos. Veo que la lógica la explicaron en documentaciones pasadas pero eso amerita un video porque para alguien que apenas empieza eso podría ser muy complicado, también veo que muchos se desesperan y se rinden porque la programación es muy difícil, eso se podría solucionar con ejemplos más prácticos y sencillos.

Tomas Bueno

student•

Compañeros como la mayoría de ustedes me abrume al inicio y me tomo mucho comprenderlos pero se los voy a decir de otra manera a ver si lo logran entender como yo lo hice. .

function secondNumber(entradaNumeros){
}

1). Lo que hace ahí es declarar una función como ya nos explicaron en clases anteriores y tambien dice que tiene parametros (entradaNumeros) . . **Recorderis: **Los parametros son como parqueaderos y los argumentos son como el carro que ocuparan ese lugar. En este caso seria nuestro array.

function secondNumber(entradaNumeros){
    let first = entradaNumeros[0];
    let second = 0;
}

2). Aquí declara dos variables de tipo let, el uso de la primera de estas lo dire más adelante. Y la segunda variable la usamos para cuando sea necesario que nos muestre el segundo valor más grande de nuestro arreglo (array).

  function secondNumber(entradaNumeros){
    let first = entradaNumeros[0];
    let second = 0;


    for(let i=0; i < entradaNumeros.length; i++){
        }
    }
}

3). La parte que a más nos confundio, pro aquí va de otra forma. Crea un ciclo de tipo for, el cual como “contador” tiene la variable i y como condicional nos dice que solo se va a cumplir el ciclo mientras que i no sea mayor a la cantidad de números de nuestro array (pues entradaNumeros.length nos permite contar la cantidad de elementos en nuestro arreglo), con la función de que no se haga un bucle infinito y se detenga cuando ya haya analizado todos los valores de nuestro arreglo. Y una vez se haga-complete un ciclo se sume uno a i (i++).

function secondNumber(entradaNumeros){
    let first = entradaNumeros[0];
    let second = 0;

    for(let i=0; i < entradaNumeros.length; i++){
	if(entradaNumeros[i] > first){
            second = first;
            first = entradaNumeros[i];
        }
    }
}

4). El condicional nos dice solo se cumplira si: El valor i del array es mayor a el primer número, entonces este numero se volvera el número más grande del arreglo y el que antes era el primero, ahora será el segundo. Y como el if esta dentro del for, y este esta programado para comprobar todos y cada uno de los valores del arreglo. Lo que hara es comparar cada numero y al final en la variable first quedara el número más grande del arreglo y en la variable second, quedara el segundo valor más grande.

function secondNumber(entradaNumeros){
    let first = entradaNumeros[0];
    let second = 0;

    for(let i=0; i < entradaNumeros.length; i++){
	if(entradaNumeros[i] > first){
            second = first;
            first = entradaNumeros[i];
        }
	if(entradaNumeros[i] > second && EntradaNumeros[i] < first){
		second=entradaNumeros[i];
	}
    }
}

5). Aquí es un caso un poco más difícil de pensar, pero veamos este pequeño array

[8] [4] [6] [11] [9] Ahora vamos a analizarlos uno a uno. . 8 > first? first es en este primer caso es 8, asi que no lo es, son iguales pero no es mayor, por lo que no se cumple y first sigue valiendo 8. . 4 > first? first es en este caso es 8, asi que no lo es, 4 < 8, por lo que no se cumple y first sigue valiendo 8. . 6 > first? first es en este caso es 8, asi que no lo es, 6 < 8, por lo que no se cumple y first sigue valiendo 8. . 11 > first? first es en este caso es 8, asi que si lo es, 8 < 11, por lo que se cumple, con esto first ahora vale 11 y second vale 8. . 9 > first? first es en este caso es 11, así que no lo es, 9 < 11, por lo que no se cumple, con esto first sigue valiendo 11 y second vale 8. . ¿Pero como es posible que el programa nos arroje que el primer valor es 11 y el segundo 8, si también analizo el 9? . Pues para eso está el segundo if, con esto lo que logramos es que si el número que vamos a analizar es menor al primero, pero mayor que el primero. Después este valor se le asigna a la variable second. . . . . . . Se que es un poco extensa pero espero haberles contribuido a entender. Y sean persistentes porque los mejores programadores no se van a formar por hacer el mínimo esfuerzo.

Cristian Mauricio Baron Castiblanco

student•

gracias por este esfuerzo mi bro, guarde tu comentario y me quedo un poco mas claro, espero no rendirme!

Orlando Alfredo Barragan Malaver

student•

Gracias compadre... me sirvio mucho

Johann Sebastian Pérez E

student•

✅La solución a la preguta final: Si hacemos nums.sort() el orden va a quedar: [10, 11, 20, 4, 6, 8, 9] porque sort ordena en forma alfabética. Va primero el 10 que el 2 o el 4 porque empieza por 1. Si hacemos el reverse, el segundo número será 8

Sergio Enrique Maury Benedetti

student•

Osea que hay que volver las variables a texto o enteros?

Juan Carlos Domínguez Pérez

student•

alfabéticamente no. en orden ascendente pero solo toma en cuenta el primer numero.

Raúl Adolfo Sánchez Rodríguez

student•

Comparto el ejercicio explicado paso a paso:

Explicación del algoritmo

Si no entendiste la primera lámina, te invito a ver el desarrollo de un ejercicio:

Boris Stanley Lazo Castillo

student•

Buenisimo Raul, creo que no se podia explicar mejor, me ayudaste mucho a entender la clase, muchas gracias.

Jonathan Reyes López

student•

Muchas gracias por el aporte.

Pablo Andres Vargas Hernandez

student•

🔴 Es inconcebible el cambio, se deberia hacer un acercamiento mas sencillo y facil para familiarizarse con al lenguage JS, . Se paso de la utilizacion de algunos algoritmos en diagramas de flujo a escribir una extensa linea entera de codigo.

Juan David Vanegas Roldán

student•

oigan iba muy bien con el curso hasta este punto. no entendí nada, me desmotive y Platzi no es mentorias. tanto que me inscribí a crehana y estoy impactado de las diferencias que hay, osea si tiene sus ventajas. igual no digo que Platzi sea malo, pero aveces le falta como ser más animado o explicar las cosas mejor. como que asume que uno ya sabe. no se... a Platzi le falta más soporte inmediato y mentorias !

Brayan Enrique De La Hoz

student•

confirmo hay cosas que simplemente las tiran al aire para que se salve quien pueda

Antoni Bassols Lopez

student•

Me veo motivado a ser crítico en mi comentario y en mi opinión con respecto al curso. Es un curso de Pensamiento Lógico y no tiene ninguna lógica cómo está formulado y explicado, ya que saltas de un tema a otro y de repente te escupe un montón de conceptos los cuales nunca has escuchado antes, y finaliza dándote como tarea un reto más elevado a dichos conceptos como si ya fueras experto, lo cuál para alguien que se está iniciando no hace sentido y en vez de aprender es no tener comprensión sobre el funcionamiento del cerebro del ser humano, ya que requiere de un proceso para asimilar lo aprendido antes de su misma comprensión de los nuevos conceptos y todo esto requiere de un proceso que considero debería de ser tenue y calmado. De otra manera es frustrante y no hace sentido hacer un curso con esta dinámica tan poco comprensible. Este curso está bien si lo repites 3 o 4 vezes, lo cuál considero que un curso no debe de hacerse con este fin. Mejor más cantidad de vídeos explicando, con más calma y detenimiento en lo que se explica, que rapidez y todo el contenido apretujado para que quepa en un solo vídeo. De todas formas estoy contento con los conocimientos que se aportan.

JOSE PINTO VEGA

student•

Estoy muy de acuerdo contigo, pienso que en general la manera en la que se ven los temas en este curso, no es la correcta porque se siente uno sin bases y mas que se supone que es un curso de iniciación, siento que es mas como un curso donde te desmotiva y te pone un muro , me recordo a los filtros de universidad.

RICARDO ANDRÉS BUSTAMANTE GUTIÉRREZ

student•

De acuerdo con tu comentario, no entendí nada por la forma en se salto muchos temas esta profesora, fui mejor a tomar otros cursos 'basicos' y luego si entendí esta clase, aunque el código que hace ella es realmente enredado cuando se puede hacer de forma mucho mas simple y como lo explico no se entiende.

Ana Belisa Martinez

teacher•

No olvides tener en cuenta los diferentes casos de uso de tu función:

El array puede tener una longitud variable
Los números pueden repetirse dentro de un array [1, 2, 2, 3, 4, 3]
No siempre lo más obvio es la respuesta, debes probar tu lógica en diferentes escenarios

Cindy Johanna Herrera Parra

student•

Hola profe!

Mira. por alguna razón que desconozco, la función me retorna 0

donde está mi error? :(

Muchas gracias

Jonnathan Alexander Beltrán Aponte

student•

compañeroel codigo esta bien , solo que en el for tienes el .length esta mal no es .lenght, por eso no recorre todo el array y se queda en 0

Joel Josué Rojas Quisbert

student•

El método sort() ordena los elementos de un array localmente y devuelve el mismo array ordenado. El modo de ordenación por defecto responde a la posición del valor del string de acuerdo a su valor Unicode (Es decir ordena alfabéticamente). Ej.

[8, 4, 6, 10, 9, 11, 20] => [10, 11, 20, 4, 6, 8, 9]

La solución a la función seria:

function secondLargestNumber(numbers) {
    numbers.sort(function (a, b) {
        return a - b;
    });
    numbers.reverse();
    return numbers[1];
}

Ricardo Diez

student•

Incluso si se hace de esta forma que colocare a continuación nos ahorrariamos el reverse, pero no entiendo muy bien como es que esto funciona.

function secondLargestNumber(numbers){
  numbers.sort(function(a, b){return b-a});
  return numbers[1];
}