Если вы пришли к JavaScript из такого языка, как Java, возможно, вы знакомы с такими терминами, как объектно-ориентированное программирование (ООП), классы и наследование. Однако, если вы, как и я, новичок в мире реальных языков ООП, таких как C++, Java и C#, вам может понадобиться некоторое разъяснение того, что означает ООП в программировании. . Точно так же вам может быть интересно, что такое процедурное программирование и какое место в этой картине занимает JavaScript. Не бойтесь, так как в этой статье мы вместе рассмотрим эти концепции в удобной для новичков манере. Являетесь ли вы опытным программистом или только начинаете, эта статья призвана объяснить ООП и процедурное программирование доступным для всех способом.

Что такое объектно-ориентированное программирование (ООП)?

ООП — это парадигма программирования, в которой данные — это все. Программа разделена на множество небольших сущностей, называемых объектами, а также связанных с ними методов. Объекты содержат данные вместе с присоединенными процедурами для работы с этими данными. В этом широко используемом подходе к программированию данные являются самой важной вещью. Существуют способы хранения, управления и защиты данных с помощью спецификаторов доступа, таких как private, public, protected и т. д.

Языки: Java, C++, C#

Что такое процедурное программирование?

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

Языки: Pascal, Basic, FORTRAN

Понимание парадигм программирования JavaScript: ООП против процедурного программирования

JavaScript — это мультипарадигмальный язык программирования, что означает, что он поддерживает несколько парадигм программирования, включая объектно-ориентированное программирование (ООП) и процедурное программирование.

Поддержка ООП в JavaScript основана на наследовании классов и прототипах объектов. Он имеет ключевое слово class, которое позволяет создавать классы, которые можно использовать для определения объектов. Он также поддерживает наследование за счет использования прототипов объектов, которые позволяют объектам наследовать свойства и методы других объектов. Это означает, что JavaScript можно использовать как язык ООП.

С другой стороны, поддержка процедурного программирования в JavaScript основана на функциях, которые можно использовать для организации кода в более мелкие повторно используемые блоки. Данные передаются функциям в качестве аргументов, а функции могут возвращать значения. Это означает, что JavaScript также можно использовать в качестве языка процедурного программирования.

Таким образом, JavaScript поддерживает парадигмы как ООП, так и процедурного программирования. Выбор используемой парадигмы зависит от конкретных потребностей разрабатываемой программы.

Давайте подробно обсудим объектно-ориентированное программирование в JavaScript.

Объектно-ориентированное программирование (ООП) в JavaScript

JavaScript поддерживает ООП через прототипы, которые по сути являются объектами, служащими шаблоном для других объектов. Прототипы в JavaScript допускают наследование, инкапсуляцию и полиморфизм, которые являются ключевыми принципами ООП. Что ж, вы также можете использовать JavaScript OOP, используя классы ES6, представленные для имитации классического поведения OOP, которое в изобилии встречается в настоящих языках OOP, основанных на классах, таких как Java, C# и т. д.

ООП прототипного наследования

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

В прототипном ООП объекты наследуют свойства и поведение своих прототипов. Рассмотрим этот пример ниже, мы можем создать новый объект из объекта-прототипа, используя метод Object.create();

Откуда взялось это nameсвойство объекта child? Ну, это исходит от его прототипа, которым в нашем случае является родительский объект.

Доступ к прототипу объектов можно получить с помощью свойства __proto__.

Цепочка прототипов

Зачем останавливаться здесь? Давайте создадим еще один объект, используя тот же метод, но теперь мы будем использовать дочерний объект в качестве прототипа.

Вы знаете, как это сделать, верно? Именно, используя методObject.create().

Вы можете проследить серию цепочек прототипов в той последовательности, в которой мы их задали. Давайте теперь посчитаем, родительский объект наследуется от прототипа объекта default, child наследуется от parent. Верно? Почти. child наследуется от прототипа объекта parent и default. И точно так же объект grandchild наследует их все по цепочке. Ты мне не веришь, да? Взгляни:

Как видите, само grandchild содержит только свойство city, тогда откуда берутся остальные свойства, наследованиеmate, наследование.

Собственные свойства против унаследованных свойств

