JavaScript Canvas - 是否可以繪製取決於Math.random？

Question

我正在爲遊戲創建一個非常基本的精靈（它在Canvas/Context/LineTo中繪製）。我希望它的表達根據兩種不同的繪製方法隨機變化。這是我在這樣的嘗試：

  drawFace = function() { 
       if (Math.random() < 0.05) { 
        Player.drawhappyface(context); 
       } 
       else if (Math.random() < 0.1) { 
        Player.drawsadface(context); 
       } 
      } 

      drawFace(); 

我可以證實，drawhappyface和drawsadface繪製方法的工作獨立於本功能（分別畫一個微笑，一顰）。但是使用這個函數及其邏輯，他們根本就不會被繪製（玩家完全沒有臉）。那麼，我寫錯了嗎？我受以下模擬的啓發，該模擬不斷使用Math.random動畫表達式：http://www.blobsallad.se/

如果我改爲寫這樣的函數，那麼在畫布上絕對沒有繪製任何東西（所有其他精靈等也不是拉）：

 drawFace = function (context) { 
      if (Math.random() < 0.05) { 
       Player.drawhappyface(context); 
      } 
      else if (Math.random() < 0.1) { 
       Player.drawsadface(context); 
      } 
     } 

     drawFace(); 

Answer 1

的問題可能是你叫兩個if語句Math.random()，然後他們會有不同的值。呼叫Math.random()只有一次，並保存值每次你需要時間/調用drawFace嘗試像這樣：

drawFace = function() { 
 
    var randomNumber = Math.random(); 
 
    console.log(randomNumber); 
 
    if (randomNumber < 0.05) { 
 
     console.log('randomNumber < 0.05'); 
 
    } 
 
    else if (randomNumber < 0.1) { 
 
     console.log('randomNumber < 0.1'); 
 
    } 
 
} 
 

 
drawFace();

，如果你只是想畫快樂或悲傷的臉，你可以做更簡單if else

drawFace = function() { 
 
    var randomNumber = Math.random(); 
 
    console.log(randomNumber); 
 
    if (randomNumber < 0.5) { 
 
     console.log('draw happy face'); 
 
    } else { 
 
     console.log('draw sad face'); 
 
    } 
 
} 
 

 
drawFace();