title: Uncaught TypeError: juego is not a constructor
body: <p>At first it gave me that error then what I did was put only <code>game = new game</code>, and the code was executed normally, then when the game ends wanting to start it again this gave me that error again and I do not know how to solve it.</p>
  
  <p>I do not understand if you are supposed to declare the game variable and even try to put <code>var game = new game ( )</code> but nothing happens.</p>
  
  <pre><code>2VM16862 
      cod.js:127 Uncaught TypeError: juego is not a constructor
      at comienzaJ (VM16862 cod.js:127)
      at HTMLButtonElement.onclick (index.html:24)
      comienzaJ @ VM16862 cod.js:127
      onclick @ index.html:24
  </code></pre>
  
  <p>my javascript:</p>
  
  <pre><code>const celeste = document.getElementById('celeste')
  const rojo = document.getElementById('rojo')
  const verde = document.getElementById('verde')
  const amarillo = document.getElementById('amarillo')
  const btn = document.getElementById('btnEmpezar')
  const Ultnivel = 1
  class juego {
      constructor(){
          this.iniciar = this.iniciar.bind(this)
          this.iniciar()
          this.genSec()
          this.nextL()
      }
      iniciar(){
          this.selectC = this.selectC.bind(this)
          this.toggleBtn()
          this.nivel = 1
          this.colores = {
              celeste,
              rojo,
              verde,
              amarillo
          }
      }
      toggleBtn(){
          if(btn.classList.contains('ocult')){
              btn.classList.remove('ocult')
          } else {
          btn.classList.add('ocult')
          }
      }
      genSec(){
          this.secuencia = new Array(Ultnivel).fill(0).map( n =&gt; Math.floor(Math.random()*4))
      }
      nextL(){
          this.Subnivel = 0 
          this.iluminarS()
          this.addEvclick()
      }
      transFnumC(numero){
          switch (numero){
              case 0:
                  return'celeste'
              case 1:
                  return'rojo'
              case 2:
                  return 'verde'
              case 3:
                  return 'amarillo'
          }
      }
      transFColorN(color){
          switch (color){
              case 'celeste':
                  return 0
              case 'rojo':
                  return 1
              case 'verde':
                  return 2
              case 'amarillo':
                  return 3
          }
      }
      iluminarS(){
          for (let i = 0; i &lt; this.nivel;i++){
              const color = this.transFnumC(this.secuencia[i])
              setTimeout(()=&gt;this.iluminarC(color),1000 * i)
          }
      }
      iluminarC(color){
          this.colores[color].classList.add('lig')
          setTimeout(()=&gt; this.apagarC(color),350)
      }
      apagarC(color){
          this.colores[color].classList.remove('lig')
      }
      addEvclick(){
          this.colores.celeste.addEventListener('click',this.selectC)
          this.colores.rojo.addEventListener('click',this.selectC)
          this.colores.verde.addEventListener('click',this.selectC)
          this.colores.amarillo.addEventListener('click',this.selectC)
      }
  
      elimC(){    
          this.colores.celeste.removeEventListener('click',this.selectC)
          this.colores.rojo.removeEventListener('click',this.selectC)
          this.colores.verde.removeEventListener('click',this.selectC)
          this.colores.amarillo.removeEventListener('click',this.selectC)    
      }
  
      selectC(ev){
          const nombreC = ev.target.dataset.color
          const numeroC = this.transFColorN(nombreC)
          this.iluminarC(nombreC)
          if (numeroC=== this.secuencia[this.Subnivel]){
              this.Subnivel++
              if (this.Subnivel===this.nivel){
                  this.nivel++
                  this.elimC()
                  if (this.nivel=== (Ultnivel+1)){
                      this.win()
                  } else{
                      setTimeout(this.nextL.bind(this),1500)
                  }
              }
          }else{
              this.gameO()
          }
      }
      win(){
          swal('J99','FELICITACIONES GANASTE','success')
          .then(()=&gt;{
              this.elimC()
              this.iniciar()
          })
      }
      gameO(){
          swal('J99','OW PERDISTE :C','error')
          .then(()=&gt;{
              this.elimC()
              this.iniciar()
          })
      }
  }
  function comienzaJ() {
    juego = new juego()  
  }
  </code></pre>
  
  <p>And html:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
      &lt;title&gt;MI SIMON&lt;/title&gt;
      &lt;link rel="stylesheet" href="css/estil.css"&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;section class="sim_cont"&gt;
      &lt;div class="simon"&gt;
          &lt;div id="celeste" class="bt celeste L" data-color="celeste"&gt;
  
          &lt;/div&gt;
          &lt;div id="rojo" class="bt rojo R" data-color="rojo"&gt;
  
          &lt;/div&gt;
          &lt;div id="verde" class="bt verde L" data-color="verde"&gt;
  
          &lt;/div&gt;
          &lt;div id="amarillo" class="bt amarillo R" data-color="amarillo"&gt;
  
          &lt;/div&gt;    
          &lt;button id="btnEmpezar" class="btn_start" onclick= "comienzaJ()" &gt;COMENCEMOS!!!&lt;/button&gt;
      &lt;/div&gt;
  &lt;/section&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.2/sweetalert.min.js"&gt;&lt;/script&gt;
  &lt;script src="js/cod.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>And my css:</p>
  
  <pre><code>body{
      overflow: hidden;
  }
  .btn_start{
      position: fixed;
      text-align: center;
      top: 50%;
      left: 50%;
      z-index: 2;
      /* transform: translate(-50%, -50%); */
  }
  .sim_cont{
      margin: 0;
      background: #dedede;
      display: flex;
      align-items: center;
      height: 100vh;
  }
  .simon{
      height: 100vh;
      width: 100vh;
      border-radius: 50%;
      overflow: hidden;
      margin: 0 auto;
      max-height: 60vh;
      max-width: 60vh;
  }
      .bt {
      background: blue;
      width: 50%;
      height: 50%;
      display: inline-block;
      }
      .L{
          float: left;
      }
      .R{
          float: right;
      }
      .celeste{
          background: rgb(0, 0, 182);
      }
  
      .rojo {
          background: rgb(199, 1, 1);
      }
      .verde {
          background: green;
      }
  
      .amarillo {
          background: rgb(207, 207, 0);
      }
  .btn_start{
          width: 400px;
          height: 100px;
          background: #ecf0f1;
          color: #2c3e50;
          font-size: 2.5rem;
          position: absolute;
          top: calc(50% - 50px);
          left: calc(50% - 200px);
  }
  
  .ocult{
      display: none;
  }
  .celeste.lig{
      background: rgb(17, 0, 255);
  }
  
  .rojo.lig {
      background: rgb(255, 9, 9);
  }
  .verde.lig {
      background: rgb(58, 248, 58);
  }
  
  .amarillo.lig {
      background: rgb(255, 255, 3);
  }
  </code></pre>