Wie bekomme ich meine Funktion zu erhöhen Variable "_time"

Question

// videogame.js 
// don't forget to validate at jslint.com 

/*jslint devel: true, browser: true */ 
/*global $*/ 

$(function() { 
    "use strict"; 

    // global functions 


    function boundaryCheck(element_selector) { 
     var element = $(element_selector); 
     var universe = $("#universe"); 
     var p = element.position(); 
     if (p.left < 0) { 
      element.css("left", "0px"); 
     } 
     if (p.top < 0) { 
      element.css("top", "0px"); 
     } 
     if (p.left + element.width() > universe.width()) { 
      element.css("left", (universe.width() - element.width()) + "px"); 
     } 
     if (p.top + element.height() > universe.height()) { 
      element.css("top", (universe.height() - element.height()) + "px"); 
     } 
    } 

    function getRandomInt(min, max) { 
     min = Math.ceil(min); 
     max = Math.floor(max); 
     return Math.floor(Math.random() * (max - min)) + min; 
    } 

    // Constructor for Player Ship object 
    function PlayerShip() { 

     var my = {}; 

     $("#universe").append($("<div>").attr("id", "player")); 

     my.navigate = function (keys) { 
      var RIGHTARROW_KEYCODE = 39; 
      var LEFTARROW_KEYCODE = 37; 
      var UPARROW_KEYCODE = 38; 
      var DOWNARROW_KEYCODE = 40; 
      if (keys === RIGHTARROW_KEYCODE) { 
       $("#player").css("left", "+=10px"); 
      } 
      if (keys === LEFTARROW_KEYCODE) { 
       $("#player").css("left", "-=10px"); 
      } 
      if (keys === UPARROW_KEYCODE) { 
       $("#player").css("top", "-=10px"); 
      } 

      if (keys === DOWNARROW_KEYCODE) { 
       $("#player").css("top", "+=10px"); 

      } 
      boundaryCheck("#player"); 
     }; 

     return my; 
    } 

    // Constructor for Enemy Ship object 
    function EnemyShip() { 

     var my = {}; 

     $("#universe").append($("<div>").attr("id", "enemy")); 

     my.move = function (paused) { 
      if (!paused) { 
       var left = Boolean(getRandomInt(0, 2)); 
       var top = Boolean(getRandomInt(0, 2)); 
       if (left) { 
        $("#enemy").css("left", "-=" + getRandomInt(1, 10) + "px"); 
       } else { 
        $("#enemy").css("left", "+=" + getRandomInt(1, 10) + "px"); 
       } 
       if (top) { 
        $("#enemy").css("top", "-=" + getRandomInt(1, 10) + "px"); 
       } else { 
        $("#enemy").css("top", "+=" + getRandomInt(1, 10) + "px"); 
       } 
       boundaryCheck("#enemy"); 
      } 
     }; 

     return my; 
    } 

// this might make an asteroid happen, maybe. I don't know if it will work. 
    function Asteroid() { 

     var my = {}; 

     $("#universe").append($("<div>").attr("id", "asteroid")); 

     my.move = function (paused) { 
     if (!paused) { 
      var left = Boolean(getRandomInt(0, 2)); 
      var top = Boolean(getRandomInt(0, 2)); 
      if (left) { 
       $("#asteroid").css("left", "-=" + getRandomInt(1, 10) + "px"); 
      } else { 
       $("#asteroid").css("left", "+=" + getRandomInt(1, 10) + "px"); 
      } 
      if (top) { 
       $("#asteroid").css("top", "-=" + getRandomInt(1, 10) + "px"); 
      } else { 
       $("#asteroid").css("top", "+=" + getRandomInt(1, 10) + "px"); 
      } 
      boundaryCheck("#asteroid"); 
     } 
     }; 
     return my; 
    } 

    // Constructor for Game object 
    function Game() { 

     // total points 
     var _health = 1000; 

     var _time = 0; 

     // is the game paused? 
     var _game_paused = false; 

     // speed of background animation in ms (larger = slower) 
     var _background_speed = 100; 

     // player ship 
     var _player_ship = new PlayerShip(); 

     // enemy ship 
     var _enemy_ship = new EnemyShip(); 

     var _asteroid = new Asteroid(); //make this an actual thing 

     var my = { 
      health: _health, 
      time: _time, 
      game_paused: _game_paused, 
      background_speed: _background_speed, 
      player_ship: _player_ship, 
      enemy_ship: _enemy_ship, 
      asteroid: _asteroid 
     }; 

     $("#universe").append($("<div>").attr("id", "results")); 
     $("#results").append($("<h1>")); 
     $("#universe").append($("<div>").attr("id", "results2")); 
     $("#results2").append($("<h1>")); 

     my.health = function (value) { 
      if (value === undefined) { 
       return _health; 
      } 
      _health = value; 

      return my; 
     }; 

     my.time = function (value) { 
      if (value === undefined) { 
      return _time; 
      } 
      _time = value; 

      return my; 
     }; 

     my.game_paused = function (value) { 
      if (value === undefined) { 
       return _game_paused; 
      } 
      _game_paused = value; 

      return my; 
     }; 

     my.background_speed = function (value) { 
      if (value === undefined) { 
       return _background_speed; 
      } 
      _background_speed = value; 

      return my; 
     }; 


     my.player_ship = function (value) { 
      if (value === undefined) { 
       return _player_ship; 
      } 
      _player_ship = value; 

      return my; 
     }; 

     function runtimer() { 
      _time++; 
     }; 

     my.enemy_ship = function (value) { 
      if (value === undefined) { 
       return _enemy_ship; 
      } 
      _enemy_ship = value; 

      return my; 
     }; 

     my.asteroid = function (value) { 
      if (value === undefined) { 
      return _asteroid; 
      } 
      _asteroid = value; 

      return my; 
     }; 

     // METHODS 

     // display total points 
     my.displayHealth = function() { 
      $("#results h1").html("Health: " + _health); 
     }; 

     my.increaseTime = function() { 
      setInterval(function(){ runTimer() }, 1000) 
     } 

     my.displayTimer = function() { 
      $("#results2 h1").html("Time: "+ _time); 
     }; 

     my.moveBackground = function() { 
      if (!_game_paused) { 
       var background_position = $("#universe") 
        .css("backgroundPosition") 
        .split(" "); 
       var current_x = parseInt(background_position[0], 10); 
       var current_y = parseInt(background_position[1], 10); 
       var new_x = current_x - 1; 
       var new_y = current_y; 
       $("#universe").css({ 
        "background-position": new_x + "px " + new_y + "px" 
       }); 
      } 
     }; 

     my.checkKeys = function() { 
      var ESCAPE_KEYCODE = 27; 
      $(document).keydown(function (key_event) { 
       if (key_event.which === ESCAPE_KEYCODE) { 
        if (_game_paused) { 
         _game_paused = false; 
         $("#pause").remove(); 
        } else { 
         _game_paused = true; 
         var pause = $("<div>", {id: "pause"}); 
         $("body").prepend(pause); 
        } 
       } else { 
        _player_ship.navigate(key_event.which); 
       } 
      }); 
     }; 

     my.checkCollisions = function (paused) { 
      var p = $("#player"); 
      var e = $("#enemy"); 
      var ppos = p.position(); 
      var epos = e.position(); 
      if (!paused) { 
       if (
        (
         (ppos.left + p.width() < epos.left) || 
         (ppos.left > epos.left + e.width()) 
        ) || 
        (
         (ppos.top + p.height() < epos.top) || 
         (ppos.top > epos.top + e.height()) 
        ) 
       ) { 
        return false; 

       } else { 
        return true; 
       } 

      } 
     }; 


     my.checkAsteroid = function (paused) { 
      var p = $("#player"); 
      var a = $("#asteroid"); 
      var ppos = p.position(); 
      var apos = a.position(); 
      if (!paused) { 
       if (
        (
         (ppos.left + p.width() < apos.left) || 
         (ppos.left > apos.left + a.width()) 
        ) || 
        (
         (ppos.top + p.height() < apos.top) || 
         (ppos.top > apos.top + a.height()) 
        ) 
       ) { 
        return false; 

       } else { 
        return true; 
       } 

      } 
     }; 

     my.play = function() { 
      _enemy_ship.move(_game_paused); 
      _asteroid.move(_game_paused); 
      if (my.checkCollisions(_game_paused)) { 
       _health --; 
       my.displayHealth(); 
      } else if (
      my.checkAsteroid(_game_paused)) { 
       _health --; 
       my.displayHealth(); 
      } 
     }; 
     return my; 
    } 

    var game = new Game(); 

    game.checkKeys(); 
    game.displayHealth(); 
    game.displayTimer(); 
    game.increaseTime(); 
    setInterval(game.moveBackground, game.background_speed); 
    setInterval(game.play, game.background_speed); 
}); 

