Cuarto Proyecto: Pakimanes

En las entrevistas hacen muchas preguntas. Varias de estas incluyen y requieren conocer conceptos como lo es el módulo. Este es el residuo de una division. Por ejemplo, si dividimos 7 entre 3 (de manera entera, esto significa que no miramos la parte decimal, solo trabajamos con los números Enteros), el resultado nos da 2, ya que el 3 solo cabe 2 veces en el 7. y el residuo es 1 que es lo que sobra. Ese 1 es el resultado del módulo entre 7 y 3. Aunque parezca un concepto "que no tiene valor", es muy común su uso en la programación.

Por ejemplo, este se usa para saber si un número es par o impar, ya que si un numero lo dividimos entre 2 y el residuo es 0, entonces es par, de lo contrario es impar.

El módulo lo expresamos con el simbolo de porcentaje %. Entonces, si excribimos algo así: 8%5, queremos conocer el modulo (o residuo de la división) de 8 entre 5 (8/5).

Un ejercicio que preguntan en las entrevistas es imprimir los primeros 100 numeros pero cuando el número es divisible entre 3 en su lugar colocamos FIZZ. Además, si el número es divisible por 5 colocamos BUZZ. Y si es divisible tanto por 3 como por 5 colocamos FIZZBUZZ en su lugar. Aquí, es donde entra en juego el modulo. Vamos a ver como sería la solución.

<aside> 🎣 El && significa AND (y) en JavaScript. Es un operador lógico.

</aside>

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>FIZZBUZZ - Dame un empleo</title>
</head>
<body>
  <script src="fizz.js"></script>
</body>
</html>

var numeros = 100;
var msg;
for(var i = 1 ; i<=100 ; i++){
  if( i % 3 == 0 && i % 5 == 0){
    msg = "FIZZBUZZ";
  }else if(i % 3 == 0){
    msg = "FIZZ";
  }else if(i % 5 == 0){
    msg = "BUZZ";
  }else{
    msg = i;
  }
document.write(msg + "<br>");
}

Ahora, realizamos un proyecto para aprender conceptos como lo son los Arreglos, Clases, Constructor y for especial (tanto el in como el of)

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <h1>Pakimanes que he atrapado</h1>
  <script src="pakiman.js"></script>
  <script src="paki.js"></script>
</body>
</html>

var imagenes = [];

imagenes["Cauchin"]= "vaca.png";
imagenes["Pokacho"]= "pollo.png";
imagenes["Tocinauro"]= "cerdo.png";

var coleccion = [];
coleccion.push( new Pakiman("Cauchin", 100, 30) );
coleccion.push( new Pakiman("Pokacho", 80, 50) );
coleccion.push( new Pakiman("Tocinauro", 120, 40) );

for(var p in coleccion){
  coleccion[p].mostrar();
}

for(var p of coleccion){
  p.mostrar();
}

//Algo curioso es que al ejecutar los dos tipos de for al tiempo, no se porqué la imagen se buguea y en lugar de mostrar todo dos veces bien, primero muestra sin la imagen y luego con la imagen. Supongo que será problema de JavaScript o no se. Ahí, dejo la imagen.

class Pakiman{
  constructor(n, v, a){
    this.imagen = new Image();
    this.nombre = n;
    this.vida = v;
    this.ataque = a;
    this.imagen.src = imagenes[this.nombre];
  }

  hablar(){
    alert(this.nombre);
  }

  mostrar(){
    document.body.appendChild(this.imagen);
    document.write("<br/><strong>"+ this.nombre +"</strong><br/>");
    document.write("Vida: "+ this.vida +"<br/>");
    document.write("Ataque: "+ this.vida +"<hr>");
  }
}