Question

我一直在研究一种细菌模拟器，其中细菌采取的方向是“随机的”，但它创造了一种模式，所有的细菌都在屏幕上，这是为什么？我做错了什么？

我的代码：

var sandbox = "#main";
spawn(1);
for (var i = 0; i < 10; i++) {
  $(sandbox).animate({
    "height": $(sandbox).height()
  }, 500, function() {
    step();
  });
}

function spawn(amount) {
  var WIDTH = $(sandbox).width();
  var HEIGHT = $(sandbox).height();

  for (var i = 0; i < amount; i++) {
    addLiving(Math.round(Math.random() * 9999999), Math.round(Math.random() * WIDTH), Math.round(Math.random() * HEIGHT), 15);
  }
}

function addLiving(ID, LEFT, TOP, FOOD) {
  $(sandbox).append('<div id="id' + ID + '" class="livingBeing" style="position:absolute;top:' + TOP + 'px;left:' + LEFT + 'px;background-color:#000;width:1px;height:1px" food="' + FOOD + '"></div>');
}

function step() {
  $(".livingBeing").each(function() {
    move(this);
    eat(this);
    split(this);
    if (Math.round(parseInt($(this).attr("food"), 10)) > 0) {
      $(this).attr("food", Math.round(parseInt($(this).attr("food"), 10) - 1));
    } else {
      $(this).remove();
    }
  });
}

function move(living) {
  var way = Math.round(Math.random() * 3) + 1;
  console.log(way);
  if (way === 1) {
    $(living).css({
      'top': "+=1px"
    });
  }
  if (way === 2) {
    $(living).css({
      'top': "-=1px"
    });
  }
  if (way === 3) {
    $(living).css({
      'left': "-=1px"
    });
  }
  if (way === 4) {
    $(living).css({
      'left': "+=1px"
    });
  }

  if ($(living).position().top > $(sandbox).height()) {
    $(living).css({
      'top': "-=1px"
    });
  }
  if ($(living).position().top < $(sandbox).height()) {
    $(living).css({
      'top': "+=1px"
    });
  }
  if ($(living).position().left > $(sandbox).height()) {
    $(living).css({
      'left': "-=1px"
    });
  }
  if ($(living).position().left < $(sandbox).height()) {
    $(living).css({
      'left': "+=1px"
    });
  }
}

function eat(living) {
  //if livingBeing1 is now at the same spot as livingbeing2 then livingBeing2 dies and
  //livingBeing1 gets livingBeing2's food
  $(".livingBeing").each(function() {
    if ($(this).position().top === $(living).position().top && $(this).position().left === $(living).position().left && $(this).id !== $(living).id) {
      $(living).attr("food", parseInt($(living).attr("food"), 10) + parseInt($(this).attr("food"), 10));
      $(this).remove();
    }
  });
}

function split(living) {
  //if food greater than/equal (Math.random()*10)+2; then split
  if (parseInt($(living).attr("food"), 10) >= (Math.random() * 20) + 10) {
    addLiving(Math.round(Math.random() * 9999999), $(living).position().left + 1, $(living).position().top + 1, Math.floor(parseInt($(living).attr("food"), 10) / 2));
    $(living).attr("food", Math.floor(parseInt($(living).attr("food"), 10) / 2));
  }
}

#main {
  position: fixed;
  width: 100px;
  height: 100px;
  border: 1px solid #C3C3C3;
}

<!DOCTYPE html>
<html>

<head>
  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
  <title>testing</title>
</head>

<body>
  <div id="main"></div>
</body>

</html>

Answer 1

问题1。这不对：

restore

Math.round(Math.random() * 3) + 1为您提供0到3之间的随机数。这是4个不同的数字，但它们的分布不相等。

舍入并添加1将使：

if 0..0.5 =＆gt; 1（间隔大小：0.5 => 16.66％几率）=＆gt;达
如果0.5..1.5 =＆gt; 2（间隔大小：1 => 33.33％几率）=＆gt;向下
如果1.5..2.5 =＆gt; 3（间隔大小：1 => 33.33％几率）=＆gt;左
如果2.5..3 =＆gt; 4（间隔大小：0.5 => 16.66％几率）=＆gt;右

所以这应该使细菌趋于下降和离开。

这将使分配更加平等：

Math.random() * 3

问题2。

Math.trunc(Math.random() * 4) + 1;

这意味着如果顶部在边界内而不是使其下降。我想你想if ($(living).position().top < $(sandbox).height()) { $(living).css({ 'top': "+=1px" }); }。与.top < 0相同。

Answer 2

要使Javascript Math.Random真正随机，您需要使用Math.Floor并添加乘数。

var randomNumber = Math.floor(Math.random() * 10) + 1

此处的解释 - http://blog.ginchen.de/en/2010/10/09/javascripts-math-random-wenn-zufall-keiner-ist/

无法正确使用Math.random

2 个答案: