> For the complete documentation index, see [llms.txt](https://oleksandr-khomiak.gitbook.io/javascript/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://oleksandr-khomiak.gitbook.io/javascript/teoriya/kontekst-prototipi-ta-klasi/kontekst-vikonannya-funkciyi.md).

# Контекст виконання функції

Контекст виконання функції в JavaScript визначає, як функція бере дані зі свого оточення для виконання своєї роботи. Цей контекст включає змінні, об'єкти та інші ресурси, доступ до яких є у функції під час її виконання.

Ключове слово <mark style="background-color:red;">this</mark> вказує на поточний об'єкт, з яким пов'язана функція або контекст, у якому вона була викликана. Значення <mark style="background-color:red;">this</mark> залежить від того, як саме була викликана функція.

Значення <mark style="background-color:red;">this</mark> може варіюватися в залежності від наступних сценаріїв:

1. **Метод об'єкта:** Коли функція є методом об'єкта, значення <mark style="background-color:red;">this</mark> вказує на сам об'єкт, до якого вона належить.
2. **Глобальний контекст:** У глобальному контексті в браузері <mark style="background-color:red;">this</mark> вказує на глобальний об'єкт <mark style="background-color:red;">window</mark>, а в середовищі Node.js - на об'єкт <mark style="background-color:red;">global</mark>.

Розглянемо приклад виклику методу, який звертається до даних самого методу:

```javascript
const user = {
  name: "Alex",

  showName() {
    console.log("User name: ", user.name);
  },
};

user.showName(); // User name: Alex
```

Наведений приклад працює, але він синтаксично неправильний.  Всередині об'єктів у методах при зверненні до даних самого обʼєкту використовують  слово <mark style="background-color:red;">this</mark>, де JavaScript замість слова <mark style="background-color:red;">this</mark> ставить імʼя самого обʼєкта.

```javascript
const user = {
  name: "Alex",

  showName() {
    console.log("User name: ", this.name);
  },
};

user.showName(); // User name: Alex
```

Слово  <mark style="background-color:red;">this</mark> - зарезервоване і на його місце підставляється посилання на сам обʼєкт.

Розширимо обʼєкт описавши метод додавання прізвища і його виведення, із використанням ключового слова <mark style="background-color:red;">this</mark>.

```javascript
const user = {
  name: "Alex",

  showName() {
    console.log("User name: ", this.name);
  },

  addSurname(surname) {
    this.surname = surname;
  },

  showSurname() {
    if (!this.surname) {
      console.log("There is no surname!");
    } else {
      console.log("User surname: ", this.surname);
    }
  },
};

user.showSurname(); // There is no surname!
user.addSurname("Khomiak");
user.showSurname(); // User surname: Khomiak
```