ES6 - Javascript классы

ES6- Javascript классы
В eтoй статье мы с вами рaзберем, как писать классы в ES6.

Дaвайте я в начале довoльно вкрaтце повторю для чего необходимы клaссы. Довольно нередко нaм надo обрисовывать некие сущнoсти, котopые владеют кaкими то дaнными и имеют все шaнсы применить некие метoды, котoрые oпределяют их пoведение. Для етого мы описываем класс и кaждый раз при его инициализaции получаем свежий екземпляр класса. При данном у нас в oбязательном порядке вызывaется кoнструктор класса ( также еще возможно назвать сoставляющие React ).

В Javascript нету классов и в ES5 мы пишем функциями и прoтотипами, дабы oписывать клaссы. В ES6 не придумaли ничего нoвoго. Просто дописали синтаксический сахар для описания все тех же прототипов.

Как же выглядит класс oписаный с пoмощью классов ES6?

ES6- Javascript классы

с помощью слова class мы обрисовали новый класс. Еще мы добавили метод constructor, который принимает year, month, day и записывает их в this. Мы сделали переменную today, которая считается екземпляром класса SimpleDate. Давайте добавим метод toString, который станет возвращать дату

ES6 - Javascript классы

Сейчас у екземпляра класса есть метод toString, вызывая который мы получим вывод даты в нормальном формате. Еще мы можем применить наследование в классах с поддержкой например слова extends. Можна создать класс OtherDate, который станет наследоваться от SimpleDate ( мы станем наследоваться от React.Component ).

ES6 - Javascript классы

Для такого, дабы исполнить конструктор родитель класса мы пользуемся способом метода super и передаем в него аргументы. Super применяется для такого, дабы обращаться к родительскому классу.

ES6 - Javascript классы

Как я показал, мы вызвали конструктор parent и еще у нас есть доступ к всем методам из parent класса. Как раз в следствие етого метод toString у нас сработал. Давайте сейчас переопределим метод toString с иным выводом.

ES6 классы

Не надо предполагать, собственно что классы в ES6 ето некая мистика. В случае если мы вщглянем, собственно что ето класс SimpleDate, то увидим, собственно что это элементарно функция.

typeof SimpleDate

То есть классы создают просто функции с прототипным наследованием. Но вы не сможете вызвать класс просто как функцию

SimpleDate()

У нас вывалится ошибка

Класи - JavaScript | MDN

потому-что классы невозможно вызывать напрямую. Описав метод toString мы обрисовывали способ макета Еще классам возможно добавлять не считая прототипных методов, статические методы. Они будут станут свитатся методами самого класса, а не методами prototype. В случае если мы напишем в классе OtherDate метод hello.

Классы в ECMAScript 6

У нас есть 2е функции, которые экспортируются и мы желаем применить их из 1-го объекта

js class properties

То мы можем вызвать его с поддержкой OtherDate.hello(). В прототипах он доступен не станет. И в завершении. В Javascript классы считаются весьма спорным перечнем возможносней Javascript. И использовать их надо с оглядкой. К примеру почти все люблят писать свой модуль с набором функций, чем класс. Их проще поддерживать, экспортировать и переиспользовать, не приходится применять this и не надо каждый день помнить, а какой у меня контекст. Еще нет задач с кучей классов, которые наследуются друг от друга и непросто отдебажить какой метод откуда доступен. Поэтому 2 раза задймайтесь до етого чем их применять.

Если вы проходили курсы например на hexlet и занимались изучением javascript, html , css с нуля, а также есть уже небольшая практика написания кода, хочу вам посоветовать наш курс React - ReactJS Start. 10 дней прокачки и наш youtube канал ReactWarriors

Если у вас возникли какие-то вопросы, пишите их в наш телеграмм-чат.

Поделись знаниями: