JavaScript с нуля

Что помещается в класс

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

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

class Planet {

constructor(name, radius) {

this.name = name;

this.radius = radius;

}

getSurfaceArea() {

let surfaceArea = 4 * Math.PI * Math.pow(this.radius, 2);

console.log(surfaceArea + " square km!");

return surfaceArea;

}

}

Вызовите getSurfaceArea из созданного объекта, чтобы увидеть ее в деле:

let earth = new Planet("Earth", 6378);

earth.getSurfaceArea();

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

class Planet {

constructor(name, radius) {

this.name = name;

this.radius = radius;

}

getSurfaceArea() {

let surfaceArea = 4 * Math.PI * Math.pow(this.radius, 2);

console.log(surfaceArea + " square km!");

return surfaceArea;

}

set gravity(value) {

console.log("Setting value!");

this._gravity = value;

}

get gravity() {

console.log("Getting value!");

return this._gravity;

}

}

let earth = new Planet("Earth", 6378);

earth.gravity = 9.81;

earth.getSurfaceArea();

console.log(earth.gravity) // 9.81

Вот и все. Такое добавление элементов в тело класса хорошо тем, что они не будут существовать в созданном объекте. Вместо этого они будут находиться в прототипе (Planet.prototype), как показано на рис. 20.3.

Рис. 20.3. Нам не нужно делать ничего особенного, чтобы обратиться к объекту-прототипу

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

Почему функции внутри класса выглядят странно?

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

Вместо написания, например, этого:

let blah = {

zorb: function() {

// что-то интересное

}

};

вы можете сократить определение функции zorb до следующего:

let blah = {

zorb() {

// что-то интересное

}

};

Именно такую сокращенную форму вы будете встречать и использовать при определении функций внутри тела класса.