0Pricing
JavaScript Academy · Урок

Синтаксис классов (обзор): constructor, методы, static, extends

Познакомьтесь с синтаксисом классов: constructor, методы экземпляра, статические вспомогательные методы и простое наследование с extends

«Синтаксис классов (обзор): constructor, методы, static, extends» — бесплатный урок JavaScript Academy на CoddyKit. Это урок 2 из 2. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения JavaScript Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс JavaScript Academy содержит 2 уроков всего.

Введение в синтаксис классов

Цель: понять, как синтаксис классов связан с прототипами.

  • Конструктор для настройки
  • Методы в прототипе
  • Статические вспомогательные функции в классе
  • Наследование для простого расширения
Синтаксис классов (обзор): constructor, методы, static, extends — иллюстрация 1

Конструктор и метод

Конструктор выполняется при создании объекта. Методы в теле класса общие для всех экземпляров и хранятся в прототипе.

// Class with a constructor and an instance method
class Counter {
  constructor(start = 0) {
    // Initialize fields
    this.value = start;
  }

  // Instance method (lives on the prototype)
  inc() {
    this.value = this.value + 1;
    console.log("Now:", this.value);
  }
}

const c = new Counter(1);
c.inc();
c.inc();
Синтаксис классов (обзор): constructor, методы, static, extends — иллюстрация 2

Общие методы прототипа

Методы экземпляра в синтаксисе классов являются методами прототипа, поэтому используется одна и та же функция.

// Prototype sharing demo
class Greeter {
  say(name) {
    console.log("Hello,", name);
  }
}

const g1 = new Greeter();
const g2 = new Greeter();

// Same function reference for both instances
console.log("Same method?", g1.say === g2.say);
Синтаксис классов (обзор): constructor, методы, static, extends — иллюстрация 3

Основы статических методов

Статические методы вызываются у самого класса, а не у его экземпляров.

// Static method: lives on the class, not instances
class MathBox {
  static double(n) {
    return n * 2;
  }
}

console.log("Static call:", MathBox.double(4));

const m = new MathBox();
// @ts-ignore (conceptually): next line would be undefined in JS
console.log("Instance has static?", typeof m.double);
Синтаксис классов (обзор): constructor, методы, static, extends — иллюстрация 4

Простое наследование

Наследование выстраивает цепочку прототипов; для вызова метода родительского класса используйте обращение к родительскому классу.

// Inheritance with extends and super
class Animal {
  speak() {
    console.log("...");
  }
}

class Dog extends Animal {
  speak() {
    // Optionally call parent method
    super.speak();
    console.log("Woof");
  }
}

const d = new Dog();
d.speak();
Синтаксис классов (обзор): constructor, методы, static, extends — иллюстрация 5

Советы по работе с классами

Советы:

  • Делайте классы небольшими: достаточно пары полей и методов.
  • Отдавайте предпочтение методам экземпляра в теле класса: они совместно используются через прототип.
  • Используйте статические методы для чистых вспомогательных функций, не связанных с экземпляром.
Синтаксис классов (обзор): constructor, методы, static, extends — иллюстрация 6

Проверка размещения методов класса

Быстрая проверка: размещение общего метода.

Синтаксис классов (обзор): constructor, методы, static, extends — иллюстрация 7

Повторение

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

Синтаксис классов (обзор): constructor, методы, static, extends — иллюстрация 8

Часто задаваемые вопросы

Урок «Синтаксис классов (обзор): constructor, методы, static, extends» бесплатный?

Да — полный текст урока «Синтаксис классов (обзор): constructor, методы, static, extends» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс JavaScript Academy, подпишись на CoddyKit PRO. Курс JavaScript Academy содержит 2 уроков всего.

Чему я научусь в уроке «Синтаксис классов (обзор): constructor, методы, static, extends»?

Познакомьтесь с синтаксисом классов: constructor, методы экземпляра, статические вспомогательные методы и простое наследование с extends Ты практикуешь JavaScript Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать JavaScript Academy?

Предыдущий опыт не требуется. JavaScript Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 2 из 2.

Сколько времени занимает урок «Синтаксис классов (обзор): constructor, методы, static, extends»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке JavaScript Academy?

Да. Каждый урок JavaScript Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

  1. Цепочка прототипов и основы собственных свойств
  2. Синтаксис классов (обзор): constructor, методы, static, extends
← Назад к JavaScript Academy