HTML Canvas .fillStyle无法正确渲染颜色

Question

我正在使用HTML画布创建游戏，并且在画布的上下文.fillStyle方法中存在一些问题。这是我的玩家变量和我的drawPlayer（）方法：

var player = {
    x: width/2,
    y: height - 15,
    width: 7,
    height: 7,
    speed: 3,
    velY: 0,
    jumping: false,
    onGround: false,
    onLadder: false
};

function drawPlayer() {
    ctx.beginPath();
    ctx.rect(player.x, player.y, player.width, player.height);
    ctx.fillStyle = "yellow";
    ctx.fill();
    ctx.closePath();
}

如上所述，cavnas将玩家呈现为黄色方块。然而，当我向播放器添加颜色组件并将.fillStyle与该播放器组件一起使用时（见下文），画布将其渲染为黑色。

var player = {
    x: width/2,
    y: height - 15,
    width: 7,
    height: 7,
    speed: 3,
    velY: 0,
    jumping: false,
    onGround: false,
    onLadder: false,
    color: "yellow"
};


function drawPlayer() {
    ctx.beginPath();
    ctx.rect(player.x, player.y, player.width, player.height);
    ctx.fillStyle = player.color;
    ctx.fill();
    ctx.closePath();
}