在 javascript 中制作賽車游戲。嘗試模擬迎面而來的汽車時，當其他汽車到達終點時，我無法創建更多汽車

Question

我正在嘗試制作一個賽車游戲，用戶必須盡量避免迎面而來的汽車。 為了創建迎面而來的汽車，我創建了一個稱為障礙物的 class。 此外，我有一個繪制障礙物的 function 並且在該 function 中，我有一個 if 語句，用於檢查汽車是否已接近 ZFCC790C72A86190DE1B549D0DDC6F14Z 的底部，因此可以創建下一個 CZ35 障礙物。 但是，該程序似乎與創建新車不一致，有時甚至根本不起作用。 我應該如何解決這個問題？ 先感謝您。 到目前為止，這是我的代碼：

<body>
    <p><span id="val">here</span></p>
    <canvas width="400" height="500" id="myCanvas"></canvas>
    <script>
        "use strict"
        var a=document.getElementById("myCanvas");
        var c=a.getContext("2d");
        
        var obs=[];
        
        function randomNumber(){
            var rand=(Math.random()*400)+1;
            if(rand<400/3){return 50}
            else if(rand>400/3&&rand<400*2/3){return 180}
            else if(rand>rand<400*2/3){return 300}
        }
        
        class obstacles{
            constructor(x){
                this.x=x;
                this.y=-(Math.floor(Math.random()*300)+1);
            }
            
            show(){
                c.fillStyle="blue";
                c.beginPath();
                c.rect(this.x,this.y,40,70);
                c.fill();
                c.closePath();
            }
            
            move(){
                this.y+=3;
            }
        }
        createObstacles();
        function createObstacles(){
            var x;
            for(var i=0;i<3;i++){
                x=randomNumber();
                obs[i]=new obstacles(x);
            }
        }
        
        function draw(){
            c.clearRect(0,0,400,500);
            var x;
            for(var j=0;j<obs.length;j++){
                x=randomNumber();
                obs[j].show();
                obs[j].move();
            }
            for(var i=0;i<obs.length;i++){
                if(obs[i].y==350){
                    obs.push(new obstacles(x))
                }
            }
        }
        window.setInterval(draw,17);
        
    </script>
</body>

Answer 1

當你創建一個障礙物時，它會被賦予一個隨機的 y position。 然后，每當它移動時，它的 y 在你的移動 function 中變化 3。 但是，當您 go 檢查它是否已到達底部時，您只需檢查 y 是否正好為 350： obs[i].y==350 。 完全有可能，考慮到障礙物的開始位置，在它的一次移動中，它移動了 3 個空格並完全跳過了 350 個空格。在這種情況下，您的代碼將永遠不會觸發。

一個簡單的解決方案是將您的==更改為>以便它檢查 y 是否超過 350，而不僅僅是當它完全等於它時：

for(var i=0;i<obs.length;i++){
                if(obs[i].y>350){
                    obs.push(new obstacles(x))
                }
            }

希望這可以解決您的問題。 不過，我實際上並沒有測試運行您的代碼，因此可能還有其他錯誤。 祝你的項目好運！

在 javascript 中制作賽車游戲。嘗試模擬迎面而來的汽車時，當其他汽車到達終點時，我無法創建更多汽車

問題描述

1 個解決方案

解決方案1
0 已采納 2020-07-08 04:45:49

在 javascript 中制作賽車游戲。 嘗試模擬迎面而來的汽車時，當其他汽車到達終點時，我無法創建更多汽車

問題描述

1 個解決方案

解決方案1 0 已采納 2020-07-08 04:45:49

在 javascript 中制作賽車游戲。嘗試模擬迎面而來的汽車時，當其他汽車到達終點時，我無法創建更多汽車

解決方案1
0 已采納 2020-07-08 04:45:49