Введение в JavaScript Классы

Здравствуйте, будущие маги JavaScript! Сегодня мы отправляемся в увлекательное путешествие в мир JavaScript классов. Не волнуйтесь, если вы никогда не писали ни строчки кода — я буду вашим доброжелательным проводником, и мы будем двигаться шаг за шагом. К концу этого руководства вы будете создавать свои собственные классы, как профессионал!

Что такое JavaScript классы?

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

Давайте начнем с простого примера:

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

makeSound() {
console.log("Животное издает звук");
}
}

В этом примере Animal — наш класс. Это как сказать: "Каждое животное в нашем зоопарке будет иметь имя, вид и способность издавать звук."

Определение JavaScript классов

Чтобы определить класс в JavaScript, мы используем ключевое слово class, за которым следует имя класса. Имена классов обычно начинаются с большой буквы — это не обязательно, но это распространенная конвенция, которая помогает отличить классы от других типов кода.

Метод constructor()

Метод constructor() — это особый метод для создания и инициализации объектов, созданных с помощью класса. Он вызывается автоматически, когда мы создаем новый объект из этого класса.

class Book {
constructor(title, author, year) {
this.title = title;
this.author = author;
this.year = year;
}
}

Здесь title, author и year — это свойства, которые будет иметь каждый объект Book. Ключевое слово this ссылается на объект, который создается.

Создание JavaScript объектов

Теперь у нас есть класс, давайте создадим несколько объектов!

let myBook = new Book("Великий Гэтсби", "Ф. Скотт Фицджеральд", 1925);
console.log(myBook.title); // Выводит: Великий Гэтсби

Ключевое слово new используется для создания нового экземпляра нашего класса Book. Это как сказать: "Эй, JavaScript, пожалуйста, создай для меня новую книгу по этому шаблону Book!"

Методы JavaScript классов

Методы — это функции, которые belong к классу. Они определяют поведение, которое могут выполнять объекты класса.

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

bark() {
console.log(`${this.name} говорит: Гав гав!`);
}

fetch(item) {
console.log(`${this.name} приносит ${item}`);
}
}

let myDog = new Dog("Бuddy");
myDog.bark(); // Выводит: Buddy говорит: Гав гав!
myDog.fetch("мяч"); // Выводит: Buddy приносит мяч

В этом примере bark() и fetch() — это методы класса Dog. Каждый объект Dog, который мы создаем, будет иметь эти способности.

Типы JavaScript классов

JavaScript поддерживает два основных типа классов:

1. Декларация: Это то, что мы использовали до сих пор.

   class Rectangle {
   // тело класса
   }

2. Выражение: Классы также могут быть определены в выражениях.

   let Rectangle = class {
   // тело класса
   };

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

Подъем классов в JavaScript

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

// Это вызовет ошибку
let p = new Rectangle(); // ReferenceError

class Rectangle {}

Всегда определяйте свои классы перед использованием!

斯特RICT Режим с классами

Вот интересный факт: тело класса всегда выполняется в strict mode. Что это означает? Это как если бы у вас был строгий учитель, который не позволяет вам容许马虎的代码。 Например:

class StrictClass {
method() {
undeclaredVariable = 5; // Это вызовет ошибку
}
}

В strict mode вам нужно объявлять свои переменные перед использованием. Это помогает ловить распространенные ошибки кодирования и держать ваш код чистым!

Таблица методов классов

Вот удобная таблица некоторых.common методов, связанных с классами:

Метод	Описание
constructor()	Инициализирует новый экземпляр класса
static	Определяет статический метод для класса
extends	Создает класс как потомка другого класса
super	Вызывает constructor родительского класса
get	Определяет метод для получения значения свойства
set	Определяет метод для установки значения свойства

Заключение

Поздравляю! Вы только что сделали свои первые шаги в мир JavaScript классов. Помните, как и при обучении любому новому навыку, практика делает perfect. Попробуйте создать свои собственные классы — может быть, класс Car с методами startEngine() и drive(), или класс Superhero с методом useSpecialPower().

Классы — это мощный инструмент в JavaScript, который позволяет создавать структурированный, повторно используемый код. Они как кирпичики Lego — простые сами по себе, но способные создавать удивительные вещи, когда их собирают вместе.

Продолжайте программировать, продолжайте учиться, и antes de que te das cuenta, вы будете создавать сложные приложения с легкостью. Счастливого кодирования, будущие разработчики!

Credits: Image by storyset