Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix object methods (01-04-04) #696

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -17,13 +17,13 @@ alert( user.ref.name ); // Error: Cannot read property 'name' of undefined

Це тому, що правила, які встановлюють `this`, не розглядають оголошення об’єкта. Важливий лише момент виклику метода.

Тут значення `this` всередині `makeUser()` є `undefined`, оскільки воно викликається як функція, а не як метод із синтаксисом "через крапку".
Тут значення `this` всередині `makeUser()` є `undefined`, оскільки вона викликається як функція, а не як метод із синтаксисом "через крапку".

Значення `this` є одним для всієї функції, блоки коду та літерали об’єктів на це не впливають.

Отже, `ref: this` дійсно бере значення `this` функції.

Ми можемо переписати функцію і повернути те саме `this` зі значенням` undefined`:
Ми можемо переписати функцію і повернути те саме `this` зі значенням `undefined`:

```js run
function makeUser(){
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ importance: 5

Створіть об'єкт `calculator` з трьома методами:

- `read()` запитує два значення та зберігає їх як властивості об’єкта з іменами `a` та `b` відповідно.
- `read()` запитує (з допомогою prompt) два значення та зберігає їх як властивості об’єкта з іменами `a` та `b` відповідно.
- `sum()` повертає суму збережених значень.
- `mul()` множить збережені значення і повертає результат.

Expand Down
18 changes: 9 additions & 9 deletions 1-js/04-object-basics/04-object-methods/article.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,15 +32,15 @@ user.sayHi = function() {
user.sayHi(); // Привіт!
```

Тут ми щойно використали Function Expression (функціональний вираз) для створення функції та присвоїли її властивості `user.sayHi` об’єкта.
Тут ми щойно створили функцію з допомогою Function Expression (функціональний вираз) та присвоїли її у властивість об’єкта `user.sayHi`.

Потім ми викликали її завдяки `user.sayHi()`. Користувач тепер може говорити!

Функція, яка є властивістю об’єкта, називається його *методом*.

Отже, ми отримали метод `sayHi` об’єкта `user`.

Звичайно, ми могли б використовувати попередньо оголошену функцію як метод, наприклад:
Звісно ж, ми могли б використовувати і попередньо оголошену функцію як метод, наприклад:

```js run
let user = {
Expand Down Expand Up @@ -111,7 +111,7 @@ let user = {

sayHi() {
*!*
// "this" -- це "поточний об’єкт"
// "this" - це "поточний об’єкт"
alert(this.name);
*/!*
}
Expand Down Expand Up @@ -181,7 +181,7 @@ function sayHi() {

Значення `this` обчислюється під час виконання і залежить від контексту.

Наприклад, тут одна й та ж функція призначена двом різним об’єктам і має різний "this" при викликах:
Наприклад, тут одна й та ж функція присвоєна двом різним об’єктам і має різний "this" при викликах:

```js run
let user = { name: "Іван" };
Expand All @@ -202,7 +202,7 @@ admin.f = sayHi;
user.f(); // Іван (this == user)
admin.f(); // Адмін (this == admin)

admin['f'](); // Адмін (неважливо те, як звертатися до методу об’єкта -- через крапку чи квадратні дужки)
admin['f'](); // Адмін (неважливо те, як звертатися до методу об’єкта - через крапку чи квадратні дужки)
```

Правило просте: якщо `obj.f()` викликано, то `this` це `obj` під час виконання `f`. Так що в даному прикладі це `user` або `admin`.
Expand All @@ -220,15 +220,15 @@ sayHi(); // undefined

В такому випадку `this` є `undefined` в суворому режимі (`"use strict"`). Якщо ми спробуємо звернутися до `this.name` трапиться помилка.

У несуворому режимі значенням `this` в такому випадку буде *глобальний об’єкт* (`window` у браузері, ми дійдемо до нього пізніше в главі [](info:global-object)). Це -- поведінка, яка склалася історично та виправляється завдяки використанню суворого режиму (`"use strict"`).
У несуворому режимі значенням `this` в такому випадку буде *глобальний об’єкт* (`window` у браузері, ми дійдемо до нього пізніше в главі [](info:global-object)). Це поведінка, яка склалася історично та виправляється завдяки використанню суворого режиму (`"use strict"`).

Зазвичай такий виклик є помилкою програмування. Якщо всередині функції є `this`, вона очікує виклику в контексті об’єкта.
````

```smart header="Наслідки вільного `this`"
```smart header="Наслідки неприв'язаного (англ. unbound) `this`"
Якщо ви прийшли з іншої мови програмування, то ви, мабуть, звикли до ідеї "зв’язаного `this`", де методи, визначені в об’єкті, завжди мають `this`, що посилається на цей об’єкт.

В JavaScript `this` є "вільним", його значення обчислюється під час виклику і не залежить від того, де метод був оголошений, а від того, який об’єкт "перед крапкою".
В JavaScript `this` є "вільним", його значення обчислюється під час виклику і залежить не від того, де метод був оголошений, а від того, який об’єкт "перед крапкою".

Поняття `this`, що визначається в процесі роботи має як плюси, так і мінуси. З одного боку, функцію можна використовувати повторно для різних об’єктів. З іншого боку, більша гнучкість створює більше можливостей для помилок.

Expand Down Expand Up @@ -259,7 +259,7 @@ user.sayHi(); // Ілля
## Підсумки

- Функції, які зберігаються у властивостях об’єкта, називаються "методами".
- Методи дозволяють об’єктам "діяти" подібно до `object.doSomething()`.
- Методи дозволяють об’єктам "діяти" як от `object.doSomething()`.
- Методи можуть посилатися на об’єкт завдяки `this`.

- Значення `this` визначається під час виконання.
Expand Down