【day-1】365 Days of Javascript

真剣衰弱

要点

• カードの配置をシャッフルする

Array.prototype.shuffle = function() {
  var i = this.length;
  while (i) {
    var j = Math.floor(Math.random()*i);
    var t = this[--i];
    this[i] = this[j];
    this[j] = t;
  }
  return this;
}

• 経過時間はgetTime()で得た差分を1000で割り秒数を得る

// タイマー
function tick() {
  var now = new Date();
  var count = Math.floor((now.getTime() - startTime.getTime()) / 1000);
  document.getElementById("timer").textContent = count;
}

• カード選択時 選択時に比較を行いあっている場合はscoreを加算してすべてが表になっている場合にタイマーをストップ

// カードの選択時
function flip(e) {
  var src = e.srcElement;
  // すでに表になっている or 表にしている途中の場合はブレイク
  if (flipTimer || src.textContent != "") {
    return;
  }
  
  // TODO: 後で追加
  var num = src.number;
  src.className = "card";
  src.textContent = num;
  
  // 1枚目
  if (prevCard == null) {
    prevCard = src;
    return;
  }
  
  // 2枚目 (めくった数字が合っていた場合)
  if (prevCard.number == num) {
    if (++score == 10) { 
      clearInterval(timer);
    }
    // 以前のカードをリセット
    prevCard = null;
    clearTimeout(flipTimer);
  } else {
    // 数字が間違っていた場合は1秒後に裏返す
    flipTimer = setTimeout(function () {
      src.className = "card back";
      src.textContent = "";
      prevCard.className = "card back"; //裏返しに戻す
      prevCard.textContent = "";
      prevCard = null;
      flipTimer = NaN;
    }, 1000);
  }