Java 脚本中的碰撞检测问题

Collision detection problems in Java Script

var u = 8;
var x = [];
var y = [];
var s = {
    x: 20,
    y: 20,
    l: 1,
};
var e = {
    e: false,
    x: 0,
    y: 0,
};

function setup() {
    makefood();
    lime;
}

document.onkeydown = keydown;

function keydown(e) {
    ctrls(e.keyCode, true);
}

function ctrls(keyCode, bool) {
    if (keyCode == 37) {
        s.a = true;
        s.w = false;
        s.d = false;
        s.s = false;
    }
    if (keyCode == 38) {
        s.a = false;
        s.w = true;
        s.d = false;
        s.s = false;
    }
    if (keyCode == 39) {
        s.a = false;
        s.w = false;
        s.d = true;
        s.s = false;
    }
    if(keyCode == 40) {
        s.a = false;
        s.w = false;
        s.d = false;
        s.s = true;
    }
}

function calc() {
    if (s.a === true) {
        s.x -= 1;
    }
    if (s.w === true) {
        s.y -= 1;
    }
    if (s.d === true) {
        s.x += 1;
    }
    if (s.s === true) {
        s.y += 1;
    }
    x.push(s.x);
    y.push(s.y);
}

function makefood() {
    e.x = Math.round(Math.random() * 41);
    e.y = Math.round(Math.random() * 41);
    ctx.fillRect(e.x * u, e.y * u, u, u);
}

function eat() {
    makefood();
    e = false;
    x.push(s.x);
    y.push(s.y);
    s.l++;
    
}

function ctest() {
    if (s.x * u == e.x * u && s.y * u == e.y * u) {
        eat();
    }
}

function draw() {
    for (i = 0; i < s.l; i++) {
        ctx.fillRect(x[i] * u, y[i] * u, u, u);
    }
}

function clear() {
    ctx.clearRect(x[0] * u, y[0] * u, u, u);
    if (e === true) {
        x.shift();
        y.shift();
    }
    e = true;
}

function timer() {
    clear();
    ctest();
    calc();
    draw();
}

var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
var lime = ctx.fillStyle = 'lime';
setup();

setInterval(timer, 100);
body {
    background-color: black;
    text-align: center;
}

#canvas {
    background-color: black;
    border: 1px solid lime;
    margin-top: 20%;
}
<html>

<head>
    <link href="index.css" type="text/css" rel="stylesheet">
    <title>Index</title>
</head>

<body>
    <canvas id="canvas" height="328px" width="328"></canvas>
    <script src="index.js"></script>
</body>

</html>

我试图在 s.x 和 s.y 分别为 e.x 和 e.y 时调用函数 makefood() 但由于某些原因它不会工作,我已经尝试了最长的时间,但仍然一无所获。我只是想编写贪吃蛇游戏的代码,您可以查看下面的代码。如果您需要更多信息,请告诉我!感谢所有帮助过的人。

您需要将所有 e 更改为 e.e

function eat() {
    makefood();
    e.e = false;
    x.push(s.x);
    y.push(s.y);
    s.l++;
    
}
function clear() {
    ctx.clearRect(x[0] * u, y[0] * u, u, u);
    if (e.e === true) {
        x.shift();
        y.shift();
    }
    e.e = true;
}