西蒙游戏在2级进行3级序列

时间:2017-09-02 17:13:30

标签: javascript jquery html css

我正在进行一项西蒙游戏,并且在2级进行3级序列,而不是在2级进行2次。我已经看了一遍。并且我尝试输出到控制台,但我想我已经盯着这个太久了。如果有人能找到错误,请分享。谢谢您的帮助。 这是笔 https://codepen.io/zentech/pen/XaYygR

//variables
userSeq = [];
simonSeq = [];
const NUM_OF_LEVELS = 5;
var id, color, level = 0;
var strict = false;
var error = false;
var boardSound = [
  "http://www.soundjay.com/button/sounds/button-4.mp3", //green
  "http://www.soundjay.com/button/sounds/button-09.mp3", //red
  "http://www.soundjay.com/button/sounds/button-10.mp3", //yellow 
  "http://www.soundjay.com/button/sounds/button-7.mp3" //blue   
];

//1- start board sequence
$(document).ready(function() {
  $(".start").click(function() {
    strict = false;
    error = false;
    level++;
    simonSeq = userSeq = [];
    simonSequence();
  })

  //user pad listener
  $(".pad").click(function() {
    id = $(this).attr("id");
    color = $(this).attr("class").split(" ")[1];
    userSequence();
  });

  //strict mode listener
  $(".strict").click(function() {
    level = 0;
    level++;
    simonSeq = userSeq = [];
    strict = true;    
    simonSequence();
  })
})

//user sequence
function userSequence() {
  userSeq.push(id);
    console.log(id+" "+color);
    addClassSound(id, color);
    //check user sequence
    if(!checkUserSeq()) {
      //if playing strict mode reset everything lol
      if(strict) {
        console.log("strict");
        simonSeq = [];
        level = 1;
      }   
      displayError();
      userSeq = [];
      error = true;   
      console.log("start simon error")
      simonSequence();
    }
    //checking end of sequence
    else if(userSeq.length == simonSeq.length && userSeq.length < NUM_OF_LEVELS) {
      level++;
      userSeq = [];
      error = false;
      console.log("start simon")
      simonSequence();
    }
    //checking for winners
    if(userSeq.length == NUM_OF_LEVELS) {
      displayWinner();
      resetGame();
    }     

}

/* simon sequence */
function simonSequence() {
  console.log("level "+level);
  $(".display").text(level);
  if(!error) {
    getRandomNum();
  }  
  var i = 0;
  var myInterval = setInterval(function() {
    id = simonSeq[i];
    color = $("#"+id).attr("class");
    color = color.split(" ")[1];
    console.log(id+" "+color);
    addClassSound(id, color);
    i++;
    if(i == simonSeq.length) {
      clearInterval(myInterval);
    } 
  }, 1000);  
}

//generate random number
function getRandomNum() {
  var random = Math.floor(Math.random() * 4);
  simonSeq.push(random);
}

/* add temporary class and sound  */
function addClassSound(id, color) {
  $("#"+id).addClass(color+"-active");
  playSound(id)
  setTimeout(function(){
    $("#"+id).removeClass(color+"-active");
  }, 500);
}

/* checking user seq against simon's */
function checkUserSeq() {
  for(var i = 0; i < userSeq.length; i++) {
    if(userSeq[i] != simonSeq[i]) {      
      return false;
    }
  }
  return true;
}

/* display error  */
function displayError() {
  console.log("error");  
  var counter = 0;
  var myError = setInterval(function() {
    $(".display").text("Err");
    counter++;
    if(counter == 3) {
      $(".display").text(level);
      clearInterval(myError);
      userSeq = [];
      counter = 0;
    }
  }, 500);
}

//display winner 
function displayWinner() {
  var count = 0;
  var winInterval = setInterval(function() { 
    count++;
    $(".display").text("Win");
    if(count == 5) {
      clearInterval(winInterval);
      $(".display").text("00");
      count = 0;
    }
  }, 500);
}

/* play board sound */
function playSound(id) {
  var sound = new Audio(boardSound[id]);
  sound.play();
}

/* reset game */
function resetGame() {
  userSeq = [];
  simonSeq = [];
  level = 0;
  strict = false;
  $(".display").text("00");
}

1 个答案:

答案 0 :(得分:1)

问题

您的初始化代码中存在参考复制问题。

$(document).ready(function() {
  $(".start").click(function() {
    strict = false;
    error = false;
    level++;
    simonSeq = userSeq = []; //PROBLEM !!!!
    simonSequence();
  })

数组通过引用传递,而非值。

simonSeq = userSeq = [];
/* Any changes to 'userSeq' will affect 'simonSeq'.
 'simonSeq' is referencing 'userSeq' */

更改

的所有实例
simonSeq = userSeq = [];

simonSeq = [];
userSeq = [];

EXPLINATION

JavaScript中的值可以通过两种方式引用;通过参考

当您通过引用某些内容时,您正在复制它。

var numA = 5;
var numB = numA; //COPY numA over to numB
numA = 12; // Changes to numA will not affect numB because it was copied
console.log(numA); // 12
console.log(numB); // 5

当您通过引用引用某些内容时,您正在引用/引用它,而不是复制它。对原始文件所做的任何更改都将影响引用它的所有内容。

var original = [1,2,3];
var ref = original; //Any changes made to 'original' will affect 'ref'

original.push('APPLES');
console.log(original); // [1,2,3,'APPLES']
console.log(ref); // [1,2,3,'APPLES']

在上面的代码中, ref 实际上并不包含任何值。 参考包含原始的内存位置。

  

参考引用原始

     

数组和对象总是通过引用传递/引用。

     

其他所有内容都按值传递/引用(它们被复制)。