Вы можете не знать о лице до сих пор, что свойства объекта могут быть двух типов. Собственные свойства и свойства, которые объект наследует от своих прототипов. Приведенный выше пример grandchild имеет только одно свойство, city, а остальные он наследует от своих прототипов по цепочке. Вот видишь, ошибки нет. Это связано с тем, что синтаксический анализатор JavaScript ищет свойство или метод в объекте и, если не находит, начинает просматривать цепочку прототипов один за другим. В связи с этим вы можете перезаписать определенные свойства в объекте.

Методы объектно-ориентированного программирования в JavaScript

В JavaScript существует несколько способов реализации объектно-ориентированного программирования (ООП). Три основных подхода:

Функции конструктора и прототипы:

Это наиболее традиционный способ реализации ООП в JavaScript. Функции-конструкторы используются для создания новых экземпляров объекта, а прототипы используются для совместного использования методов и свойств среди экземпляров.

Заводские функции:

Этот подход предполагает создание функций, которые возвращают новые объекты. Фабричные функции можно использовать для создания нескольких экземпляров объекта с разными свойствами и методами. Этот подход полезен, когда мы хотим создавать объекты с разными конфигурациями.

Функция factory очень похожа на функцию Constructor с несколькими отличиями;

  1. Вы должны явно вернуть сконфигурированный объект.
  2. Вы не можете установить объект-прототип

Классы ES6 (подход OPP на основе псевдоклассов)

С введением ES6 (ECMAScript 2015) JavaScript теперь имеет синтаксис классов, аналогичный традиционным языкам ООП. Но внутри классы JavaScript по-прежнему используют прототипы для наследования. Классы предоставляют способ определить схему создания объектов со свойствами и методами.

Синтаксис создания класса в ES6 следующий:

Теперь взгляните на этот пример, мы создаем класс, который определяет набор свойств и методов, которые будут иметь объекты, созданные из него.

Теперь, если вы попытаетесь проверить один из этих созданных объектов;

Вы можете видеть, что Object был создан с использованием схемы класса Car. И вы также можете видеть, что метод getFullDescription также присутствует в прототипе каждого созданного объекта.

Особенности класса ES6 по сравнению с традиционными подходами на основе классов

Мы уже обсуждали несколько особенностей ООП на основе классов в Java выше, Наследование и Инкапсуляция. Давайте попробуем сравнить его с подходом JavaScript на основе классов.

Наследование

Классы ES6 также поддерживают наследование, что позволяет создавать новый класс на основе существующего класса. Это полезно, когда вы хотите повторно использовать код из существующего класса или создать более специализированный класс. Чтобы наследовать от класса, вы используете ключевое слово extends. Вот пример:

Давайте создадим подкласс для спортивных автомобилей из приведенного выше класса Car;

Как видите, созданный объект ferrari является экземпляром классов Car и SportsCar , поскольку SportsCar наследуется от экземпляра Car.

Это было наследование, теперь давайте перейдем к инкапсуляции, которая является еще одной важной функцией в ООП.

Инкапсуляция

Инкапсуляция — фундаментальная концепция объектно-ориентированного программирования, добавляющая дополнительный уровень конфиденциальности и контролирующая доступ к свойствам и методам этого объекта извне.

В классах JavaScript ES6 инкапсуляция достигается за счет использования модификаторов доступа private, protected и public. Эти модификаторы доступа контролируют видимость и доступность свойств и методов внутри класса.

Закрытые свойства и методы. Закрытые свойства и методы доступны только внутри класса, в котором они определены. Они обозначаются символом # перед их именами. Вот пример:

Защищенные свойства и методы. Защищенные свойства и методы доступны в классе, в котором они определены, а также во всех подклассах, наследуемых от этого класса. Они обозначаются символом _ перед их именами. Вот пример:

Общедоступные свойства и методы. Общедоступные свойства и методы доступны из любого места как внутри класса, так и за его пределами. Они не обозначаются никаким символом. Вот пример:

В приведенном выше примере свойства ширины и высоты, а также метод getArea общедоступны и доступны из любого места.

Подведение итогов

Я надеюсь, что вы нашли это руководство полезным. Если у вас есть какие-либо вопросы или вы нашли что-то непонятное, сообщите мне, чтобы я мог улучшить будущие руководства. Если вы заметили какие-либо ошибки, пожалуйста, не стесняйтесь указать на них, чтобы я мог исправить их для будущих читателей.

Если вам интересно узнать больше о стеке MERN, я регулярно публикую руководства по этой теме, поэтому обязательно следите за обновлениями.

Спасибо за чтение и берегите себя. Заботиться! ❤️”