Ich bin relativ neu in der Programmierung. Ich nahm eine Klasse in der High School, die sehr mittelmäßig war. Ich mache jetzt ein paar Anfängerkurse in der Schule und meine Aufgabe ist es, ein generisches Weltraumspiel zu verbessern (was ich bereits begonnen habe). Ich habe ein div für den Timer, aber aus irgendeinem Grund kann ich keine Funktionen erhalten, um die Variable _time zu erhöhen. Es ist fast so, als ob sie nicht darauf zugreifen dürfen. Ich habe eine Funktion namens "runTimer", die "_time" bei jeder Ausführung um eins erhöhen soll. Ich habe eine andere Funktion namens "ErhöhungZeit", die alle 1000 Millisekunden "runTimer" ausführen soll. Die Variable scheint sich jedoch nie zu erhöhen. Dies war nicht meine erste Spaghetti-Code-Implementierung eines Timers, da ich in den letzten Stunden verschiedene Dinge ausprobiert habe. Ich kann einfach nicht verstehen, warum die Variable nicht zunimmt.

Answer 1

Dies ist ein großes Stück Code. Wie RobG darauf hingewiesen hat, versuchen Sie, Ihre Frage an das möglichst kleine, vollständige und nachprüfbare Beispiel zu erinnern.

Das sagte auf einen Blick, es scheint, dass Ihr Timer wahrscheinlich aktualisiert wird. Mindestens _time ist.

Das Problem ist wahrscheinlich, dass Sie nie Ihr div neu zeichnen, so dass es den aktualisierten Wert nicht anzeigt. Sie müssen game.displayTimer() jedes Mal _time Updates aufrufen.

wahrscheinlich einfachste Ort hinzufügen es in Ihrem setInterval() in increaseTime() wäre:

my.increaseTime = function() { 
    setInterval(function(){ 
    runTimer(); 
    my.displayTime(); 
    }, 1000) 
}