Diagrama de Flujo del Cajero Automático

📌 Un diagrama de flujo nos permite hacer una representación de los pasos que debe seguir nuestro algoritmo.

Traté de hacerlo por mi cuenta con los conocimientos que ya tenía, me salió un código mucho más largo y tardé dos días, pero funciona 😄 . . .

a alguien le pasa que entienden todo eso, pero no tienen aun la capacidad de poder hacer este analisis por su propia cuenta? a mi me pasa

Este video es un gran ejemplo del concepto que hemos seguramente escuchado muchas veces. “Programar no es solo aprender código, es aprender a pensar”.

Tuve que ver el vídeo 23 veces para entender,ami no me gusta copiar a mi me gusta entender para poder saber hacerlo por mi cuenta.Ya que no tiene sentido ver si no aprendes

Iterar es la acción de Repetir algo usualmente referido a bucles, es decir mas de una vez, aunque también es usada como un objeto en sí, La Iteración , El bucle.

Ejemplos:

• Tú iteras (Tu repites).
• Yo itero (Yo repito).
• Nosotros iteramos (Nosotros repetimos).

Espero sea útil 😃.

• Freddy explicando el diagrama de flujo *
  Mi cerebro:
  En este mundo se consume el dinero
  El dinero es dinero
  Aprende algo dinero

me explotó el cerebro

Mi Cajerito

Mis cariños a Freddy y a todo el equipo Platzi por despertar mi interés por la programación. Si no fuera por este man no se dónde estaría en este momento ❤️

¿nadie penso en raptor?

En este diagrama agrego algunas condiciones al terminar el ciclo For para confirmar si es posible o no entregar el dinero y en caso de ser posible descontar lo que se entregara de la cantidad inicial.

En ocasiones pensamos mucho en el problema tratandolo de resolver con codigo sin darnos cuenta que nuestro cerebro lo resuelve en segundos, buen consejo.

Excelente clase, les tengo un aporte para los que se sientan más avanzados: el algoritmo realmente no minimiza siempre la cantidad de billetes, supongamos que en el país Platziland existen solo billetes de $100, $80 y $10. Si se quieren retirar $160 como se hace en la clase, se sacaría un billete de $100 y luego 6 billetes de $10, en total 7 billetes, pero la cantidad mínima de billetes es 2, 2 billetes de $80. ¿Cómo se resuelve? Bueno, los animo a estudiar sobre programación dinámica uno de los contenidos que más me ha gustado para implementar en algoritmos de este estilo.
Saludos 😃

Extensión para Visual Studio Code, para diseñar diagramas de flujo Draw.io_Integration

como se aprende a tomar los grandes problemas y convertirlos en pequeños? me cuesta mucho si quiera empezar a ver los problemas y estructurarlos :C

Creo que una de las cosas que mas me cuesta es precisamente dividir todas esos problemas en partes mas sencillas pero viendo este video (aprox 3 veces) uno se va dando una idea de como es que deberiamos acercanos a ciertas situaciones, gracias

digamos que entendí

Solo tengo para decir que planteas todo de la forma mas facil y lógica con mucha simpleza. Me encanta!

INTERESANTE LA CLASE PERO UN POCO COMPLICADA JAAJ

Para los nuevos estudiantes (como yo), aqui les dejo un link donde pueden encontrar las imagenes de dolares para juegos del gobierno americano.

Este algoritmo pretende entregar el menor numero de billetes. Esta solución al empezar con el billete de mayor denominación es un algoritmo voraz o greedy. La mejor forma de resolverlo es con programación dinámica para entregar el menor un numero de billetes.
Ejemplo:
Supongamos que tenemos billetes de 10, 40 y 60. Y el usuario quiere sacar 80.
La solución voraz (ir por el billete mayor) seria: 60 + 10 +10 (3 billetes)
La mejor solución seria: 40 + 40 (2 billetes)

Nosotros tratando de entender lo que dice Freddy:

Necesito clases de matemáticas.

Faltaría que actualice la cantidad de billetes, luego de haber realizado una operación(sera el reto?)

Este curso de introducción va Genial! cuando aprendí fundamentos en el colegio no me dieron ni la mitad de esto!

Apuntes de la clase.

Apuntes de clase:
algoritmo: Conjunto de instrucciones realizadas en orden para solucionar un problema.
Diagrama de flujo:Un diagrama de flujo es un diagrama que describe un proceso, sistema o algoritmo informático. Se usan ampliamente en numerosos campos para documentar, estudiar, planificar, mejorar y comunicar procesos que suelen ser complejos en diagramas claros y fáciles de comprender.
Para saber mas sobre diagramas de flujo vease:
https://www.lucidchart.com/pages/es/que-es-un-diagrama-de-flujo
Pagina que permite crear diagramas de flujo de forma ilimitada:
https://www.draw.io

