Заявление об ограничении ответственности: я не являюсь экспертом по JavaScript. Я просто делюсь своим опытом обучения с использованием ключевого слова this. Итак, приступим.

Просто запомните эту строку

Для всех обычных вызовов функций this указывает на объект окна.

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

Пример 1:

// Let's define our function first
function sayHello() {
    console.log("Hello Reader!");
}
// Now let's call our function
sayHello();  
// This type of function call is called Regular Function call.
Output:
Hello Reader!

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

Пример 2:

// Defining our function
function funcGenerator() {
    return function() {
      console.log("Hello Reader");
    }
}
// Assigning a variable to a returned function
let generatedFunction = funcGenerator();
//Regular Function call
generatedFunction(); 
Output:
Hello Reader!

В этом примере у нас есть функция, которая возвращает функцию. Итак, мы можем присвоить переменную возвращаемой функции и вызвать эту функцию с этой переменной.

Теперь вернемся к ключевому слову this.

this ключевое слово - это просто ключевое слово в JavaScript, которое относится к объекту.

console.log(this);

Если вы просто попытаетесь запустить только одну строку кода в консоли или узле браузера, ключевое слово this будет относиться к глобальному объекту, то есть объекту окна в браузере и пустому объекту в узле.

var user = {
  firstName: "Arteev",
  lastName: "Raina",
  printName: function() {
       console.log(this);
   }
}
user.printName();
Output:
Object { 
  firstName: "Arteev", 
  lastName: "Raina", 
  printName: printName() 
}

Помните, что user.printName(); - это не обычный вызов функции. Таким образом, ясно одно: this не будет относиться к глобальному объекту, но что теперь? Куда следует this сослаться?

В этом случае this будет относиться к владельцу метода printName(), то есть user объекта. Следовательно, объект user регистрируется на консоли.

Поскольку в этом случае ключевое слово this относится к объекту пользователя, это означает, что мы можем получить свойства объекта пользователя с помощью ключевого слова this, такого как user.firstName, теперь мы можем написать this.firstName.

Теперь давайте напечатаем наше имя. Я печатаю свой, вы пытаетесь распечатать свой.

var user = {
  firstName: "Arteev",
  lastName: "Raina",
  printName: function() {
      console.log(this.firstName + " " + this.lastName);
   }
}
user.printName();
Output:
Arteev Raina

Теперь давайте рассмотрим еще один пример, чтобы прояснить наше понимание.

var testObject = {
  printThis: function() {
       return function() {
           console.log(this);
       }
    }
}        
var func = testObject.printThis();
func();
Output:
Window Object in Browser
        (or)
Empty Object in Node

Вам должно быть интересно, почему this имеет в виду window object. Почему не говорится о testObject. Но вот то, что мы вызываем функцию, которая возвращает другую функцию, и мы сохраняем эту функцию в переменной func, а затем вызываем func(), который снова является вызовом регулярной функции, а в вызовах регулярной функции это ключевое слово относится к объекту окна. Объект, стоящий перед точкой, - это то, к чему будет привязано ключевое слово this.