Javascript 如何使用落下的对象设置阵列_Javascript

Javascript 如何使用落下的对象设置阵列

javascript

Javascript 如何使用落下的对象设置阵列,javascript,Javascript,我正在尝试制作一个游戏，我希望能够随机生成从天而降的敌人，当玩家与他们接触时，游戏将结束。除了我不知道如何将对象随机生成一个数组，这样我就可以设置它们从上面掉下来坠落敌人的文件名为orisaSprite.png 我的代码可以在下面找到： <!DOCTYPE html> <html> <head> <script> var canvas, ctx; var soldier=n

我正在尝试制作一个游戏，我希望能够随机生成从天而降的敌人，当玩家与他们接触时，游戏将结束。除了我不知道如何将对象随机生成一个数组，这样我就可以设置它们从上面掉下来

坠落敌人的文件名为orisaSprite.png

我的代码可以在下面找到：

<!DOCTYPE html>
<html>
    <head>
        <script>
            var canvas, ctx;

            var soldier=new Image();
            soldier.src="soldierSprite.png";

            var background=new Image();
            background.src="overwatchBackground.jpg";

            var soldierX, soldierY, soldierXFrame, soldierYFrame, soldierFrameW, soldierFrameH;

            var upKey, downKey, leftKey, rightKey;

            function initialize(){
                //canvas variables
                canvas=document.getElementById('myCanvas');
                ctx=canvas.getContext("2d");

                //soldier variables
                soldierX=0;
                soldierY=650;
                soldierXFrame=0;
                soldierYFrame=1;
                soldierFrameW=80;
                soldierFrameH=63;

                //keyboard controls
                upKey=false;
                downKey=false;
                leftKey=false;
                rightKey=false;
                document.addEventListener("keydown", keyDownHandler);
                document.addEventListener("keyup", keyUpHandler);

                update();
            }
            function update(){
                if(rightKey && soldierX<canvas.width-soldierFrameW-15) {
                    soldierYFrame=0;
                    soldierX += 6;
                }
                else if(leftKey && soldierX>0) {
                    soldierYFrame=1;
                    soldierX -= 6;
                }
                if(rightKey || leftKey || upKey || downKey){
                    soldierXFrame++;
                    soldierXFrame%=6;
                }
                draw();
                requestAnimationFrame(update);

            }
            function draw(){
                ctx.clearRect(0,0,canvas.width, canvas.height);
                ctx.drawImage(background, 0, 0, canvas.width, canvas.height);
                ctx.drawImage(soldier, soldierXFrame*soldierFrameW, soldierYFrame*soldierFrameH, soldierFrameW, soldierFrameH, soldierX, soldierY, soldierFrameW, soldierFrameH );
            }
            function keyDownHandler(e){
                //alert(e.keyCode);
                switch(e.keyCode){
                    case 37: leftKey=true; break;
                    case 39: rightKey=true; break;
                }
            }
            function keyUpHandler(e){
                //alert(e.keyCode);
                switch(e.keyCode){
                    case 37: leftKey=false; break;
                    case 39: rightKey=false; break;
                }
            }
        </script>
    </head>
    <body onload='initialize()'>
        <canvas id='myCanvas' width='1280px' height='800px'></canvas>
    </body>
</html>


var画布，ctx；
var soldier=新图像（）；
soldier.src=“soldierSprite.png”；
var background=新图像（）；
background.src=“overwatchBackground.jpg”；
var士兵，士兵，士兵X框架，士兵框架，士兵框架，士兵框架，士兵框架；
var上键、下键、左键、右键；
函数初始化（）{
//画布变量
canvas=document.getElementById（'myCanvas'）；
ctx=canvas.getContext（“2d”）；
//士兵变量
士兵=0；
士兵人数=650人；
士兵X帧=0；
士兵框架=1；
士兵框架=80；
士兵框架=63；
//键盘控制
upKey=false；
downKey=false；
leftKey=false；
rightKey=false；
文件。添加了文本列表器（“keydown”，keyDownHandler）；
文件。添加的监听器（“keyup”，keyUpHandler）；
更新（）；
}
函数更新（）{
if（右键和士兵X0）{
士兵框架=1；
士兵人数-=6人；
}
如果（右键| |左键| | |上键| |下键）{
soldierXFrame++；
士兵X帧%=6；
}
draw（）；
requestAnimationFrame（更新）；
}
函数绘图（）{
ctx.clearRect（0,0，canvas.width，canvas.height）；
ctx.drawImage（背景、0、0、canvas.width、canvas.height）；
ctx.drawImage（士兵，士兵X帧*士兵帧，士兵帧*士兵帧，士兵帧，士兵帧，士兵帧，士兵帧，士兵帧，士兵帧，士兵帧，士兵帧）；
}
函数keyDownHandler（e）{
//警报（如钥匙代码）；
开关（如钥匙代码）{
案例37:leftKey=true；中断；
案例39:rightKey=true；中断；
}
}
函数keyUpHandler（e）{
//警报（如钥匙代码）；
开关（如钥匙代码）{
案例37:leftKey=false；中断；
案例39:rightKey=false；中断；
}
}

这是一个非常具体的问题。让某些东西“坠落”的一种方法与在屏幕上渲染士兵的方式非常相似。只需在屏幕顶部渲染一个对象，就像你对士兵一样。与其让它根据键盘输入向左、向右、向上移动，不如让它向下移动

您的问题可能会被标记为太具体/不是一个好问题。

“您的问题可能会被标记为太具体/不是一个好问题。”-如果你真的相信这一点，那你为什么要回答？如果我错了，因为我对堆栈溢出比较陌生，你能把你的精灵和背景上传到imgur，这样我们就可以运行你的代码吗？更好的方法是制作一个JSFIDLE/codepen？