Los diagrama de flujo son realmente importantes y debo reconocer que al verlos por primera vez en la universidad me dije que ladilla esta vaina, pero si son importante incluso para la documentación de un sistema ya desarrollado y terminado. Amo la informática y la tecnología por ende todo a su alrededor como programar pero, si es difícil por suerte estamos en una época maravillosa donde existen herramientas o plataformas de aprendizaje como _Platzi _ para; Nunca parar de aprender que son incluso superior al sistema educativo tradicional, que ya debe evolucionar y dejar de exprimir el bolsillo de la población con sus matriculas de estudio. Saludos desde Venezuela Grande @freddier

Si tengo esta caja:
50: 1
20: 6
10: 0
Y el usuario pide 120, debería poder entregarle los 6 billetes de 20, pero en el algoritmo desarrollado, le entregaría el de 50, luego le restaría entregar 70 que no pueden ser formados por los 6 billetes de 20. Entonces le diríamos que no puede entregar 120 cuando sí era posible.
Saludos,
Leandro.

Freedy explicando el algoritmo:

Disculpa, pero CREO que tu algoritmo tiene un error:
Supongamos que tengo 5 billetes de 100, 5 billetes de 50 y 5 billetes de 20.
Al cajero le piden para retirar 210$
Según tu algoritmo, planearía gastar 2 billetes de 100 y luego se encontraría sin el dinero necesario para pagar exacto.
Sin embargo, si se pagaba 1 billete de 100, 1 de 50 y 3 de 20, llegaba a la cantidad exacta.

Si me equivoqué en algo al entender el algoritmo, por favor avísenme

@freddier muy buena explicación del algoritmo.
Solo como complemento, ya que no leí que apareciera en los comentarios ni lo escuché en el video, este algoritmo tiene nombre: greedy algorithm o en español algoritmo avaro.
Para los demás colegas, este es un ejemplo de lo @freddier menciona en otros videos, leer libros. Este algoritmo se explica en casi todos los libros de análisis de algoritmos o de estructuras de datos asi como otros con los cuales resolver distintos problemas y como me enseñaron en la universidad, no existe un único algoritmo para resolver un problema, existen algoritmos más eficientes que otros. En este caso este algoritmo se corresponde al algoritmo más eficiente para entregar el monto requerido con la menor cantidad billetes.

Fredy he seguido al pie de la letra todos los temas y ya entiendo mejor como trabaja Javascript. Sus explicaciones son muy claras. Los ejercicios por usted explicados todos hasta esta lección los he codificado con VS Code. Seguire su recomendacion para tomar desarrollo web, responsive design y javascript.

Mi forma de **No abandonar **una clase que dura más de 20 minutos es lo que Freddy dice “convierte grandes problemas en problemas pequeños”

En este caso la clase dura 30 minutos

1. Divide la clase en metas de 10 minutos con descansos de 5 a 15 minutos
2. Repetir ese ciclo hasta finalizar el video
3. Si aun no entiendo vuelvo a repetir el proceso
4. Hacer anotaciones
   A mi me funciona para** NO llegar a la frustración,** recuerda ir con calma, mas vale entender el paso a paso a irte rápido y perderte en el proceso, después ya puedes hacer tus anotaciones pero con un mejor resumen el cual le puedas entender mucho mejor
   Espero también les funcione, solo comparto mi método.

Esa capacidad de Freddy solo la obtienes practicando. No hay otra forma. 😄 VAMOS CON TODA!

Aquí es donde el café se vuelve agua al consumir tanta teoría y no tratar de dormirse en el intento :c

sin duda freddi es el mejor profesor del mundo mundial.

Recomiendo @diagrams.net, muy bueno para hacer distintos tipos de diagramas, y es gratis.

He aplicado mi propia solución. Las varialbes y funciones en inlges, si estoy usando mal los términos mi avisan para corregir. Gracias

class BankNote {
  constructor(n, v, a) {
    this.name = n;
    this.value = v;
    this.quantity = a;
  }

  editQuantity(q)
  {
    this.quantity -= q;
  }

  enoughBankMoney(a)
  {
    var a_m = this.value * this.quantity;
    if(a>a_m)
    {
      return true;
    }
    else {
      return false;
    }
  }
}


var amount = document.getElementById("text_amount");
var enter_cta = document.getElementById("button_enter");
enter_cta.addEventListener("click", accountMoney);
var bills = [];
bills.push(new BankNote("USD 50", 50, 5));
bills.push(new BankNote("USD 20", 20, 8));
bills.push(new BankNote("USD 10", 10, 10));


function accountMoney()
{
  var result;

  //es numero?
  //Si isNaN es true será letras, si es false es numero
  if(isNaN(text_amount.value))
  {
    result = "Enter only number";
  }
  // es divisible en 10?
  else if(text_amount.value % 10 != 0)
  {
    result = "Pleese enter amount in multiples of $10";
  }
  //hay dinero suficiente?
  else if(availableMoney() < text_amount.value)
  {
    result = "Sorry, I don´t have enough money";
  }
  else
  {
    result = "Please, withdrawal the next money";
    result += deliveryBills(text_amount.value);
    console.log(result);
  }
  document.getElementById("mostrador").innerHTML = " <br/>" + result;
}


//hay dinero suficiente?
function availableMoney()
{
  var a_m = 0;
  for(var i of bills){
    a_m += i.quantity * i.value;
  }
  return a_m;
}

