Я пытаюсь получить обнаружение, когда змея попадает в пищу

---

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");

var rightPressed = false;
var leftPressed = false;
var upPressed = false;
var downPressed = false;

var foods = {
	x: Math.floor(Math.random() * 500),
	y: Math.floor(Math.random() * 500)
};

var snake = {
	x: 25,
	y: 25,
	width: 25,
	height: 25
};

function drawRect() {
	ctx.clearRect(0, 0, canvas.width, canvas.height);
	ctx.beginPath();
	ctx.rect(snake.x, snake.y, snake.width, snake.height)
	ctx.fillStyle = "#000000";
	ctx.fill();
	ctx.closePath();
}

function controls() {
	if(rightPressed) {
		snake.x += 1;
	}else if(leftPressed) {
		snake.x -= 1;
	}else if(upPressed) {
		snake.y -= 1;
	}else if(downPressed) {
		snake.y += 1;
	}
}

function collision() {
	if(snake.x >= canvas.width) {
		snake.x = canvas.width - canvas.width;
	}else if(snake.x < canvas.width - canvas.width) {
		snake.x = canvas.width;
	}else if(snake.y >= canvas.height) {
		snake.y = canvas.height - canvas.height;
	}else if(snake.y < canvas.height - canvas.height) {
		snake.y = canvas.height;
	}
}

document.addEventListener("keydown", keyDownHandler, false);
//document.addEventListener("keyup", keyUpHandler, false);

function keyDownHandler(e) {
    if(e.keyCode == 39) {
        rightPressed = true;
		leftPressed = false;
		upPressed =  false;
		downPressed = false;
    }
    else if(e.keyCode == 37) {
        leftPressed = true;
		rightPressed = false;
		upPressed = false;
		downPressed = false;
    }
	if(e.keyCode == 38) {
        upPressed = true;
		leftPressed = false;
		rightPressed = false;
		downPressed = false;
    }
    else if(e.keyCode == 40) {
        downPressed = true;
		rightPressed = false;
		leftPressed = false;
		upPressed = false;
    }
}

/*
function keyUpHandler(e) {
    if(e.keyCode == 39) {
        rightPressed = false;
    }
    else if(e.keyCode == 37) {
        leftPressed = false;
    }
	if(e.keyCode == 38) {
        upPressed = false;
    }
    else if(e.keyCode == 40) {
        downPressed = false;
    }
}
*/

function food() {
	ctx.beginPath();
	ctx.rect(foods.x, foods.y, 25, 25);
	ctx.fillStyle = "#8B0000";
	ctx.fill();
	ctx.closePath();
}





                                MY PROBLEM|
                                         
----------------------------------------------------------------------
function eatFood() {
	if(snake.x == foods.x && snake.y == foods.y) {
		console.log("collide");
	}
}
----------------------------------------------------------------------







function start() {
	drawRect();
	controls();
	collision();
	food();
	eatFood();
}


setInterval(start, 10);

Что я уже пробовал:

Я пробовал несколько способов, и если бы я мог помочь, это было бы потрясающе.

---