Merge pull request #715 from Andrii256/01-06-09-call-apply-decorators

Fix call apply decorators (01-06-09)

Author: dolgachio

1-js/06-advanced-functions/09-call-apply-decorators/01-spy-decorator/_js.view/solution.js

@@ -1,7 +1,7 @@
 function spy(func) {
-
+  
   function wrapper(...args) {
-    // using ...args instead of arguments to store "real" array in wrapper.calls
+    // використовуємо ...args замість arguments щоб можна було зберігати "справжній" масив в wrapper.calls
     wrapper.calls.push(args);
     return func.apply(this, args);
   }

1-js/06-advanced-functions/09-call-apply-decorators/01-spy-decorator/_js.view/source.js

@@ -1,5 +1,5 @@
 function spy(func) {
-  // your code
+  // твій код
 }
 
 

1-js/06-advanced-functions/09-call-apply-decorators/01-spy-decorator/task.md

@@ -8,7 +8,7 @@ importance: 5
 
 Кожен виклик зберігається як масив аргументів.
 
-For instance:
+До прикладу:
 
 ```js
 function work(a, b) {

1-js/06-advanced-functions/09-call-apply-decorators/02-delay/solution.md

@@ -18,7 +18,7 @@ f1000("тест"); // показує "тест" після 1000 мс
 
 Якщо ми передамо звичайну функцію, `setTimeout` буде викликати її без аргументів, а `this=window` (припускаючи, що ми знаходимося в браузері).
 
-Ми все ще можемо передати право `this` за допомогою проміжної змінної, але це трохи більше громіздко:
+Ми все ще можемо передати коректний `this` за допомогою проміжної змінної, але це трохи більш громіздко:
 
 ```js
 function delay(f, ms) {

1-js/06-advanced-functions/09-call-apply-decorators/02-delay/task.md

@@ -23,4 +23,4 @@ f1500("тест"); // показує "test" після 1500 мс
 
 Іншими словами, `delay(f, ms)` повертає варіант `f` з "затримкою на `ms`".
 
-У коді вище, `f` є функцією одного аргументу, але ваше рішення повинно передавати всі аргументи та контекст `this`.
+У коді вище, функція `f` приймає лише один аргумент, але ваше рішення повинно передавати всі аргументи та контекст `this`.

1-js/06-advanced-functions/09-call-apply-decorators/03-debounce/task.md

@@ -4,11 +4,11 @@ importance: 5
 
 # Декоратор debounce
 
-Результат `debounce(f, ms)` декоратору -- це обгортка, що призупиняє виклики до `f`, поки не пройде `ms` мілісекунд бездіяльності (без викликів, "cooldown period"), а потім викликає `f` один раз з останніми аргументами.
+Результат декоратора `debounce(f, ms)` -- це обгортка, що призупиняє виклики до `f`, поки не пройде `ms` мілісекунд бездіяльності (без викликів, "cooldown period"), а потім викликає `f` один раз з останніми аргументами.
 
 Іншими словами, `debounce` -- це як секретар, який приймає "телефонні дзвінки", і чекає, поки не закінчаться `ms` мілісекунди тиші. І лише тоді він передає останню інформацію про виклик до "боса" (викликає фактичну `f`).
 
-Наприклад, у нас була функція `f` і замінили її на `f = debounce(f, 1000)`.
+Наприклад, якщо ми візьмемо функцію `f` і замінимо її на `f = debounce(f, 1000)`.
 
 Тоді, якщо загорнута функція викликається при 0 мс, 200 мс та 500 мс, а потім викликів немає, то фактична `f` буде викликатися лише один раз, при 1500 мс. Тобто: після закінчення періоду 1000 мс від останнього виклику.
 
@@ -29,9 +29,9 @@ setTimeout( () => f("c"), 500);
 
 Тепер практичний приклад. Скажімо, користувач друкує щось, і ми хотіли б надіслати запит на сервер, коли ввід закінчиться.
 
-Немає сенсу надсилати запит на кожен набраний символ. Замість цього ми хотіли б почекати, а потім обробляти весь результат.
+Немає сенсу надсилати запит після кожного введеного символу. Замість цього ми хотіли б почекати поки користувач закінчить вводити текст, а тоді уже обробляти весь результат.
 
-У веббраузері ми можемо налаштувати обробник подій -- функцію, яка викликається при кожній зміні поля введення.Зазвичай, обробник подій викликається дуже часто, для кожного друкованого символу. Але якщо ми використаємо `debounce` на 1000 мс, то він буде викликатися лише один раз, через 1000 мс після останнього введення.
+У веббраузері ми можемо налаштувати обробник подій -- функцію, яка викликається при кожній зміні поля введення. Зазвичай, обробник подій викликається дуже часто, для кожного друкованого символу. Але якщо ми використаємо `debounce` на 1000 мс, то він буде викликатися лише один раз, через 1000 мс після останнього введення.
 
 ```online
 
@@ -44,7 +44,7 @@ setTimeout( () => f("c"), 500);
 
 Отже, `debounce` -- це чудовий спосіб обробки послідовності подій: будь то послідовність натискання клавіш, рухів миші або щось інше.
 
-Він чекає певного часу після останнього дзвінка, а потім запускає свою функцію, яка може обробити результат.
+Він чекає певного часу після останнього виклику, а потім запускає свою функцію, яка може обробити результат.
 
 Завдання полягає в тому, щоб реалізувати декоратор `debounce`.
 

1-js/06-advanced-functions/09-call-apply-decorators/04-throttle/solution.md

@@ -32,7 +32,7 @@ function throttle(func, ms) {
 Виклик `throttle(func, ms)` повертає `wrapper`.
 
 1. Під час першого виклику `wrapper` просто викликає `func` і встановлює стан відпочинку (`isThrottled = true`).
-2. У цьому стані всі виклики запам’ятовуються в `savedArgs/savedThis`. Зверніть увагу, що як контекст, так і аргументи однаково важливі, і повинні бути запам’ятованими. Нам потрібні вони їх одночасно, щоб відтворити виклик.
-3. Після того, як `ms` мілісекунди проходять, `setTimeout` спрацьовує. Стан відпочинку знімається (`isThrottled = false`) і, якщо ми мали проігноровані виклики, `wrapper` виконується з останніми запам’ятовуваними аргументами та контекстом.
+2. Під час цього стану всі виклики запам’ятовуються в `savedArgs/savedThis`. Зверніть увагу, що як контекст, так і аргументи однаково важливі, і повинні бути запам’ятованими. Для кожного повноцінного виклику, нам потрібні і аргумент, і контекст одночасно.
+3. Після того, як минає `ms` мілісекунд, `setTimeout` спрацьовує. Стан відпочинку знімається (`isThrottled = false`) і, якщо ми мали проігноровані виклики, `wrapper` виконується з останніми збереженими аргументами та контекстом.
 
-3-й крок запускає не `func`, а `wrapper`, тому що ми не тільки повинні виконувати `func`, але й ще раз вводити стан відпочинку та налаштовувати тайм-аут, щоб скинути його.
+3-й крок запускає не `func`, а `wrapper`, тому що ми не тільки повинні виконувати `func`, але й ще раз вводити стан відпочинку та налаштовувати тайм-аут, щоб потім знову відмінити стан відпочинку.

1-js/06-advanced-functions/09-call-apply-decorators/04-throttle/task.md

@@ -14,23 +14,23 @@ importance: 5
 
 Іншими словами, `throttle` -- це як секретар, який приймає телефонні дзвінки, але турбує боса (викликає фактичну `f`) не частіше, ніж один раз на `ms` мілісекунд.
 
-Перевірмо застосунок з реального життя, щоб краще зрозуміти ці вимогу та побачити, звідки вони походять.
+Перевірмо застосунок з реального життя, щоб краще зрозуміти цю вимогу та побачити, звідки вона походить.
 
 **Наприклад, ми хочемо відстежувати рухи миші.**
 
 У браузері ми можемо налаштувати запускати функцію при кожному русі миші та отримати місце курсору та те, як він рухається. Під час активного використання миші ця функція зазвичай працює дуже часто, може бути щось на зразок 100 разів на секунду (кожні 10 мс).
 **Ми хотіли б оновити деяку інформацію на вебсторінці, коли курсор рухається.**
 
-...Але функція оновлення `update()` занадто тяжка, щоб виконувати її це на кожному мікрорусі. Також немає сенсу в оновленні частіше, ніж один раз на 100 мс.
+...Але функція оновлення `update()` занадто тяжка, щоб виконувати її після кожного найменшого руху миші. Та й нам немає сенсу в оновленні частіше, ніж один раз на 100 мс.
 
-Отже, ми загорнемо її в декоратор: використовуємо `throttle(update, 100)` як функцію для запуску на кожному переміщенні миші замість оригінального `update()`. Декоратор буде викликатися часто, але передавали виклик до `update()` максимум один раз на 100 мс.
+Отже, ми загорнемо її в декоратор: використаємо `throttle(update, 100)` як функцію для запуску після кожного руху миші замість оригінального `update()`. Сам декоратор буде викликатися часто, але передаватиме виклик до `update()` максимум один раз на 100 мс.
 
 Візуально, це буде виглядати так:
 
-1. Для першого руху миші декорований варіант негайно передає виклик до `update`. Це важливо, що користувач негайно побачить нашу реакцію на його рух.
+1. Для першого руху миші декорований варіант негайно передає виклик до `update`. Це важливо, щоб користувач негайно побачив нашу реакцію на його рух.
 2. Після того, як миша рухається, до `100ms` нічого не відбувається. Декорований варіант ігнорує виклики.
 3. Наприкінці `100ms` -- ще один `update` відбувається з останніми координатами.
-4. Тоді, нарешті, миша зупиняється десь. Декорований варіант чекає, доки `100ms` закінчуються, а потім запускає `update` з останніми координатами. Отже, дуже важливо, щоб остаточні координати миші обробилися.
+4. Тоді, нарешті, миша зупиняється десь. Декорований варіант чекає, доки мине `100ms`, а потім запускає `update` з останніми координатами. Отже, дуже важливо, щоб остаточні координати миші обробилися.
 
 Приклад коду:
 
@@ -47,7 +47,7 @@ f1000(2); // (обмеження, 1000 мс ще не закінчилися)
 f1000(3); // (обмеження, 1000 мс ще не закінчилися)
 
 // коли 1000 ms time out ...
-// ...вивід 3, проміжне значення 2 було проігноровано
+// ...виводить 3; проміжне значення 2 було проігноровано
 ```
 
 P.S. Аргументи та контекст `this` передані в `f1000` повинні бути передані оригінальній `f`.