Классы в JavaScript.

В языке JavaScript класс – это множество объектов, наследующих свойства от общего объекта-прототипа. Таким образом, объект-прототип является центральной особенностью класса.

Создание класса

Для создание класса достаточно объявить имя класса и присвоить ему объект. Синтаксис для классов выглядит так:

class Название [extends Родитель]  {
  constructor
  методы
}

Пример класса:

class User {

  constructor(name) {
    this.name = name;
  }

  sayHi() {
    alert(this.name);
  }

}

let user = new User("Витя");
user.sayHi(); // Витя

Функция constructor запускается при создании new User, остальные методы записываются в User.prototype.

Свойство constructor

Роль конструктора в языке JavaScript может играть любая функция, поскольку выражению вызова конструктора необходимо лишь свойство prototype. Следовательно, любая функция (кроме функций, возвращаемых методом Function.bind()) автоматически получает свойство prototype. Значением этого свойства является объект, который имеет единственное неперечислимое свойство constructor.

Статические свойства

Класс, как и функция, является объектом. Статические свойства класса User – это свойства непосредственно User, то есть доступные из него «через точку». Для их объявления используется ключевое слово static. Например:

class User {
  constructor(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
  }

  static createGuest() {
    return new User("Гость", "Сайта");
  }
};

let user = User.createGuest();

alert( user.firstName ); // Гость

alert( User.createGuest ); // createGuest ... (функция)

Как правило, они используются для операций, не требующих наличия объекта, например – как альтернативные варианты конструктора. Или же, можно добавить метод User.compare, который будет сравнивать двух пользователей для целей сортировки.

Выражение класса

Второй способ определения класса — выражение класса (class expression). С помощью него можно создавать именованные и безымянные классы. В первом случае имя класса находится в локальной области видимости класса. Например:

// безымянный
var Polygon = class {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
};

// именованный
var Polygon = class Polygon {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
};

Наследование классов с помощью extends

Ключевое слово extends используется в объявлениях классов и выражениях классов для создания класса, дочернего относительно другого класса.

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

  speak() {
    console.log(this.name + ' издает звук.');
  }
}

class Dog extends Animal {
  speak() {
    console.log(this.name + ' лает.');
  }
}

var d = new Dog('Митци');
d.speak();

Mix-ins

Абстрактные подклассы, или mix-ins, — это шаблоны для классов. Для реализации mix-ins можно использовать функцию, которая в качестве аргумента принимает родительский класс, а возвращает подкласс, его расширяющий:

var calculatorMixin = Base => class extends Base {
  calc() { }
};

var randomizerMixin = Base => class extends Base {
  randomize() { }
};

 
Поделиться в facebook
Facebook
Поделиться в twitter
Twitter
Поделиться в vk
VK
Поделиться в google
Google+
Поделиться в email
Email

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Группа в VK

Помощь проекту

Обнаружили опечатку?

Сообщите нам об этом, выделите текст с ошибкой и нажмите Ctrl+Enter, будем очень признательны!

Свежие статьи

Похожие статьи

Фреймворк Vue.js

Фреймворк Vue.js

Vue (произносится как view – вью) – это прогрессивный фреймворк для создания пользовательских интерфейсов. Vue позволяет строить приложения с применением архитектурного паттерна MVVM (Model-View-ViewModel). Особенность

 
Фреймворки и библиотеки в JavaScript

Фреймворки и библиотеки в JavaScript

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

 
Знакомство с Ajax.

Знакомство с Ajax.

AJAX расшифровывается как «Асинхронный JavaScript и XML». Под AJAX понимается не одна технология, и она не является новой. На самом деле это группа технологий (HTML,

 
Знакомство с jQuery

Знакомство с jQuery

jQuery — это библиотека JavaScript, в основу которой положено взаимодействие JavaScript и HTML. Она позволяет легко получить доступ к любому элементу DOM, с ее помощью

 

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: