Решил разобраться в работе змейке и затруднение вызывает данный кусок кода:
snake.tails.forEach(function(el, index){
if (index == 0) {
context.fillStyle = "#FA0556";
} else {
context.fillStyle = "#A00034";
}
context.fillStyle = '#fa0556'
context.fillRect(el.x, el.y, grid, grid);
});
У меня постоянно проблемы с аргументами функций и тут снова. Я не понимаю каким образом высчитывается index элемента массива и el. их просто передали в функцию а дальше ссылаются на index чтобы узнать номер этого элемента... как? тут ведь даже не строчек по типу:
el++;
index++;
Вобщем, объясните как работает el и index, заранее спасибо
Твой массив snake.tails отвечает за индекс. Потому что forEach - это цикл, который перебирает массив до конца и не может быть остановлен... вот ему и не требуется увеличение индекса, потому что индекс - это возвращенное значение из цикла, равно как два других возвращенных им же элемента - элемент, индекс, массив.
Потому что это цикл forEach. Ключ-значение, перебор массива
Метод forEach находит элемент и индекс и передаёт эти данные в тобою заданную функцию. Твоя задача лишь написать функцию, понимая в каком порядке расположены эти аргументы. Для forEach это элемент, индекс и массив.
forEach - встроенный метод прототипа массива. Работает так же как и for i или for of, но при этом в аргументах передает текущий перебираемый елемент массива и индекс перебираемого елемента массива от 0 до "Number.MAX_VALUE"
element - текущий елемент перебора.
index - индекс элемента в массиве который перебираем.
snake.tails.forEach(function(element, index) {
if (index == 0) { // Если индекс массива snake.tails равен 0 тогда мы красим его в #FA0556.
context.fillStyle = "#FA0556";
} else { // Иначе красим его в #A00034
context.fillStyle = "#A00034";
}
context.fillStyle = '#fa0556' // из-за этой строки тот код что сверху бесполезен.
context.fillRect(el.x, el.y, grid, grid); // el.x - позиция элемента (блока хвоста) по X. el.y - тоже что и el.x но позиция по Y
});
