Изучил связку объекты <-> конструкторы. Потратил на всё примерно 8 часов времени, причём всё разом, не разбивая на вечера. Сейчас я могу себе это позволить, поскольку взял отпуск до нового года. Тема для меня сложная, поэтому достаточное количество неразрывного времени очень помогло.
Для тех, кто не знает, что такое Объектно-Ориентированное Программирование (сокращённо ООП), процитирую книгу "JavaScript для детей": "...это способ проектирования и написания кода, когда все важные части программы являются объектами". Как я это вижу, если простыми словами - это программа, в которой объектами манипулируют алгоритмы.
Объектов в программе может быть много. Для упрощения создания однотипных объектов в JavaScript используются конструкторы. Конструктор, как я это понимаю, - это функция - прототип, своего рода универсальный шаблон. Принято конструкторы называть с большой буквы, например: let Animal = function(){...}; . Чтобы создать объект, используя конструктор, нужно переменной присвоить конструктор с параметрами, используя оператор new. Например: let dog = new Animal(); . Если объект содержит функцию, то её называю методом этого объекта, к нему можно обратиться используя точку, например: dog.bark(); . Т.е. bark - это метод, он же функция внутри объекта. Чтобы переменные внутри конструктора были уникальными для каждого созданного объекта, их записывают используя this. Например: this.car или this.cat. Для демонстрации работы конструктора я написал примитивный калькулятор. Код выглядит так:
Калькулятор, который умеет только складывать и умножать - это скучно. :) Чтобы стало веселее, я на основе упражнений из книги "JavaScript для детей" сделал программу - "Гонки". Она демонстрирует возможность использования ООП для создания анимации. Кроме того, в ней использовано свойство всех конструкторов - prototype. Благодаря этому свойству можно добавлять новые методы к конструкторам, не переписывая сам конструктор. Синтаксис: Animal.prototype.bark = function(){...};. Программа снабжена подробными комментариями. Скачать её можно с GitHub, вот ссылка:
https://github.com/paltus-pangasius-zubatka/aquarium/blob/master/car_race
Суть игры - угадать какая машина приедет на финиш первой.
PS: Программа - это обычный HTML файл, т.е., чтобы запустить её, нужно просто сохранить текст с GitHub на диск с расширением .html, затем открыть получившийся файл в браузере. Программа использует jQuery и содержит ссылку на внешний графический файл с изображением автомобиля, поэтому для её работы необходим интернет.