var withDrawal = [];

//cant de billetes
function deliveryBills(amount)
{
  var result="";
  var value_tmp = amount;
  for (var i of bills)
  {
    var t_b = Math.floor(value_tmp / i.value);
    if(i.quantity > t_b)
    {
      i.quantity -= t_b;
      i.editQuantity(t_b);
      result += "<br/>Bills of "+ i.value + ": " + t_b;

    }
    else
    {
      t_b = i.quantity;
      i.editQuantity(t_b);
      result += "<br/> Bills of "+ i.value + ": " + t_b;
    }
    value_tmp -= (i.value * t_b);
  }
  return result;
}

Creo que pondría primero un condicional de que si la cantidad solicitada por el usuario ES MENOR O IGUAL a la que hay disponible…

Divide y vencerás! 😄

Aqui esta como lo hice yo!
![](

var usuario = prompt("Cual es tu nombre?");
var disponibleCaja;
var billetes = {b50:0,b20:0,b10:0}
var retirado = 0;

//Llenado de billetes
billetes.b50 = aleatorio(100);
billetes.b20 = aleatorio(100);
billetes.b10 = aleatorio(100);
disponibleCaja= billetes.b20*20+billetes.b50*50+billetes.b10*10;

var can = document.getElementById("htmlCanvas");
var lienzo = can.getContext("2d");
document.addEventListener("keyup",retirarEnt)
function retirarEnt(evento)
{
    if (evento.keyCode == 13)
    retirar()
}
var botonRetirar = document.getElementById("boton");
botonRetirar.addEventListener("click",retirar);
var dineroRetirar,sobrante;
var billetesUsados50 = 0;
var billetesUsados20 = 0;
var billetesUsados10 = 0;
function retirar()
{
    dineroRetirar = parseInt((document.getElementById("texto")).value);
    sobrante = dineroRetirar;
    if (dineroRetirar%10 != 0)
    {
        alert("Ingrese multiplos de 10")
    }
    else if(dineroRetirar>disponibleCaja)
    {
        alert("No se puede realizar el movimiento por falta de fondo")
    }
    else{
        while (billetes.b50>0 && sobrante>=50)
        {
            sobrante = sobrante-50;
            billetes.b50--;
            billetesUsados50++;
        }
        while (billetes.b20>0 && sobrante>=20)
        {
            sobrante = sobrante-20;
            billetes.b20--;
            billetesUsados20++;
        }
        while (billetes.b10>0 && sobrante>=10)
        {
            sobrante = sobrante-10;
            billetes.b10--;
            billetesUsados10++;
        }
        


        retirado = retirado+(billetesUsados10*10+billetesUsados20*20+billetesUsados50*50);
        disponibleCaja= billetes.b20*20+billetes.b50*50+billetes.b10*10;
        actualizar();
        alert("El cajero le da: $"+(billetesUsados10*10+billetesUsados20*20+billetesUsados50*50)+"\nB50: " +billetesUsados50+"\nB20: " +billetesUsados20+"\nB10: "+billetesUsados10);
        billetesUsados10 = 0;
        billetesUsados20 = 0;
        billetesUsados50 = 0;
        sobrante = 0;
        console.log("otra");
    }
}



actualizar();
//Refrescar todo


function actualizar()
{
    lienzo.reset();
    lienzo.font = "50px Haettenschweiler";
    lienzo.fillText("Hola "+ usuario, 320, 50);
    lienzo.fillText("Billetes 50:  "+ billetes.b50, 300, 150);
    lienzo.fillText("Billetes 20:  "+ billetes.b20, 300, 200);
    lienzo.fillText("Billetes  10:  "+ billetes.b10, 300, 250);
    lienzo.fillText("Disponible :  "+ disponibleCaja, 50, 450);
    lienzo.fillText("Total Retirado:  "+ retirado, 450, 450);
}

function aleatorio(max)
{
    let x = parseInt((max+1) * Math.random())
    return x;
}

Cuando no me sale el código :v

Hola, antes de ver el video quise hacerlo yo mismo. Ojo, he hecho un poco de trampa porque tengo conocimientos de programación. Les paso mi código:
1.- Cajero.html

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Cajero Automático</title>
  </head>
  <body>
      <center>
      <h1>Cajero Automático</h1>
      <h5>El cajero sólo entrega billetes de 10, 20 y 50 USD</h5>
      <h5>Importe máximo a retirar es de 3,000 USD</h5>
      </center>

      <p>Ingrese la cantidad que desee retirar: </p>
      <input type="input" id="txt_importe"/>
      <input type="button" id="btn_retirar" value="Retirar">
    <script src="billete.js">
    </script>
    <script src="cajero.js">

    </script>
  </body>
</html>

2.- Cajero.js

var importe_retiro = document.getElementById("txt_importe");
var boton_retiro = document.getElementById("btn_retirar");
boton_retiro.addEventListener("click",retiro);

function retiro()
{
  var importe = parseInt(importe_retiro.value);

  // Importe a evaluar
  if (importe >0)
  {
    // Importe dentro del límite
    if (importe <=3000)
    {
      billete50 = new Billete("Billete de 50 USR.",50,10);
      billete20 = new Billete("Billete de 20 USR.",20,10);
      billete10 = new Billete("Billete de 10 USR.",10,10);
      // Importe puede ser atendido en su totalidad con los billetes ofrecidos. Para ello debe ser divisible entre 50, 20 o 10.
      if ((importe%billete50.getValor()==0)||(importe%billete20.getValor()==0)||(importe%billete10.getValor()==0))
      {
        console.log("Importe: "+importe+" USD");
        qBillete50=billete50.contarBilletes(importe);
        importe-=qBillete50*billete50.getValor();
        qBillete20=billete20.contarBilletes(importe);
        importe-=qBillete20*billete20.getValor();
        qBillete10=billete10.contarBilletes(importe);
        importe-=qBillete10*billete10.getValor();
        // Hay billetes para atender
        if (importe==0)
        {
          //
          console.log("------------------------------------------------------------------");
          console.log(qBillete50+" billetes de "+billete50.getValor()+" USD.");
          console.log(qBillete20+" billetes de "+billete20.getValor()+" USD.");
          console.log(qBillete10+" billetes de "+billete10.getValor()+" USD.");
          console.log("------------------------------------------------------------------");
        }
        // No hay billetes para atender
        else {
          alert("Lamentablemente no tenemos suficientes billetes para atender la cantidad solicitada.");
        }
      }
      // Cantidad no puede ser atendida en su totalidad.
      else {
        alert("Cantidad no puede ser atendida.");
      }
    }
    // Importe fuera del límite
    else
    {
      alert("¿Sabe usted leer? El importe máximo a sacar es de 3,000 USD.");
    }
  }
  // Importe absurdo
  else
  {
    alert("¡No seas cacaseno! ¡Cómo vas a sacar "+importe+" USD!");
  }
}

3.- Billete.js

class Billete
{
  constructor(n, v, c)
  {
    this.nombre=n;
    this.valor = v;
    this.cantidad_max=c;
  }
  getNombre()
  {
    return this.nombre;
  }
  getValor()
  {
    return this.valor;
  }
  getCantidad()
  {
    return this.cantidad_max;
  }

  reducirCantidad(q)
  {
    this.cantidad_max-=q;
    if (q>=0)
    {
      return true;
    }
    else
    {
      this.cantidad_max+=q;
      return false;
    }
  }
  contarBilletes(importe)
  {
    var q_billetes = Math.trunc(importe/this.getValor());
    if (q_billetes<=this.getCantidad())
    {
      return q_billetes;
    }
    else {
      return this.getCantidad();
    }
  }
}

Excelente explicacion, mire el video 2 veces para entender mejor…Saludos Platzi

Listas, arrays y arreglos son lo mismo, para los confundidos como yo. Me tomó mucho entenderlo jajaja

Y luego dicen que los programadores cobran mucho por nada jajajaj

Como avisa Freddy el ejemplo es difícil. Me ha costado entenderlo, he tenido que revisar el video.
Lo primero es entender cómo es el funcionamiento, que va del 00:00 al 10:00. Una vez comprendemos eso ya podemos seguir con lo demás.

Casos difíciles suelen desanimar, a mi me pasa, pero es en ese momento donde no hay que rendirse y volver a revisar el caso y comprenderlo. Da igual cuánto tiempo tome el comprenderlo, lo importante es aprender, no ir rápido porque sí.

¡Ánimo! 😄

Viendo el video dos veces, sentí que me “explotó” el cerebro. Pero es excelente el énfasis en que se debe tener una idea mental del funcionamiento para poder estructurar el código de manera adecuada. Muy buena explicación.

Concuerdo con [email protected] demás compañ[email protected] en la idea de realizar el ejercicio antes de ver el vídeo, para encontrar las diferentes soluciones al problema planteado y en caso de no hallar ninguna solución pues ver el vídeo, tratar de entender y realizar el ejercicio como Freddy lo elabora.

les recomiendo a todo el mundo que antes de empezar a ver el video traten de hacer el ejercicio por ustedes mismos, hay que romperse la cabeza para ver de que forma lo podemos hacer por nosotros mismos y después ver como lo hace freddy y ver como se realiza ( en el caso de que no hayamos podido hacer) y si no, ver otra forma que seguramente sera mas eficiente(y esto lo digo porque como el sabe mas que nosotros normalmente sabrá una manera de hacerlo mejor)

La cara de Freddy al no saber si era Multiplicacion o Resta, y queda por pequenios instantes en shock … ahahaha
Lo amo …
Gracias por tan exelente CURSO!!

00:40 Análisis del problema
04:40 Análisis matemático
13:35 Diagrama de flujo
21:20 Pruebas de escritorio

Ahora entiendo porque en Guate los cajeros solo dan billetes de 100 quetzales. Programadores arañas 😄

Este algoritmo funciona para casi todos los casos. Al principio Freddy dijo que servía para cualquier numeración de billetes, pero no es así, ya que si por ejemplo tenemos que formar el 6 con billetes de 4, 3, 1 este algoritmo nos daría uno de 4 y dos de 1 mientras que la solución óptima es dos de 3. En nuestro mundo tenemos una numeración bonita para que cuando usemos este algoritmo funcione perfectamente. De todos modos si quieren saber la solución para este problema se llama “El problema de la moneda” o “Coin problem”.
Otro inconveniente es la cantidad de billetes, aunque tengamos la numeración oficial que nos permite usar el algoritmo falla si necesitamos $110 y tenemos dos de $50, tres de $20 y ninguno de $10 porque el cajero se clavaría con dos de 50 y al final no sabría qué hacer mientras que con uno de $50 y tres de $20 anda bien. Si quieren saber cómo se llama este problema es “El problema de la mochila” o “Knapsack problem”.
Ambos problemas son de programación dinámica así que si recién están empezando a programar no recomiendo buscarlos o al menos no con el fin de aprenderlos porque puede reventar la cabeza jajaja yo tarde mis años programando para entenderlos.

😮 Wao!! al principio cuando estaba haciendo el mapa conceptual no lo comprendí al 100%, pero cuando fue por los ejemplos capte mucho mejor la idea. 😃 Se imaginan lo complejo que es pedirle a una maquina que mueva cierta palanca, para que le de al cliente la cantidad de dinero, que el pidió, Esto de verdad me emociona mucho!! 😄

Cómo subo una imagen a la sección de los comentarios?

Mi ejercicio:

Aquí online: https://weoka.github.io/ATM/cajero.html
Y aquí las tripas: https://github.com/weoka/ATM

Muy interesante

Un buen sitio web para hacer diagramas de flujo organizados es https://app.diagrams.net/

min 8:45 “un billete de 20 y dos de 50, me dan 90” ¡¡¡ ayyy Freddy! !!

viendo video x tercera vez …GOGOGOGO

Creo que lo fácil es aprender el lenguaje y a utilizar los símbolos de que esto significa esto y lo otro lo otro, lo realmente importante esta en resolver problemas utilizando la lógica matemática.

Fredy es el mejor profesor que yo e tenido
sus clases son super atendibles XD

Excelente Ejercicio

Buena Freedy

Analizar el problema, pensar cómo resolverlo, dividirlo en partes pequeñas y hacer el diagrama es fundamental para resolverlo.

Que hermoso es aprender 😊

genial

wow, interesantes matematicas ._.

Más volumen en los vídeos.

me voy a pedir trabajo a un banco

Comparto mi archivo HTML con script de JS de un cajero que permite deposito, retiro y consulta. En el console,log se puede ver el consumo de los billetes y cuantos quedan. Pero no sé mantener los datos en el navegador para el momento de reiniciar el programa (que no se borren)… 😉 SALUDOS https://drive.google.com/open?id=1B410KTpoUD-8K7rIcdtITn5z-b-8TDtR

Al algoritmo le falto verificar si el numero es multiplo de 10 y actualizar la cantidad de billetes.

Para los primero, se puede cambiar el segundo paso dinero > 0 por dinero % 10 == 0, con eso se verifica que los valores sean múltiplo de 10 (10, 20, 30 …) y no (13, 27, 45 …)

Para lo segundo, se puede agregar una nueva sentencia luego del paso 5, así: b.cantidad -= papeles
Con eso se actualiza la cantidad de billetes que van quedando.

Les paso una versión un poco más elemental.

class CajeroAutomatico{

    constructor()
    {
        this.cantidadBilletes = {
            1000:   0,
            500:    0,
            200:    0,
            100:    0,
            50:     0,
            20:     0,
            10:     0,
            5:      0,
            2:      0
        }
    }

    calculoBilletes(dinero)
    {
        var j = 0;
        var factor = 0;
        var billetes = [1000, 500, 200, 100, 50, 20, 10, 5, 2];

        var valorBillete = 0;
        var cadena = "";

        for(j=0; j<9; j++){

            valorBillete = billetes[j];

            factor = parseInt(dinero / valorBillete); 

            if(factor >= 1){

                dinero = dinero - valorBillete * factor;
            }

            else{}
            
            cadena = valorBillete.toString();
            this.cantidadBilletes[cadena] = this.cantidadBilletes[cadena] - factor;

            document.write("<br/> "+ cadena + " = " + factor);
        }
    }  

    dineroRestante()
    {
        console.log("Dinero Restante: ", this.cantidadBilletes);
    }
}


var cajero_1 = new CajeroAutomatico();

cajero_1.cantidadBilletes["1000"]   = 50;
cajero_1.cantidadBilletes["500"]    = 50;
cajero_1.cantidadBilletes["200"]    = 50;
cajero_1.cantidadBilletes["100"]    = 50;
cajero_1.cantidadBilletes["50"]     = 50;
cajero_1.cantidadBilletes["20"]     = 50;
cajero_1.cantidadBilletes["10"]     = 50;
cajero_1.cantidadBilletes["5"]      = 50;
cajero_1.cantidadBilletes["2"]      = 50;

cajero_1.calculoBilletes(560);
cajero_1.dineroRestante();

class Billete
{
  constructor(v, c)
  {
    this.valor = v;
    this.cantidad = c;
  }
}

function entregarDinero()
{
  var t = document.getElementById("dinero");
  dinero = parseInt(t.value);
  for(var bi of caja)
  {

    if(dinero > 0)
    {
      div = Math.floor(dinero / bi.valor);

      if(div > bi.cantidad)
      {
        papeles = bi.cantidad;
      }
      else
      {
        papeles = div;
      }

      entregado.push( new Billete(bi.valor, papeles) );
      dinero = dinero - (bi.valor * papeles);
    }

  }

  if(dinero > 0)
  {
    resultado.innerHTML = "Soy un cajero malo, he sido malo y no puedo darte esa cantidad :(";
  }
  else
  {
    for(var e of entregado)
    {
      if(e.cantidad > 0)
      {
              resultado.innerHTML += e.cantidad + " billetes de $" + e.valor + "<br />";
      }
    }
  }
}

var caja = [];
var entregado = [];
caja.push( new Billete(100, 5) );
caja.push( new Billete(50, 10) );
caja.push( new Billete(20, 5) );
caja.push( new Billete(10, 10) );
caja.push( new Billete(5, 5) );
var dinero = 0;
var div = 0;
var papeles = 0;

var resultado = document.getElementById("resultado");
var b = document.getElementById("extraer");
b.addEventListener("click", entregarDinero);```

Los diagramas de flujo son la representación gráfica de un algoritmo o proceso, ideales para entender todo mejor en programación ❤️

Ayuda bastante el diagrama.

Muy buena esta clase.

Comento que la salida de NO en el primer IF cuando dinero < 0; ésta debe ir después del ciclo ya que en el lugar donde está, el ciclo se repite infinitamente convirtiendose en un loop.

En el colegio nos enseñaron flujogramas, mapas comceptuales, todos esos graficos con lineas y flechas. Siempre me pregunte para que serviria eso… muchas gracias profes…

Me encantó! mas aún haber disminuido la velocidad del video al final y ver a Freddy como si estuviera pasado de copas jajaja. Preparada para el siguiente video!!

Intenté hacer la lógica antes de ver el diagrama de flujo y me quedo algo asi:

En el HTML incluí una caja de texto para recibir la cantidad que el usuario quiere retirar y un botón para realizar el cálculo de los billetes. Además de que como podrán ver, intenté manejar clases, funciones y el programa principal en archivos .js diferentes.

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Cajero Automatico</title>
  </head>
  <body>
    <p>¿Que cantidad desea retirar?</p>
    <input type="text" id="txtRetiro" />
    <input type="button" id="btnRetiro" value="Retirar">
    <script src="clases.js" charset="utf-8"></script>
    <script src="funciones.js" charset="utf-8"></script>
    <script src="cajero.js" charset="utf-8"></script>
  </body>
</html>

Construí una clase billete con 3 atributos, valor, cantidad y una variable de control a la que llamé “isDone”, con la cual verifico a la hora de hacer el cálculo si una denominación de billete ya ha sido considerada para el cálculo necesario. El atributo valor lo uso para la formula que da freddie, y el atributo cantidad para mantener un control de cuantos billetes quedan y cuantos han sido usados.

class Billete
{
  constructor(v,c)
  {
    this.valor = v;
    this.cantidad = c;
    this.isDone = false;
  }
}

En el archivo principal de javascript declaré un arreglo “caja” en donde “pushee” las instancias de la clase billete que quise agregar al programa (las funciones consideran que puede haber mas denominaciones y funcionan con la cantidad que quieran). Después de eso obtuve los elementos del HTML por medio del getElementById, declaré la variable maxDem para mantener un control en las iteraciones de mi algoritmo de cual es la denominación actual, y una variable cadena para guardar el mensaje de salida final después de hacer el cálculo. Para finalizar agregué un event Handler al botón para comenzar el cálculo.

var caja = [];
caja.push(new Billete(20,1));
caja.push(new Billete(50,3));
caja.push(new Billete(10,2));

var txtRetiro = document.getElementById("txtRetiro");
var btnRetiro = document.getElementById("btnRetiro");
var maxDenom = 0;
var cadena = "";

btnRetiro.addEventListener("click", calculaBilletes);

La función “calculaBilletes” se auxilia de dos funciones, “maxDenominacion” que calcula la maxima denominación en la iteración actual del algoritmo y retorna su valor como un entero. Así como la función “Iteración”, cuya lógica es la siguiente:

1. Se reciben los parámetros c y m, que son la abstracción de la cantidad que se desea retirar, y la denominación máxima actual respectivamente.
2. Se declaran variables de transición para c y m, así como una variable “billetes” que servirá para la formula que usa freddie, que determina la cantidad de billetes de cierta denominación que pueden usarse para cubrir una cantidad, y la variable “total” que es usada solo en caso de que un billete no alcance para cubrir el máximo posible de billetes (ejemplo: se solicitan 40 para retirar, pero el cajero solo tiene 1 billete de 20, por lo cual se deberá dar 1 de 20 y 2 de 10).
3. Se inicia un for para cada elemento del arreglo caja, utilizando “in” para poder usar el índice de los objetos del arreglo.
4. Se verifica que el status del elemento actual “isDone” sea falso, para confirmar que la denominación que se está iterando, no haya sido ya calculada.
5. Se verifica que el valor del objeto que se está iterando, sea mayor que el máximo actual, debido a que la formula contempla que se empiece desde la denominación de billete más alta, y el programa en su totalidad está hecho para que no importe el orden en que se agregan instancias del objeto “Billete” con nuevas denominaciones (ejemplo: en el arreglo puede ir primero el objeto billete de 10, luego el billete de 50, luego el billete de 20, y aun así comenzar el cálculo con el billete de más alta denominación, y aplica para cuantas denominaciones quieras contemplar).
6. Se realiza la formula con la función Math.floor() para ignorar los decimales y quedarnos con la parte en entera, que se almacena en “billetes”
7. Se verifica que el atributo “cantidad” del objeto actual sea mayor o igual a la cantidad de billetes necesarios, en caso de que así sea, se calcula la nueva cantidad a cubrir y se almacena, se cambia el status del objeto a “true” para confirmar que ya se ha calculado por completo y que no sea considerado en la función que determina la máxima denominación, se resta la cantidad de billetes utilizados al atributo “cantidad” pensando en mejorar el programa más adelante y poder hacer multiples requests, y finalmente se concatena el mensaje en la variable cadena.
8. En caso de que lo anterior no se cumpla, se pasa a un else if cuya condición verifica si la variable de control “total” es diferente de la cantidad de retiro solicitada, si esto se cumple: se realizan los mismos pasos que el punto anterior, considerando solo la cantidad disponible de billetes que tiene la denominación que está siendo iterada, y se asigna el nuevo valor a la cantidad requerida, dependiendo de cuanto logró cubrirse del monto total (como en el caso de que solicite 40 y solo exista un billete de 20, entonces solo se cubre la mitad y sigue siendo necesario cubrir otros 20 con una denominación menor)
9. En caso de que ninguna condición se cumpla, se guarda en la cadena de salida el mensaje “No hay billetes suficientes”, ya que cuando ninguna de estás condiciones se cumplan en todas las iteraciones que se realizan, es porque no se logró cubrir el monto total requerido.
10. La función regresa el valor “can” como la cantidad que hace falta cubrir después de realizar la iteración actual.

function calculaBilletes()
{
  var cantidadRetiro = parseInt(txtRetiro.value);
  for(e in caja)
  {
    maxDenom = maxDenominacion();
    cantidadRetiro = iteracion(cantidadRetiro, maxDenom);
  }
  document.write(cadena);
}

function maxDenominacion()
{
  var m = 0;
  for(e of caja)
  {
    if(e.valor > m && e.isDone != true)
    {
      m = e.valor;
    }
  }
  return m;
}

function iteracion(c,m)
{
  var billetes;
  var can = c;
  var max = m;
  var total = 0;

  for(e in caja)
  {
    if(!caja[e].isDone)
    {
      if(caja[e].valor >= max)
      {
          billetes = Math.floor(can / max);
          if(caja[e].cantidad >= billetes)
          {
            can = can - (billetes * max);
            caja[e].isDone = true;
            caja[e].cantidad = caja[e].cantidad - billetes;
            cadena += "Billetes de " + max + ": " + billetes + ".<br />";
          }
          else if(total != can)
          {
            total = caja[e].cantidad * max;
            can = can - (caja[e].cantidad * max);
            cadena += "Billetes de " + max + ": " + caja[e].cantidad + ".<br />";
            caja[e].cantidad = 0;
            caja[e].isDone = true;
          }
          else
          {
            cadena = "No hay dinero suficiente en el cajero";
          }
      }
    }
  }
  return can;
}

Pueden realizar pruebas para verificar, modificando el arreglos “caja”. Se que tal vez el código no es optimo, pero traté de usar todos los elementos vistos en clases anteriores, solo me faltó usar algo de canvas pero ya es algo tarde y me cansé. Espero que les sirva 😃

Sin duda alguna tendré que repetir varias veces esta clase.

Media hora para explicar algo que en teoría parece sencillo, pero con el nivel de detalle que Freddy nos da resulta más sencillo de entender tanto el diagrama de flujo como el funcionamiento del algoritmo, gracias por tomarte el tiempo para explicar esto de esta manera.

Me aventuré a resolverlo antes que freddy hiciera el diagrama de flujo,
tuve en cuenta que el dinero que hay en el cajero alcanzara para entregar el monto que el usuario solicita y que el monto fuera un multiplo de 10

class Billete
{
    constructor(valor, cantidad)
    {
      this.valor = valor;
      this.cantidad = cantidad;
    }
}

var caja = new Array();
caja.push(new Billete(100, 10));
caja.push(new Billete(50, 10));
caja.push(new Billete(20, 8));
caja.push(new Billete(10, 7));


function sacarDinero(monto)
{
  var cantidadBilletes = 0;
  var terminaCiclo = false;

  //Verifico que el monto sea un multiplo de 10
  if (monto%10 != 0)
  {
    console.log("la cantidad no es un multiplo de 10!");
  }
  else
  {
    //Verifico que no se este recorriendo el arreglo de nuevo
    while (monto > 0 && !terminaCiclo) {
        for (b of caja)
        {
          cantidadBilletes = Math.floor(monto / b.valor);
          //Si existe la cantidad de billetes en el cajero, la entrego
          if (cantidadBilletes <= b.cantidad)
          {
            console.log(cantidadBilletes + " billetes de " + b.valor);
            monto = monto - (cantidadBilletes * b.valor);
          }
          else
          {
            //Sino, entrego la cantidad que haya
            console.log(b.cantidad + " billetes de " + b.valor);
            monto = monto - (b.cantidad * b.valor);
          }
        }
        terminaCiclo = true;
        if (monto > 0)
        {
          console.log("===No alcanzó el dinero!===");
        }else
        {
          console.log("===Proceso Terminado!===");
        }
    }
  }

La manera de explicar de Freddy es muy buena, facil, logica y lo mejor no provoca la perdida de interes sobre el tema tratado.
Gracias…

Si no me equivoco, el diagrama de flujo está mal, ya que lleva a un loop infinito. Cuando dinero > 0 se cumple, en lugar de reiniciar el ciclo como se hace en el diagrama, deberíamos finalizarlo.

the classes are amazing

buena explicación

Solo vi hasta el minuto 5, a ver que tan diferente queda mi codigo de el profe Freddy.

HTML:

<<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>BankOfAmerica</title>

</head>
<body>
    <h1>Bank Of America</h1>
   <h2> ¿Cuanto dinero quieres retirar?<br> </h2>
    <input type="text" id="texto_lineas" />
    <input type="button" value="A darle!" id="botoncito"/> <br />
<h3> Contamos con denominacion de: 10,20 y 50. <hr /> </h3>
<script src="banco.js"></script>
</body>
</html>> 

JAVASCRIPT

<var texto = document.getElementById("texto_lineas");
var boton = document.getElementById("botoncito");
function getRandomInt (min,max)
{
    var resultado;
    resultado = Math.floor(Math.random() * (max - min + 1)) + min;
    return resultado;
}
var billetes =
 {diez : getRandomInt(5,10),
 veinte : getRandomInt(3,10),
 cincuenta : getRandomInt(3,10)
}
var SaldoMaximo = (billetes.diez * 10) + (billetes.veinte * 20) + (billetes.cincuenta * 50);

document.write("<br />Saldo Maximo: " + SaldoMaximo);
document.write("<br /> Contamos con denominacion de: <br />(" + billetes.diez + ") billetes de 10, (" + billetes.veinte + ") billetes de 20 y (" + billetes.cincuenta + ") billetes de 50.");
//650 saldo maximo
//420 retirocantidad
boton = addEventListener("click",retiroPorClick);
function retiroPorClick(e)
 {
    var retiroCantidad = parseInt(texto.value);
    if(retiroCantidad<=0 || retiroCantidad > SaldoMaximo)
    {
    alert("No es posible retirar esa suma.")
    }
    else if (retiroCantidad%10 == 0 || retiroCantidad%20 == 0 || retiroCantidad%50 == 0 )
    {

       var cantidadCincuenta =Math.floor(retiroCantidad/50);
       if (cantidadCincuenta > billetes.cincuenta)
       {
           cantidadCincuenta = billetes.cincuenta;
       }
       var cantidadVeinte =Math.floor((retiroCantidad - (cantidadCincuenta * 50) ) /20);
       if (cantidadVeinte> billetes.veinte)
       {
          cantidadVeinte = billetes.veinte;
       }
       var cantidadDiez = Math.floor((retiroCantidad - ((cantidadVeinte * 20) + (cantidadCincuenta * 50)))/10);
      if (cantidadDiez>billetes.diez)
      {
          cantidadDiez = billetes.diez;
      }
       var nuevoSaldo = SaldoMaximo - retiroCantidad;
        document.write("<br />Saldo Anterior: " + SaldoMaximo);
        document.write("<br /> Retiraste la cantidad de: $" + retiroCantidad);
        document.write("<br /> Tu nuevo saldo es de: " + nuevoSaldo + "<br />");
        document.write(" Se te entregaran " +cantidadCincuenta + " billetes de 50, " + cantidadVeinte + " billetes de 20, " + cantidadDiez + " billetes de 10.")
    

    }
    else {
    alert("No es posible retirar esa suma.") 
    }
    
  
 }


> 

no entiendo nada

Estuve como una semana intentando comprender esto, hasta que lo logré!

No saben la satisfacción que da después de entender todo.

hasta ahora descubri que no tienes que ir a chrome y abrir la consola en el mismo editor de codigo puedes habrir la consola con los comando que dijo freddy con ctrl + shift + i

Estoy super motivado con lo que estoy aprendiendo y tomarme la libertad de volver a ver las clases cuantas veces sea necesario hasta dominar lo aprendido es genial ! Gracias equipo de platzi !