Вступление

Нет сомнений в том, что популярность JavaScript резко возросла за последние несколько лет, и он быстро становится языком выбора не только для кода на стороне клиента, но и на стороне сервера. Я никогда не был большим поклонником JavaScript, он просто казался слишком беспорядочным и излишне запутанным. Хотя я все еще верю, что кое-что из этого правда, по большей части это было просто неправильным пониманием языка и нетерпимостью к отсутствию определенных функций / синтаксиса (например, традиционных классов).

С выпуском ES6 JavaScript, похоже, больше движется к языку, который я лично хочу, чтобы он был, с добавлением классов традиционного стиля, генераторов, итераторов, встроенных обещаний и многих других функций. Лично я считаю, что это облегчит переход разработчиков с других языков, таких как Java (как и я), Python и C ++. Изучение JavaScript открывает гораздо больше возможностей для разработчиков, позволяя им писать код практически для любой платформы, которую вы хотите (на стороне браузера, на стороне сервера через Node / io.js , мобильные приложения через React Native и даже настольные приложения. ).

Следите за новыми функциями ES6 и ES7, все они есть не зря и решают некоторые большие проблемы для разработчиков, например, справиться с адом обратных вызовов .

В этой статье я рассмотрю особенности и предостережения классов ES6.

Классы ES6

Итак, приступим к делу. Вот самое необходимое для создания класса ES6:

 class Animal {} 
 
 var a = new Animal(); 

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

 var Animal = class { 
 constructor(name) { 
 this.name = name; 
 } 
 }; 

Это эквивалентно анонимным классам в Java, где вы одновременно определяете и создаете экземпляр класса.

Отсюда мы можем добавить файл properties. Для этого мы должны определить их внутри конструктора, а не вне его, как того требует Java.

 class Animal { 
 constructor() { 
 this._name = 'cow'; 
 } 
 } 
 
 var a = new Animal(); 
 console.log(a._name); // Prints 'cow' 

Чтобы получить доступ или изменить эти данные, мы можем определить методы получения и установки:

 class Animal { 
 constructor(n) { 
 this._name = n; 
 } 
 
 get name() { 
 return this._name; 
 } 
 
 set name(n) { 
 this._name = n; 
 } 
 } 
 
 var a = new Animal('cow'); 
 console.log(a.name); // Prints 'cow' 
 a.name = 'cat' 
 console.log(a.name); // Prints 'cat' 

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

 class Animal { 
 constructor(n) { 
 this._name = n; 
 } 
 
 get name() { 
 return this._name; 
 } 
 
 set name(n) { 
 this._name = n; 
 } 
 
 fullName() { 
 return 'holy ' + this._name; 
 } 
 
 static className() { 
 return 'Animal'; 
 } 
 } 
 
 var a = new Animal('cow'); 
 console.log(Animal.className()); // Prints 'Animal' 
 console.log(a.fullName()); // Prints 'holy cow' 

Для разработчиков Java и C # это должно показаться знакомым. У нас есть традиционные методы и статические методы, как и во многих других языках.

Пока что показанные мною функции не добавляют в JavaScript слишком много того, чего мы не могли сделать раньше. Настоящая полезность классов ES6 реализуется, когда мы используем наследование с ключевым словом extends Эта функция была доступна раньше, но вам приходилось иметь дело с prototype и использовать util.inherits , что было немного неудобно и было не очень понятно для начинающих разработчиков JS. Теперь мы можем сделать что-то вроде этого:

 class Dog extends Animal { 
 constructor() { 
 super('dog'); 
 } 
 
 fullName() { 
 return 'snoop ' + this._name; 
 } 
 
 static className() { 
 return 'Dog'; 
 } 
 } 
 
 var d = new Dog(); 
 console.log(Dog.className()); // Prints 'Dog' 
 console.log(d.fullName()); // Prints 'snoop dog' 

Этот синтаксис и поведение должны быть понятными и достаточно интуитивно понятными, чтобы большинство разработчиков могли сразу погрузиться в них. Кроме того, они также должны значительно облегчить изучение JS для большего числа начинающих программистов.

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

 var a = new Animal(); // ReferenceError! 
 class Animal {} 

С другой стороны, функции можно использовать до того, как они будут определены.

Заключение

Хотя большая часть этой функциональности всегда была доступна, я считаю, что это огромный шаг к тому, чтобы сделать JS более удобным для пользователя. Синтаксис и простота использования являются огромным фактором в принятии языка, поэтому это, вероятно, еще больше повысит популярность JS.

Что вы думаете о новых классах ES6? Дайте нам знать, что вы думаете, в комментариях!