this - это объект, которому принадлежит метод при вызове метода
Давайте создадим объект с методом, увеличивающим число:
const calc = {
num: 0,
increment() {
console.log(this === calc); // => true
this.num += 1;
return this.num;
}
};
// в вызове метода this - это calc
calc.increment(); // => 1
calc.increment(); // => 2
Вызов calc.increment() делает контекст функции increment равным calc. Таким образом, использование this.num для увеличения числа работает должным образом.
Давайте рассмотрим другой случай. Объект JavaScript наследует метод от своего прототипа. Когда унаследованный метод вызывается для объекта, контекст вызова по-прежнему является самим объектом:
const myDog = Object.create({
getName() {
console.log(this === myDog); // => true
return this.name;
}
});
myDog.name = 'Бобик';
// в вызове метода this - это myDog
myDog.getName(); // => 'Бобик'
Object.create() создает новый объект myDog и устанавливает его прототип из первого аргумента, наследуя метод getName.
При выполнении myDog.getName(), контекстом вызова будет myDog.
В синтаксисе класса ECMAScript 2015 контекст вызова метода также является самим экземпляром:
class Planet {
constructor(name) {
this.name = name;
}
getName() {
console.log(this === earth); // => true
return this.name;
}
}
const earth = new Planet('Земля');
// в вызове метода this - это earth
earth.getName(); // => 'Земля'