Класи JavaScript - Блог ITVDN
ITVDN: курси програмування
Відеокурси з
програмування

Вибери свою IT спеціальність

Підписка

Класи JavaScript

advertisement advertisement

Введение

Несмотря на то, что в JavaScript нет классов, этот язык представляет концепции объектно-ориентированного программирования.


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

  • Объекты класса;
  • Конструктор;
  • Закрытые члены;
  • Открытые/ общедоступные члены;
  • Статические члены;
  • Наследование.

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

Объекты класса

var Person = function () { };

var person1 = new Person();

var person2 = new Person();

console.log(person1 instanceof Person);  // true

console.log(person2 instanceof Person); // true

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

Конструктор

var Person = function (firstName) {

    this.firstName = firstName;

    console.log('Instance created');

};

var person1 = new Person("Foo"); // logs "Instance created"

var person2 = new Person("Bar"); // logs "Instance created"

console.log('person1 is ' + person1.firstName); // logs "Foo"

console.log('person2 is ' + person2.firstName); // logs "Bar"

Определение функции действуют как конструктор класса Person. Аргумент функции – это параметр, переданный конструктору при создании объекта. Используя ключевое слово this, мы можем инициализировать атрибуты класса, например firstName.

Закрытые члены

var Person = function (firstName) {

    var firstName = firstName;

};

var person1 = new Person("Foo");

var person2 = new Person("Bar");

person1.firstName; // undefined

person1.firstName; // undefined

Область видимости firstName, находясь внутри функции Person, ограничена. Идеальный способ доступа и управление закрытыми членами класса реализуется с помощью функции accessor, похожей на setter() и getter() в Java. 

var Person = function (firstName) {

    var firstName;

};

Person.prototype.setFirstName = function (firstName) {

    this.firstName = firstName;

}

Person.prototype.getFirstName = function () {

    return this.firstName;

}

var person1 = new Person();

var person2 = new Person();

person1.setFirstName('Foo');

person2.setFirstName('Bar');

person1.getFirstName(); // Foo

person2.getFirstName(); // Bar

Публичные члены 

var Person = function (firstName) {

    this.firstName = firstName;

};

Person.prototype.sayHello = function () {

    console.log(this.firstName + ' says Hello!');

}

var person1 = new Person("Foo");

var person2 = new Person("Bar");

person1.sayHello(); // logs "Foo says Hello!"

person2.sayHello(); // logs "Bar says Hello!"

firstName и sayHello  – публичные члены класса Person. Они доступны и могут быть использованы вне определения функции. 

Статические члены

var Person = function () { }

Person.firstName = "First Name";

var person1 = new Person();

console.log(person1.firstName); //logs undefined

console.log(Person.firstName); //logs "First Name"

Статические члены класса доступны с className, на них невозможно воздействовать объектами класса.

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

var Person = function (firstName) {

    this.firstName = firstName;

};

Person.prototype.sayHello = function () {

    console.log("Hello, I'm " + this.firstName);

};

var Student = function (firstName, subject) {

    Person.call(this, firstName);

    this.subject = subject;

};

Student.prototype = Object.create(Person.prototype);

Student.prototype.constructor = Student;

var student1 = new Student('Foo', 'Math');

student1.sayHello();   // "Hello, I'm Foo"

console.log(student1 instanceof Person);  // true

console.log(student1 instanceof Student); // true

Student дочерний класс класса Parent, он автоматически наследует все члены родительского класса. Мы делаем определенный вызов конструктору родительского класса, используя Person.call и убеждаемся, что прототип наследуется от Person. Этот тип наследования называется прототипным.

Использование данных элементов в модуле JavaScript улучшит Ваш код и сделает его модульным.

Источник : http://pankajparashar.com/posts/javascript-classes/

КОМЕНТАРІ ТА ОБГОВОРЕННЯ
advertisement advertisement

Купуй передплатуз доступом до всіх курсів та сервісів

Бібліотека сучасних IT знань у зручному форматі

Вибирай свій варіант підписки залежно від завдань, що стоять перед тобою. Але якщо потрібно пройти повне навчання з нуля до рівня фахівця, краще вибирати Базовий або Преміум. А для того, щоб вивчити 2-3 нові технології, або повторити знання, готуючись до співбесіди, підійде Пакет Стартовий.

Стартовий
  • Усі відеокурси на 3 місяці
  • Тестування з 10 курсів
  • Перевірка 5 домашніх завдань
  • Консультація з тренером 30 хв
59.99 $
Придбати
Преміум Plus
  • Усі відеокурси на 12 місяців
  • Тестування з 24 курсів
  • Перевірка 20 домашніх завдань
  • Консультація з тренером 120 хв
  • Завантаження відео уроків
199.99 $
Придбати
Базовий
  • Усі відеокурси на 6 місяців
  • Тестування з 16 курсів
  • Перевірка 10 домашніх завдань
  • Консультація з тренером 60 хв
89.99 $
Придбати
Notification success