README.md

Работа с отладкой в браузере

Перед началом работы

Ознакомьтесь с базовыми возможностями отладки в браузере Google Chrome. Ссылка на туториал.

Ознакомьтесь с функциональностью проекта. Ссылка на описание проекта.

Практическое задание

Целью задания является практическое ознакомление с отладкой кода. Необходимо на практике разобраться как выполняется реализованный код. Сам код доделывать не нужно. Всё готово. Необходимо только "поковырять" его и посмотреть как он работает по шагам.

• Запустите файл index.html
• Найдите начало выполнения кода
• Поставьте точку останова (breakpoint) внутри функции play.
• Изначально вы не остановитесь на точке останова, так как выполнение кода уже выполнилось и все действия закончились. Поэтому обновите страницу, чтобы остановится на остановленной точке
• Переходите к следующей конструкции по шагам. (на кнопку F10). Если других точек останова нету, то выполнение программы будет выполняться только по циклу.
• Затем поставьте точку останова внутри метода turn на 232 строке.
• Продолжайте такое же выполнение до момента остановки в методе turn.
• Наведите курсор на значение this.playerEnemy. Если у пользователя нету противника, то в вы увидите undefined.
• В таком случае выполнение кода по шагам на F10 или F11 зайдёт внутрь условия на 236 строке. После выполнения условия у бойца должен появиться противник. Если выполнять на F11 с заходом внутрь функции, то можно увидеть вход в метод chooseEnemy и процесс выбора противника.
• Добавьте в панель Watch текущего воина: this
• Из панели Watch измените скорость воина (свойство speed)
• Из панели Scope измените прочность оружия у воина (свойство durability у объекта weapon)
• В отображаемом окне уменьшите количество здоровья у выбранного противника. Выставите любое значение.
• Откройте вкладку консоль и смените оружие у противника на нож. Для этого введите this.playerEnemy.weapon = new Knife()
• Командой перехода внутрь конструкции попробуйте как-можно глубже продвинуться по выполнению кода. Выполняйте код по шагам до нескольких методов внутрь, что бы понять как заполняется Call Stack.
• Поставьте точку останова в методе isDead()
• Добавьте условие для срабатывания точки останова: воин должен быть мёртв. Тоесть количество его здоровья равно нулю: this.life == 0
• Продолжите выполнение пока не остановитесь в условной точке. Которую создали не предыдущем шаге.
• Убедитесь, что данный воин мёртв. Для этого в консоли введите this, разверните объёкт и убедитесь, что значение свойства life равно нулю
• Воскресите воина, исправив ему значение жизней (двойным кликом на значении свойства измените значение)
• В панеле Breakpoints выключите все точки останова и продолжите выполнение
• Из консоли запустите битву с другими пользователями. Для этого в консоли выполните функцию play и передайте в неё массив с персонажами, аналогично тому, как вызывается функция в коде.