Мои первые шаги в создании браузерных 2D игр на чистом JavaScript + Canvas. Часть 1. Прототип

[savostin]

...обработчик будет добавлять эту клавишу в массив this.game.keys. Условие && this.game.keys.indexOf(e.key) === -1 запретит добавлять в массив клавишу, если та уже присутствует в нем. Обработчик события отпускания (keyup) — наоборот, сначала проверяет наличие клавиши в массиве и при ее наличии там — удаляет с помощью метода splice.

А не лучше ли использовать Set?

[Green21]

Неплохая идея.

Автор видео кстати не объяснил, почему мы здесь вообще массив используем. Нельзя ли просто по нажатию/отпусканию клавиши менять скорость игрока ?! Но я так понял это какая-то общепринятая практика.

[AndreyMI]

Чтобы привязаться к игровому времени. На скорости это не так очевидно, а вот со стрельбой становится понятнее, ведь мы можем наспамить 100500 событий выстрела за условные 16мс.

[LyuMih]

Привет)

Игра из статьи с морским коньком не работает на мобилках - клавиши вверх и вниз к тачам не привязаны)

[Green21]

Можете поделиться кусочком кода. Доработаю)

[Ivan_I]

Делал похожую игрушку года 2 назад, базовый вариант реализовал. Кажется когда захотел добавить каких-то фич, не смог тогда решить проблему с большим количеством игровых объектов и расчетом их коллизий. У меня было много циклов, наверное с событиями мало работал. Какой-то архитектурный момент не проработал.

[Green21]

Описали бы в статье. Народ подсказал бы)

[Overdozed]

Возможно будет более практичным использовать Intersection Observer для Collision Detection.

[Green21]

Возможно. Спасибо за идею!

[Green21]

Ну как я понял из оригинального видео - эти интервалы (deltaTime) могут отличаться на разных машинах. Поэтому мы и передаем его в качестве параметра в методы update(). По идее это и есть адаптация. Я думаю в любом случае это можно проверить - адаптируется игра или нет.

Еще в данной статье не было сказано про переменную которая отвечает за игровое время, но в полной версии игры она есть (speed в классе Game). Возможно вы ее имели ввиду. Во второй части напишу про нее.

[Green21]

Да, здесь соглашусь. Т.к. даже чисто математически размерности величин не равны

update() {
        this.x += this.speed;
}

получается мы к координате прибавляем скорость, что не есть правильно. Нужно speed домножить на время.

Спасибо за пояснения!

[vinolga78]

Видела объяснение этой или почти этой игры в ютуб и захотела сделать. Но там все только видео и не было образца кода. По видео, как-то не удобно код писать. Да и на английском всё. Очень обрадовалась, когда наткнулась на это описание. Спасибо вам за проделанную работу. Делала по вашей инструкции, но попадаются непонятные вещи для новичка. Бывает пропущено, что куда вставлять. Прямоугольник остался желтым почему-то, враги не появились. Потом решила скачать ваш готовый проект с гитхаба, а он а некоторых участках кода отличается, от того что здесь написано. Было бы здорово, усовершенствовать объяснение, сделать более подробным и код хотелось бы, чтобы был похож на тот, который работает. Если будет время, конечно, а то начинающему трудно допетрить до некоторых вещей.