Как новичок в JavaScript, я был впечатлен долговечностью этого языка.

По данным W3techs.com — JavaScript используется в качестве клиентского языка программирования на 97,9% всех веб-сайтов. Он не показывает никаких признаков замедления с новыми изменениями, внесенными в ECMAScript 2015, также известный как ES6.

Каждую неделю я углубляюсь в безграничные возможности JavaScript и в то, как извлечь из него максимальную пользу. Недавно я наткнулся на очень интересную тему «Объектно-ориентированное программирование» или сокращенно «ООП».

ООП был представлен Аланом Кеем в середине 1960-х годов, вдохновленным приложением Sketchpad Ивана Сазерленда. С тех пор многие из наиболее широко используемых языков программирования поддерживают ООП: Java, C++, C#, Python, R, PHP, Visual Basic.NET, JavaScript, Ruby, Perl, SIMSCRIPT, Object Pascal, Objective-C, Dart, Swift, Scala, Kotlin, Common Lisp и MATLAB.

Ключевые принципы ООП:

  • Инкапсуляция (связывание данных и кода вместе для защиты от внешнего вмешательства)
  • Абстракция (извлечение релевантных данных из большего набора)
  • Наследование (сохранение свойств другого объекта)
  • Полиморфизм (процесс выполнения одного действия несколькими способами)

Если вы думаете, что это слишком много для новичка, вы правы! Вот почему я решил поближе взглянуть на то, как объектно-ориентированное программирование используется в JavaScript.

Вскоре я обнаружил, что у ООП есть очень полезная функция — возможность создавать «классы». Классы — это конструкторы для создания объектов из многократно используемых шаблонов или «чертежей».

Это сравнение помогло упростить вещи, но заставило меня искать лучшую аналогию. Что-то, что может коснуться каждого…

Печенье!

Не тот, который можно найти на веб-сайтах, а тот, который вы едите. Существует много сильных мнений о классах в JavaScript, часто объявляющих это обозначение чисто «синтаксическим сахаром». Вот что побудило меня сделать это сладкое сравнение. Для меня нет ничего более родственного, чем печенье!

Если вы разберете процесс создания классов, то вскоре обнаружите, что они очень похожи на процесс выпечки печенья:

Формочки для печенья становятся шаблоном для штамповки рыхлых предметов. Формы абстрагируются от большого развернутого листа, наследуя свойства выбранного микса. Вкусные угощения, конечно же, нужно приготовить, что можно сделать разными способами — в духовке, на плите, нагреть во фритюрнице и даже запечь в тостере. Наконец, вы кладете каждое печенье в отдельный пакет, защищенный от постороннего вмешательства (например, от домашних животных или соседей по комнате).

Базовый класс можно записать так:

Создайте экземпляр класса «Cookie», используя ключевое слово «new»:

Каждый экземпляр, который вы создаете, становится самостоятельным:

oatmeal === ChocolateChip (возвращает false)

Чтобы сделать наши файлы cookie более уникальными, мы можем создать их с помощью специального метода «конструктора»:

Мы можем использовать метод конструктора, чтобы испечь новую партию файлов cookie, которые возвращают определенные ингредиенты:

Теперь мы можем получить доступ к ингредиентам (свойствам) наших файлов cookie, используя запись через точку:

Каждое печенье имеет свой собственный вкус, но как конструктор делает это? Конечно же, используя специальное ключевое слово «это»!

Два ингредиента (аргумента) передаются и назначаются с помощью «this»:

«Это» — так наши объекты cookie относятся к самим себе. Когда мы используем конструкторы для создания нового файла cookie, «это» относится к файлу cookie, который мы только что создали.

Когда мы назначаем this.icing и this.filling нашим свойствам конструктора, мы теперь можем ссылаться на них как на свойства другими методами в нашем классе:

Как видите, представление о классах в JavaScript как об индивидуально упакованных файлах cookie — отличная метафора. Объектно-ориентированное программирование дает нам возможность стандартизировать как данные, так и объекты в самых разных средах программирования k̶i̶t̶c̶h̶e̶n̶s̶.

В следующий раз, когда вы окажетесь в отделе файлов cookie, найдите минутку, чтобы оценить, сколько существует вариантов простого «класса файлов cookie». Вскоре вы начнете понимать, что эта аналогия не так уж и несовершенна.

Источники:

https://www.w3schools.com/js/js_classes.asp#:~:text=ECMAScript%202015%2C%20also%20known%20as%20ES6%2C%20introduced%20JavaScript%20Classes.





https://2020.stateofjs.com/en-US/