JavaScript Классы введение
ECMAScript 2015, также известный как ES6, представил классы JavaScript.
Классы JavaScript - это шаблоны для объектов JavaScript.
Синтаксис класса JavaScript
Используйте ключевое слово class для создания класса.
Всегда добавляйте метод с именем constructor():
Синтаксис
class ClassName {
constructor() { ... }
}
Пример
class Car {
constructor(name, year) {
this.name = name;
this.year = year;
}
}
В приведенном выше примере создается класс с именем "Car".
Класс имеет два начальных свойства: "name" и "year".
Класс JavaScript не является объектом.
Это шаблон для объектов JavaScript.
Использование класса
Когда у вас есть класс, вы можете использовать его для создания объектов:
В приведенном выше примере класс Car используется для создания двух объектов Car.
Метод конструктора вызывается автоматически при создании нового объекта.
Метод конструктора
Метод конструктора - это особый метод:
- У него должно быть точное название "constructor"
- Выполняется автоматически при создании нового объекта
- Он используется для инициализации свойств объекта
Если вы не определите метод конструктора, JavaScript добавит пустой метод конструктора.
Методы класса
Методы класса создаются с тем же синтаксисом, что и методы объекта.
Используйте ключевое слово class для создания класса.
Всегда добавляйте constructor() метод.
Затем добавьте любое количество методов.
Синтаксис
class ClassName {
constructor() { ... }
method_1() { ... }
method_2() { ... }
method_3() { ... }
}
}
Создайте метод класса с именем "age", который возвращает год автомобиля:
Пример
class Car {
constructor(name, year) {
this.name = name;
this.year = year;
}
age() {
let date = new Date();
return date.getFullYear() - this.year;
}
}
let myCar = new Car("Ford", 2014);
document.getElementById("demo").innerHTML =
"My car is " + myCar.age() + " years old.";
Вы можете отправлять параметры в методы класса:
Пример
class Car {
constructor(name, year) {
this.name = name;
this.year = year;
}
age(x) {
return x - this.year;
}
}
let date = new Date();
let year = date.getFullYear();
let myCar = new
Car("Ford", 2014);
document.getElementById("demo").innerHTML=
"My car is
" + myCar.age(year) + " years old.";
Поддержка браузера
В следующей таблице определяется первая версия браузера с полной поддержкой классов в JavaScript:
| Chrome 49 | Edge 12 | Firefox 45 | Safari 9 | Opera 36 |
| Март, 2016 | Июль, 2015 | Март, 2016 | Октябрь, 2015 | Март, 2016 |
Строгое использование
Синтаксис в классах должен быть написан в "строгом режиме".
Вы получите сообщение об ошибке, если не соблюдаете правила "строгого режима".
Пример
В "строгом режиме" вы получите ошибку, если используете переменную без ее объявления:
class Car {
constructor(name, year) {
this.name = name;
this.year = year;
}
age() {
// date = new Date(); // Это не сработает
let date = new Date(); // Это сработает
return date.getFullYear() - this.year;
}
}
Попробуйте сами »
Дополнительные сведения см. в: Строгом режиме JS.
