title: Variable ++ not working
body: <p>Ok, so I have this game and I want the high score to be updated, but whenever I set my currentScore value of ++, it doesn't increment.  I don't know what is happening, and I am sure it is an easy fix, if anyone could help me it would be greatly appreciated.  The problem is on line 212. I am truly trying to fix this, and I would like to be able to have a quick and easy fix to implement, so that I can go back to designing my website.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
    &lt;/head&gt;
    &lt;body onload ="checkScore"&gt;
            &lt;script&gt;
                
            &lt;/script&gt;
              &lt;p&gt;&lt;span style="color:red"&gt;Your&lt;/span&gt; &lt;span style="color:orange"&gt;current&lt;/span&gt; &lt;span style="color:gold"&gt;High&lt;/span&gt; &lt;span style="color:green"&gt;Score&lt;/span&gt; &lt;span style="color:blue"&gt;is:&lt;/span&gt;
              &lt;span id="SCORES" style="color:purple"&gt;0&lt;/span&gt;
              &lt;input id="currentScore" value="0"&gt; 
     &lt;script&gt;
      var cookie;
  
                function setCookie(cname,cvalue,exdays) {
                    var d = new Date();
                    d.setTime(d.getTime() + (exdays*365*7*24*60*60*1000));
                    var expires = "expires=" + d.toGMTString();
                    cookie = encodeURI(cname + "=" + cvalue + ";" + expires + ";path=/");
                }
  
                function getCookie(cname) {
                    var name = cname + "=";
                    var decodedCookie = decodeURIComponent(cookie);
                    var ca = decodedCookie.split(';');
                    for(var i = 0; i &lt; ca.length; i++) {
                        var c = ca[i];
                        while (c.charAt(0) == ' ') {
                            c = c.substring(1);
                        }
                        if (c.indexOf(name) == 0) {
                            return c.substring(name.length, c.length);
                        }
                    }
                    return "";
                }
  
                function checkScore() {
                  // get current score
                  let currentScore = document.getElementById('currentScore').value;
  
                  //get high score from the "cookie"
                  let highScore = getCookie('highscore');
  
                  // if current score is bigger then high score - set new high score and update cookie
                  if (highScore &lt; currentScore) {
                    highScore = currentScore;
                    setCookie("highscore", highScore, 365);
                  }
  
                  // update DOM
                  document.getElementById("SCORES").innerHTML = highScore;
                }
  
                // set inital cookie for this example to work
                setCookie("highscore", 0, 365);
      
      
      
      
      
      
      
      
      
      
      
      
     var
     COLS = 26,
     ROWS = 26,
     EMPTY = 0,
     SNAKE = 1,
     FRUIT = 2,
     LEFT  = 0,
     UP    = 1,
     RIGHT = 2,
     DOWN  = 3,
     KEY_LEFT  = 65,
     KEY_UP    = 87,
     KEY_RIGHT = 68,
     KEY_DOWN  = 83,
  
     canvas,
     ctx,
     keystate,
     frames,
     score;
      currentScore;
     grid = {
      width: null,
      height: null,
      _grid: null,
      init: function(d, c, r) {
       this.width = c;
       this.height = r;
       this._grid = [];
       for (var x=0; x &lt; c; x++) {
        this._grid.push([]);
        for (var y=0; y &lt; r; y++) {
         this._grid[x].push(d);
        }
       }
      },
      set: function(val, x, y) {
       this._grid[x][y] = val;
      },
      get: function(x, y) {
       return this._grid[x][y];
      }
     }
     snake = {
      direction: null,
      last: null,
      _queue: null,
      init: function(d, x, y) {
       this.direction = d;
       this._queue = [];
       this.insert(x, y);
      },
      insert: function(x, y) {
       this._queue.unshift({x:x, y:y});
       this.last = this._queue[0];
      },
      remove: function() {
       return this._queue.pop();
      }
     };
     function setFood() {
      var empty = [];
      for (var x=0; x &lt; grid.width; x++) {
       for (var y=0; y &lt; grid.height; y++) {
        if (grid.get(x, y) === EMPTY) {
         empty.push({x:x, y:y});
        }
       }
      }
      var randpos = empty[Math.round(Math.random()*(empty.length - 1))];
      grid.set(FRUIT, randpos.x, randpos.y);
     }
     function main() {
      canvas = document.createElement("canvas");
      canvas.width = COLS*20;
      canvas.height = ROWS*20;
      ctx = canvas.getContext("2d");
      document.body.appendChild(canvas);
      ctx.font = "18px Helvetica";
      frames = 0;
      keystate = {};
      document.addEventListener("keydown", function(evt) {
       keystate[evt.keyCode] = true;
      });
      document.addEventListener("keyup", function(evt) {
       delete keystate[evt.keyCode];
      });
      init();
      loop();
     }
     function init() {
      score = 0;
          currentScore = 0;
      grid.init(EMPTY, COLS, ROWS);
      var sp = {x:Math.floor(COLS/2), y:ROWS-1};
      snake.init(UP, sp.x, sp.y);
      grid.set(SNAKE, sp.x, sp.y);
      setFood();
     }
     function loop() {
      update();
      draw();
      window.requestAnimationFrame(loop, canvas);
     }
     function update() {
      frames++;
      if (keystate[KEY_LEFT] &amp;&amp; snake.direction !== RIGHT) {
       snake.direction = LEFT;
      }
      if (keystate[KEY_UP] &amp;&amp; snake.direction !== DOWN) {
       snake.direction = UP;
      }
      if (keystate[KEY_RIGHT] &amp;&amp; snake.direction !== LEFT) {
       snake.direction = RIGHT;
      }
      if (keystate[KEY_DOWN] &amp;&amp; snake.direction !== UP) {
       snake.direction = DOWN;
      }
      if (frames%5 === 0) {
       var nx = snake.last.x;
       var ny = snake.last.y;
       switch (snake.direction) {
        case LEFT:
         nx--;
         break;
        case UP:
         ny--;
         break;
        case RIGHT:
         nx++;
         break;
        case DOWN:
         ny++;
         break;
       }
       if (0 &gt; nx || nx &gt; grid.width-1  ||
        0 &gt; ny || ny &gt; grid.height-1 ||
        grid.get(nx, ny) === SNAKE
       ) {
        return init();
       }
       if (grid.get(nx, ny) === FRUIT) {
        score++;
            currentScore++;
            checkScore();
        setFood();
       } else {
        var tail = snake.remove();
        grid.set(EMPTY, tail.x, tail.y);
       }
       grid.set(SNAKE, nx, ny);
       snake.insert(nx, ny);
      }
     }
     function draw() {
      var tw = canvas.width/grid.width;
      var th = canvas.height/grid.height;
      for (var x=0; x &lt; grid.width; x++) {
       for (var y=0; y &lt; grid.height; y++) {
        switch (grid.get(x, y)) {
         case EMPTY:
          ctx.fillStyle = "#000";
          break;
         case SNAKE:
          ctx.fillStyle = "#4aa024";
          break;
         case FRUIT:
          ctx.fillStyle = "#f00";
          break;
        }
        ctx.fillRect(x*tw, y*th, tw, th);
       }
      }
      ctx.fillStyle = "#49c2ff";
      ctx.fillText("SCORE: " + score, 10, canvas.height-10);
     }
     main();
     &lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>