Javascript pop函数不是'；不要把尾巴从蛇阵上取下来？

我正在用JS制作一个蛇游戏。现在，我能够将蛇画到画布上，并接受用户的移动方向。给定方向，我可以将一个新的头部移到蛇身上，但由于某些原因，我无法使用pop方法来移除尾巴。这只会导致我的蛇越来越大。你知道为什么会这样吗

const canvas=document.querySelector（'#canvas'）；
const ctx=canvas.getContext（'2d'）；
//将画布维度设置为等于css维度
画布宽度=768；
canvas.height=512；
//现在将这些维度放入变量中
const cvsW=画布宽度；
const cvsH=画布高度；
//创建蛇单位
常数单位=16；
//创建蛇阵列
设snake=[{x:cvsW/2，y:cvsH/2}]；
//阅读用户指示
文件。添加的事件列表器（“向下键”，更改方向）；
让方向；
功能改变方向（e）{
如果（e.keyCode==37&&direction！='right'）方向='left'；
如果（e.keyCode==38&&direction！='down'）direction='up'；
如果（e.keyCode==39&&direction！='left'）方向='right'；
如果（e.keyCode==40&&direction！='up'）方向='down'；
控制台日志（方向）；
}
函数绘图（）{
for（设i=0；i

蛇类游戏
身体{
背景色：#333；
}
帆布{
背景色：#4D；
保证金：自动；
显示：块；
位置：绝对位置；
左：0；
右：0；
排名：0；
底部：0；
宽度：750px；
高度：500px；
}
每次迭代都需要清除当前画布，否则先前绘制到画布上的像素将保留。加

  ctx.clearRect(0, 0, canvas.width, canvas.height);

在开始迭代snake数组以绘制每个正方形之前：


const canvas=document.querySelector（'#canvas'）；
const ctx=canvas.getContext（'2d'）；
//将画布维度设置为等于css维度
canvas.width=768；
canvas.height=512；
//现在将这些维度放入变量中
const cvsW=画布宽度；
const cvsH=画布高度；
//创建蛇单位
常数单位=16；
//创建蛇阵列
让蛇=[{
x:cvsW/2，
y:cvsH/2
}];
//阅读用户指示
文件。添加的事件列表器（“向下键”，更改方向）；
让方向；
功能改变方向（e）{
如果（e.keyCode==37&&direction！='right'）方向='left'；
如果（e.keyCode==38&&direction！='down'）direction='up'；
如果（e.keyCode==39&&direction！='left'）方向='right'；
如果（e.keyCode==40&&direction！='up'）方向='down'；
控制台日志（方向）；
}
函数绘图（）{
clearRect（0，0，canvas.width，canvas.height）；
ctx.fillStyle='limegreen'；
for（设i=0；i
正文{
背景色：#333；
}
帆布{
背景色：#4D；
保证金：自动；
显示：块；
位置：绝对位置；
左：0；
右：0；
排名：0；
底部：0；
宽度：750px；
高度：500px；
}
重新排列绘图函数并添加
ctx.clearRect
。按以下方式修改绘图功能：

function draw() {

    //grab head position
    let headX = snake[0].x;
    let headY = snake[0].y;

    if(direction == 'left') headX -= unit;
    else if(direction == 'up') headY -= unit;
    else if(direction == 'right') headX += unit;
    else if(direction == 'down') headY += unit;

    //create new head
    let newHead = {x: headX, y: headY}

    //add head to snake
    snake.unshift(newHead);

    for(let i = 0; i < snake.length; i++) {
        ctx.fillStyle = 'limegreen';
        ctx.fillRect(snake[i].x, snake[i].y, unit, unit);
    }

    let popped = snake.pop();
    ctx.clearRect(popped.x, popped.y, unit, unit);
}

函数绘图（）{
//抓头位置
设headX=snake[0].x；
设headY=snake[0].y；
如果（方向==‘左’）头X-=单位；
否则，如果（方向==‘向上’）头晕目眩-=单位；
否则，如果（方向==‘右’）头X+=单位；
否则，如果（方向==‘向下’）头晕+=单位；
//创建新的头
设newHead={x:headX，y:headY}
//给蛇添头
蛇。未移位（新头）；
for（设i=0；i