HTML 5 Canvas - Правильный способ присвоения значений координат массиву/объекту в Javascript

Question

Я делаю базовую старую школьную змею, используя Node.js для изучения. Теперь вместо 1 «продовольственного блока», появляющегося по одному, я пытаюсь сделать еще одну икру каждую секунду. Теперь у меня есть несколько «пищевых блоков» с координатами X, Y, которые я должен передать клиенту. Как я мог бы выполнить это, не отправив огромный массив из 100x100 из истинного и ложного?

JAVASCRIPT

//Game is 100 by 100 

var food = ?;//An array which stores the X & Y coordinates of all spawned food 

if(foodEaten){ 
    removeFood(foodEatenX, foodEatenY); 
} 
//Call once every second 
spawnFood(); 

socket.emit('foodPositions', food);//send the `food` array to client 

function spawnFood(){ 
    var foodX, 
     foodY, 
     flag = false; 

    while(!flag){ 
     foodX = Math.floor(Math.random() * 100), 
     foodY = Math.floor(Math.random() * 100); 

     if(map[foodX][foodY].claim == "empty"){ 
      flag = true; 
      map[foodX][foodY].claim = "notempty"; 

      /* 
      --CODE HERE TO ADD for `food` variable 
      */ 
     } 
    } 
} 
function removeFood(x, y){ 
    //remove food coordinates in array 
} 

упрощенного

--На обязательно в заданном порядке

1) Spawn пищи @ случайный X/Y координат (После того, как второй)

еда [x] [y] = true

2) Удалить пищи @ X/Y координаты (всякий раз, когда я хочу (например, когда пища становится "съеденным")

еды [х] [у] = удалить (не ложь, просто удалить из массива/объект)

3) Отправить пакет пищи клиенту

Испустите (еда)

кЛИЕНТ

принимать food переменную и делать: // Нарисовать все имеющиеся в настоящее время пищевые блоки для (var i = 0; i < food.length; я ++) DrawImage (foodImage, foodX, Foody)

PS - Извините, если код грязный и вопрос немного расплывчато, мозг жарится

Answer 1

Я хотел бы попробовать со списком «пищевых блоков», каждый из которых с его координаты (меньше, чем массив из 100x100 элементов).

Клиент позаботится об удалении любого съеденного пищевого блока.