From bfb193f860a1a095154306fa0f5302c0e73270cc Mon Sep 17 00:00:00 2001 From: Stanislav Dolgachov Date: Thu, 8 Jul 2021 00:55:12 +0300 Subject: [PATCH 01/18] 1-01-04: Update article p.1 --- .../02-object-copy/article.md | 56 +++++++++---------- .../02-object-copy/variable-copy-value.svg | 2 +- 2 files changed, 29 insertions(+), 29 deletions(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index cafb71cac..3fe458256 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -1,79 +1,79 @@ -# Object references and copying +# Копіювання об’єктів та посилання -One of the fundamental differences of objects versus primitives is that objects are stored and copied "by reference", whereas primitive values: strings, numbers, booleans, etc -- are always copied "as a whole value". +Однією з принципових відмінностей об’єктів від примітивів є те, що об’єкти зберігаються та копіюються "за посиланням", тоді як примітивні значення: рядки, числа, логічні значення тощо - завжди копіюються "за значенням". -That's easy to understand if we look a bit under the hood of what happens when we copy a value. +Це легко зрозуміти, якщо заглянути під капот того, що відбувається, коли ми копіюємо значення. -Let's start with a primitive, such as a string. +Почнемо з примітиву, наприклад, рядка. -Here we put a copy of `message` into `phrase`: +Запишемо копію `message` у `phrase`: ```js -let message = "Hello!"; +let message = "Привіт!"; let phrase = message; ``` -As a result we have two independent variables, each one storing the string `"Hello!"`. +В результаті ми маємо дві незалежні змінні, кожна з яких зберігає рядок `"Привіт!"`. ![](variable-copy-value.svg) -Quite an obvious result, right? +Цілком очікуванний результат, згодні? -Objects are not like that. +Об'єкти поводяться інакше. -**A variable assigned to an object stores not the object itself, but its "address in memory" -- in other words "a reference" to it.** +**Змінна зберігає не сам об'єкт, а його "адресу в пам’яті" -- іншими словами "посилання" на нього.** -Let's look at an example of such a variable: +Проілюструємо це: ```js let user = { - name: "John" + name: "Іван" }; ``` -And here's how it's actually stored in memory: +І ось як це насправді зберігається в пам’яті: ![](variable-contains-reference.svg) -The object is stored somewhere in memory (at the right of the picture), while the `user` variable (at the left) has a "reference" to it. +Об’єкт зберігається десь у пам’яті (справа на зображенні), тоді як у змінній `user` (зліва) є "посилання" на нього. -We may think of an object variable, such as `user`, as like a sheet of paper with the address of the object on it. +Ми можемо думати про змінну `user`, як про шухляду з аркушем паперу з адресою об’єкта на ньому. -When we perform actions with the object, e.g. take a property `user.name`, the JavaScript engine looks at what's at that address and performs the operation on the actual object. +Коли ми виконуємо дії з об’єктом, напр. зчитуємо властивість `user.name`, рушій JavaScript перевіряє, що знаходиться за цією адресою, і виконує операцію над фактичним об'єктом. -Now here's why it's important. +Ось чому це важливо: -**When an object variable is copied, the reference is copied, but the object itself is not duplicated.** +**Коли копіюється змінна об’єкта, копіюється посилання, але сам об’єкт не дублюється.** -For instance: +Наприклад: ```js no-beautify -let user = { name: "John" }; +let user = { name: "Іван" }; -let admin = user; // copy the reference +let admin = user; // копіювання за посиланням ``` -Now we have two variables, each storing a reference to the same object: +Тепер у нас є дві змінні, кожна з яких зберігає посилання на єдиний об’єкт: ![](variable-copy-reference.svg) -As you can see, there's still one object, but now with two variables that reference it. +Як бачите, є тільки один об’єкт, але тепер із двома змінними, які посилаються на нього. -We can use either variable to access the object and modify its contents: +Ми можемо використати будь-яку змінну для доступу до об’єкта та модифікації його вмісту: ```js run -let user = { name: 'John' }; +let user = { name: 'Іван' }; let admin = user; *!* -admin.name = 'Pete'; // changed by the "admin" reference +admin.name = 'Петро'; // змінено за посиланням зі змінної "admin" */!* -alert(*!*user.name*/!*); // 'Pete', changes are seen from the "user" reference +alert(*!*user.name*/!*); // 'Петро', зміни видно з посилання зі змінної "user" ``` -It's as if we had a cabinet with two keys and used one of them (`admin`) to get into it and make changes. Then, if we later use another key (`user`), we are still opening the same cabinet and can access the changed contents. +Уявіть, що об’єкт -- це шафа з якимись данними (властивостями). А "адреса" цієї шафи зберігається у двох шухлядах. Спочатку ми використовуємо одну з них (`admin`), щоб дістатися цієї шафи та щось змінити. Потім, якщо ми використаємо іншу шухляду (`user`), ми все ще відкриємо ту саму шафу і отримаємо доступ до зміненого вмісту. ## Comparison by reference diff --git a/1-js/04-object-basics/02-object-copy/variable-copy-value.svg b/1-js/04-object-basics/02-object-copy/variable-copy-value.svg index e09f521fe..55231b391 100644 --- a/1-js/04-object-basics/02-object-copy/variable-copy-value.svg +++ b/1-js/04-object-basics/02-object-copy/variable-copy-value.svg @@ -1 +1 @@ -"Hello!"message"Hello!"phrase \ No newline at end of file +"Привіт!"message"Привіт!"phrase \ No newline at end of file From eef3ef1722c135686e634bdfa51f93dcab7e78a6 Mon Sep 17 00:00:00 2001 From: Stanislav Dolgachov Date: Sun, 11 Jul 2021 20:51:30 +0300 Subject: [PATCH 02/18] 1-01-04: Update article p.2 --- .../02-object-copy/article.md | 134 +++++++++--------- 1 file changed, 67 insertions(+), 67 deletions(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index 3fe458256..c24268d22 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -19,9 +19,9 @@ let phrase = message; Цілком очікуванний результат, згодні? -Об'єкти поводяться інакше. +Об’єкти поводяться інакше. -**Змінна зберігає не сам об'єкт, а його "адресу в пам’яті" -- іншими словами "посилання" на нього.** +**Змінна зберігає не сам об’єкт, а його "адресу в пам’яті" -- іншими словами "посилання" на нього.** Проілюструємо це: @@ -39,7 +39,7 @@ let user = { Ми можемо думати про змінну `user`, як про шухляду з аркушем паперу з адресою об’єкта на ньому. -Коли ми виконуємо дії з об’єктом, напр. зчитуємо властивість `user.name`, рушій JavaScript перевіряє, що знаходиться за цією адресою, і виконує операцію над фактичним об'єктом. +Коли ми виконуємо дії з об’єктом, напр. зчитуємо властивість `user.name`, рушій JavaScript перевіряє, що знаходиться за цією адресою, і виконує операцію над фактичним об’єктом. Ось чому це важливо: @@ -75,107 +75,107 @@ alert(*!*user.name*/!*); // 'Петро', зміни видно з посила Уявіть, що об’єкт -- це шафа з якимись данними (властивостями). А "адреса" цієї шафи зберігається у двох шухлядах. Спочатку ми використовуємо одну з них (`admin`), щоб дістатися цієї шафи та щось змінити. Потім, якщо ми використаємо іншу шухляду (`user`), ми все ще відкриємо ту саму шафу і отримаємо доступ до зміненого вмісту. -## Comparison by reference +## Порівняння за посиланням -Two objects are equal only if they are the same object. +Два об’єкти рівні, лише якщо це той самий об’єкт. -For instance, here `a` and `b` reference the same object, thus they are equal: +Наприклад, тут `a` і` b` посилаються на один і той же об’єкт, отже, вони рівні: ```js run let a = {}; -let b = a; // copy the reference +let b = a; // копіювання за посиланням -alert( a == b ); // true, both variables reference the same object +alert( a == b ); // true, обидві змінні посилаються на один і той же об’єкт alert( a === b ); // true ``` -And here two independent objects are not equal, even though they look alike (both are empty): +І тут два незалежні об’єкти не рівні, хоча вони схожі (обидва порожні): ```js run let a = {}; -let b = {}; // two independent objects +let b = {}; // два незалежні об’єкти alert( a == b ); // false ``` -For comparisons like `obj1 > obj2` or for a comparison against a primitive `obj == 5`, objects are converted to primitives. We'll study how object conversions work very soon, but to tell the truth, such comparisons are needed very rarely -- usually they appear as a result of a programming mistake. +Для порівнянь, таких як `obj1 > obj2` або для порівняння з примітивом` obj == 5`, об’єкти перетворюються на примітиви. Ми дуже швидко вивчимо, як працюють перетворення об’єктів, але по правді кажучи, такі порівняння потрібні дуже рідко - зазвичай вони з’являються в результаті помилки програмування. -## Cloning and merging, Object.assign [#cloning-and-merging-object-assign] +## Клонування та злиття об’єктів, Object.assign [#cloning-and-merging-object-assign] -So, copying an object variable creates one more reference to the same object. +Отже, копіювання змінної об’єкта створює ще одне посилання на той самий об’єкт. -But what if we need to duplicate an object? Create an independent copy, a clone? +Але що, якщо нам потрібно дублювати об’єкт? Створити незалежну копію, клон? -That's also doable, but a little bit more difficult, because there's no built-in method for that in JavaScript. But there is rarely a need -- copying by reference is good most of the time. +Це теж можливо, але трохи складніше, оскільки в JavaScript немає вбудованого методу для цього. Насправді, це потрібно досить рідко. У більшості випадків нам достатньо копіювання за посиланням. -But if we really want that, then we need to create a new object and replicate the structure of the existing one by iterating over its properties and copying them on the primitive level. +Але якщо ми насправді цього хочемо, то нам потрібно створити новий об’єкт і відтворити структуру існуючого, перебираючи та копіюючи його властивості. -Like this: +Наприклад так: ```js run let user = { - name: "John", + name: "Іван", age: 30 }; *!* -let clone = {}; // the new empty object +let clone = {}; // новий порожній об’єкт -// let's copy all user properties into it +// давайте скопіюємо в нього всі властивості з user for (let key in user) { clone[key] = user[key]; } */!* -// now clone is a fully independent object with the same content -clone.name = "Pete"; // changed the data in it +// тепер клон - це повністю незалежний об’єкт з однаковим вмістом +clone.name = "Петро"; // змінемо його вміст -alert( user.name ); // still John in the original object +alert( user.name ); // як і раніше Іван залишився в оригінальному об’єкті ``` -Also we can use the method [Object.assign](mdn:js/Object/assign) for that. +Також ми можемо використати метод [Object.assign](mdn:js/Object/assign) для цього. -The syntax is: +Його синтаксис: ```js Object.assign(dest, [src1, src2, src3...]) ``` -- The first argument `dest` is a target object. -- Further arguments `src1, ..., srcN` (can be as many as needed) are source objects. -- It copies the properties of all source objects `src1, ..., srcN` into the target `dest`. In other words, properties of all arguments starting from the second are copied into the first object. -- The call returns `dest`. +- Перший аргумент `dest` -- цє цільовий об’єкт, у який ми будемо копіювати. +- Наступні аргументи `src1, ..., srcN` (їх може бути скільки завгодно) - це вихідні об’єкти, з яких ми будемо копіювати. +- Він копіює властивості всіх вихідних об’єктів `src1, ..., srcN` у цільовий` dest`. Іншими словами, властивості всіх аргументів, починаючи з другого, копіюються в перший об’єкт. +- Виклик повертає `dest`. -For instance, we can use it to merge several objects into one: +Наприклад, ми можемо використовувати його для об’єднання кількох об’єктів в один: ```js -let user = { name: "John" }; +let user = { name: "Іван" }; let permissions1 = { canView: true }; let permissions2 = { canEdit: true }; *!* -// copies all properties from permissions1 and permissions2 into user +// копіює всі властивості з permissions1 та permissions2 у user Object.assign(user, permissions1, permissions2); */!* -// now user = { name: "John", canView: true, canEdit: true } +// тепер user = { name: "Іван", canView: true, canEdit: true } ``` -If the copied property name already exists, it gets overwritten: +Якщо приймаючий об’єкт(user) вже має властивість з таким ім’ям, її буде перезаписано: ```js run -let user = { name: "John" }; +let user = { name: "Іван" }; -Object.assign(user, { name: "Pete" }); +Object.assign(user, { name: "Петро" }); -alert(user.name); // now user = { name: "Pete" } +alert(user.name); // тепер user = { name: "Петро" } ``` -We also can use `Object.assign` to replace `for..in` loop for simple cloning: +Ми також можемо використовувати `Object.assign` щоб замінити цикл `for..in` для простого клонування: ```js let user = { - name: "John", + name: "Іван", age: 30 }; @@ -184,18 +184,18 @@ let clone = Object.assign({}, user); */!* ``` -It copies all properties of `user` into the empty object and returns it. +Він копіює всі властивості `user` у порожній об’єкт і повертає його. -There are also other methods of cloning an object, e.g. using the [spread syntax](info:rest-parameters-spread) `clone = {...user}`, covered later in the tutorial. +Існують також інші методи клонування об’єкта, напр. за допомогою [оператора розширення](info:rest-parameters-spread) `clone = {...user}`, це висвітлено пізніше у підручнику. -## Nested cloning +## Вкладене клонування -Until now we assumed that all properties of `user` are primitive. But properties can be references to other objects. What to do with them? +До цього часу ми вважали, що всі властивості `user` є примітивами. Але властивості можуть бути посиланнями на інші об’єкти. Що з ними робити? -Like this: +Наприклад: ```js run let user = { - name: "John", + name: "Іван", sizes: { height: 182, width: 50 @@ -205,13 +205,13 @@ let user = { alert( user.sizes.height ); // 182 ``` -Now it's not enough to copy `clone.sizes = user.sizes`, because the `user.sizes` is an object, it will be copied by reference. So `clone` and `user` will share the same sizes: +Тепер при клонуванні недостатньо просто скопіювати `clone.sizes = user.sizes`, тому що `user.sizes` є об’єктом, і він буде скопійований за посиланням. Тому `clone` і `user` у своїх властивостях `sizes` будуть посилатися на один і той же об’єкт: -Like this: +Ось так: ```js run let user = { - name: "John", + name: "Іван", sizes: { height: 182, width: 50 @@ -220,45 +220,45 @@ let user = { let clone = Object.assign({}, user); -alert( user.sizes === clone.sizes ); // true, same object +alert( user.sizes === clone.sizes ); // true, один і той же об’єкт -// user and clone share sizes -user.sizes.width++; // change a property from one place -alert(clone.sizes.width); // 51, see the result from the other one +// user і clone мають посилання на єдиний об’єкт у властивості sizes +user.sizes.width++; // міняємо властивість з одного місця +alert(clone.sizes.width); // 51, бачемо результат в інщому об’єкті ``` -To fix that, we should use a cloning loop that examines each value of `user[key]` and, if it's an object, then replicate its structure as well. That is called a "deep cloning". +Щоб це виправити, слід використовувати цикл клонування, який перевіряє кожне значення `user [key]`, і якщо це об’єкт, то також копіює його структуру. Це називається "глибоким клонуванням". -We can use recursion to implement it. Or, to not reinvent the wheel, take an existing implementation, for instance [_.cloneDeep(obj)](https://lodash.com/docs#cloneDeep) from the JavaScript library [lodash](https://lodash.com). +Для його реалізації ми можемо використати рекурсію. Або, щоб не винаходити колесо, взяти існуючу реалізацію, наприклад [_.cloneDeep(obj)](https://lodash.com/docs#cloneDeep) з бібліотеки JavaScript [lodash](https://lodash.com). -````smart header="Const objects can be modified" -An important side effect of storing objects as references is that an object declared as `const` *can* be modified. +````smart header="об’єкти у const-змінних можна змінювати" +Важливим побічним ефектом зберігання об’єктів як посилань є те, що об’єкт, оголошений як `const`, *може* бути змінений. -For instance: +Наприклад: ```js run const user = { - name: "John" + name: "Іван" }; *!* -user.name = "Pete"; // (*) +user.name = "Петро"; // (*) */!* -alert(user.name); // Pete +alert(user.name); // Петро ``` -It might seem that the line `(*)` would cause an error, but it does not. The value of `user` is constant, it must always reference the same object, but properties of that object are free to change. +Може здатися, що рядок `(*)` призведе до помилки, але це не так. Значення у змінній `user` є постійним, воно завжди має посилатися на один і той же об’єкт, але властивості цього об’єкта можуть змінюватися. -In other words, the `const user` gives an error only if we try to set `user=...` as a whole. +Іншими словами, `const user` видає помилку, лише якщо ми намагаємося присвоїти у саму змінну інше значення: `user=...`. -That said, if we really need to make constant object properties, it's also possible, but using totally different methods. We'll mention that in the chapter . +Тим не менш, якщо нам дійсно потрібно створювати незмінні властивості об’єкта, це також можливо, але з використанням зовсім інших методів. Про це ми згадаємо у розділі . ```` -## Summary +## Підсумки -Objects are assigned and copied by reference. In other words, a variable stores not the "object value", but a "reference" (address in memory) for the value. So copying such a variable or passing it as a function argument copies that reference, not the object itself. +об’єкти присвоюються та копіюються за посиланням. Іншими словами, змінна зберігає не "значення об’єкта", а "посилання" (адресу в пам’яті) на значення. Тож копіювання такої змінної або передача її як аргументу функції копіює це посилання, а не сам об’єкт. -All operations via copied references (like adding/removing properties) are performed on the same single object. +Усі операції за допомогою скопійованих посилань (наприклад, додавання/видалення властивостей) виконуються над одним і тим же об’єктом. -To make a "real copy" (a clone) we can use `Object.assign` for the so-called "shallow copy" (nested objects are copied by reference) or a "deep cloning" function, such as [_.cloneDeep(obj)](https://lodash.com/docs#cloneDeep). +Для створення "справжньої копії" (клону) ми можемо використовувати `Object.assign` для так званої "поверхової копії" (вкладені об’єкти копіюються за посиланням) або функції "глибокого клонування", наприклад [_.cloneDeep(obj)](https://lodash.com/docs#cloneDeep). From 4ee32b05f55eb27e7ab5d17a00415baacd56b54c Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:30:04 +0300 Subject: [PATCH 03/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index c24268d22..7a8708f02 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -50,7 +50,7 @@ let user = { ```js no-beautify let user = { name: "Іван" }; -let admin = user; // копіювання за посиланням +let admin = user; // копіювання посилання ``` Тепер у нас є дві змінні, кожна з яких зберігає посилання на єдиний об’єкт: From f7d34f2636370dbe638861af665870d282fb4708 Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:30:20 +0300 Subject: [PATCH 04/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index 7a8708f02..33bc1898e 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -53,7 +53,7 @@ let user = { name: "Іван" }; let admin = user; // копіювання посилання ``` -Тепер у нас є дві змінні, кожна з яких зберігає посилання на єдиний об’єкт: +Тепер у нас є дві змінні, кожна з яких зберігає посилання на той самий об’єкт: ![](variable-copy-reference.svg) From 7693289593327c99dcc4f36839d0627ae26d5684 Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:30:30 +0300 Subject: [PATCH 05/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index 33bc1898e..c0fa9e620 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -79,7 +79,7 @@ alert(*!*user.name*/!*); // 'Петро', зміни видно з посила Два об’єкти рівні, лише якщо це той самий об’єкт. -Наприклад, тут `a` і` b` посилаються на один і той же об’єкт, отже, вони рівні: +Наприклад, тут `a` і` b` посилаються на той самий об’єкт, отже, вони рівні: ```js run let a = {}; From e64dd5ad60875e32299d8af1f8b7d3d1e8968188 Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:30:42 +0300 Subject: [PATCH 06/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index c0fa9e620..7e155a33a 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -83,7 +83,7 @@ alert(*!*user.name*/!*); // 'Петро', зміни видно з посила ```js run let a = {}; -let b = a; // копіювання за посиланням +let b = a; // копіювання посилання alert( a == b ); // true, обидві змінні посилаються на один і той же об’єкт alert( a === b ); // true From 03596caeda50d06e4a5258e4a57fdcabcbb657a4 Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:30:53 +0300 Subject: [PATCH 07/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index 7e155a33a..9adce8bb8 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -85,7 +85,7 @@ alert(*!*user.name*/!*); // 'Петро', зміни видно з посила let a = {}; let b = a; // копіювання посилання -alert( a == b ); // true, обидві змінні посилаються на один і той же об’єкт +alert( a == b ); // true, обидві змінні посилаються на той самий об’єкт alert( a === b ); // true ``` From 477b661925261c100a924d0dde4e7f36b054e5a6 Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:31:10 +0300 Subject: [PATCH 08/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index 9adce8bb8..c914ca784 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -98,7 +98,7 @@ let b = {}; // два незалежні об’єкти alert( a == b ); // false ``` -Для порівнянь, таких як `obj1 > obj2` або для порівняння з примітивом` obj == 5`, об’єкти перетворюються на примітиви. Ми дуже швидко вивчимо, як працюють перетворення об’єктів, але по правді кажучи, такі порівняння потрібні дуже рідко - зазвичай вони з’являються в результаті помилки програмування. +Для порівнянь, таких як `obj1 > obj2`, або для порівняння з примітивом `obj == 5`, об’єкти перетворюються на примітиви. Незабаром ми вивчимо, як працюють перетворення об’єктів, але правду кажучи, такі порівняння потрібні вкрай рідко — зазвичай вони з’являються в результаті неправильного програмування. ## Клонування та злиття об’єктів, Object.assign [#cloning-and-merging-object-assign] From 36f6e8df3c9b3a2786e53a3f6507fe55141c894f Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:31:20 +0300 Subject: [PATCH 09/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index c914ca784..e54eeac98 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -227,7 +227,7 @@ user.sizes.width++; // міняємо властивість з одног alert(clone.sizes.width); // 51, бачемо результат в інщому об’єкті ``` -Щоб це виправити, слід використовувати цикл клонування, який перевіряє кожне значення `user [key]`, і якщо це об’єкт, то також копіює його структуру. Це називається "глибоким клонуванням". +Щоб це виправити, слід використовувати цикл клонування, який перевіряє кожне значення `user[key]`, і якщо це об’єкт, то також копіює його структуру. Це називається "глибоким клонуванням". Для його реалізації ми можемо використати рекурсію. Або, щоб не винаходити колесо, взяти існуючу реалізацію, наприклад [_.cloneDeep(obj)](https://lodash.com/docs#cloneDeep) з бібліотеки JavaScript [lodash](https://lodash.com). From f0945a8c2095917e64ff3c36dae0ef387d2fa446 Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:31:30 +0300 Subject: [PATCH 10/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index e54eeac98..e350ba423 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -248,7 +248,7 @@ user.name = "Петро"; // (*) alert(user.name); // Петро ``` -Може здатися, що рядок `(*)` призведе до помилки, але це не так. Значення у змінній `user` є постійним, воно завжди має посилатися на один і той же об’єкт, але властивості цього об’єкта можуть змінюватися. +Може здатися, що рядок `(*)` призведе до помилки, але це не так. Значення у змінній `user` є постійним, воно завжди має посилатися на той самий об’єкт, але властивості цього об’єкта можуть змінюватися. Іншими словами, `const user` видає помилку, лише якщо ми намагаємося присвоїти у саму змінну інше значення: `user=...`. From 99dbc4774bbb0736b945e9fade46ddb993af8715 Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:31:38 +0300 Subject: [PATCH 11/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index e350ba423..d85761643 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -250,7 +250,7 @@ alert(user.name); // Петро Може здатися, що рядок `(*)` призведе до помилки, але це не так. Значення у змінній `user` є постійним, воно завжди має посилатися на той самий об’єкт, але властивості цього об’єкта можуть змінюватися. -Іншими словами, `const user` видає помилку, лише якщо ми намагаємося присвоїти у саму змінну інше значення: `user=...`. +Інакше кажучи, `const user` видає помилку, лише якщо ми намагаємося присвоїти у саму змінну інше значення: `user = ...`. Тим не менш, якщо нам дійсно потрібно створювати незмінні властивості об’єкта, це також можливо, але з використанням зовсім інших методів. Про це ми згадаємо у розділі . ```` From cf28afe793d86460069462335520fb814bb4f5e7 Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:31:45 +0300 Subject: [PATCH 12/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index d85761643..9593ca0ef 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -257,7 +257,7 @@ alert(user.name); // Петро ## Підсумки -об’єкти присвоюються та копіюються за посиланням. Іншими словами, змінна зберігає не "значення об’єкта", а "посилання" (адресу в пам’яті) на значення. Тож копіювання такої змінної або передача її як аргументу функції копіює це посилання, а не сам об’єкт. +Об’єкти присвоюються та копіюються за посиланням. Інакше кажучи, змінна зберігає не "значення об’єкта", а "посилання" (адресу в пам’яті) на значення. Тож копіювання такої змінної або передача її як аргументу функції копіює це посилання, а не сам об’єкт. Усі операції за допомогою скопійованих посилань (наприклад, додавання/видалення властивостей) виконуються над одним і тим же об’єктом. From d9746315bef0c46526f1378eb66a8fad0c39c642 Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:32:08 +0300 Subject: [PATCH 13/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index 9593ca0ef..80f24c8a8 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -259,6 +259,6 @@ alert(user.name); // Петро Об’єкти присвоюються та копіюються за посиланням. Інакше кажучи, змінна зберігає не "значення об’єкта", а "посилання" (адресу в пам’яті) на значення. Тож копіювання такої змінної або передача її як аргументу функції копіює це посилання, а не сам об’єкт. -Усі операції за допомогою скопійованих посилань (наприклад, додавання/видалення властивостей) виконуються над одним і тим же об’єктом. +Усі операції за допомогою скопійованих посилань (наприклад, додавання/видалення властивостей) виконуються над тим самим об’єктом. Для створення "справжньої копії" (клону) ми можемо використовувати `Object.assign` для так званої "поверхової копії" (вкладені об’єкти копіюються за посиланням) або функції "глибокого клонування", наприклад [_.cloneDeep(obj)](https://lodash.com/docs#cloneDeep). From 72a0e5db738bae00770d8b77905f50b53caa1dcf Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:32:24 +0300 Subject: [PATCH 14/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index 80f24c8a8..5eb4aa377 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -121,7 +121,7 @@ let user = { *!* let clone = {}; // новий порожній об’єкт -// давайте скопіюємо в нього всі властивості з user +// скопіюймо в нього всі властивості з user for (let key in user) { clone[key] = user[key]; } From 6c6a2ee2d77702321850fa5f6855cfe4fd46fc66 Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:32:35 +0300 Subject: [PATCH 15/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index 5eb4aa377..723e6ee9e 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -161,7 +161,7 @@ Object.assign(user, permissions1, permissions2); // тепер user = { name: "Іван", canView: true, canEdit: true } ``` -Якщо приймаючий об’єкт(user) вже має властивість з таким ім’ям, її буде перезаписано: +Якщо приймаючий об’єкт (`user`) вже має властивість з таким ім’ям, її буде перезаписано: ```js run let user = { name: "Іван" }; From 957b1d75a732be114c193857d7b17775afc6b514 Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:32:45 +0300 Subject: [PATCH 16/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index 723e6ee9e..a3fbfee4d 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -220,7 +220,7 @@ let user = { let clone = Object.assign({}, user); -alert( user.sizes === clone.sizes ); // true, один і той же об’єкт +alert( user.sizes === clone.sizes ); // true, той самий об’єкт // user і clone мають посилання на єдиний об’єкт у властивості sizes user.sizes.width++; // міняємо властивість з одного місця From 410304007cfe7dcc96b256c91917e5d4980a1d87 Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:32:57 +0300 Subject: [PATCH 17/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index a3fbfee4d..f4329a4fa 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -205,7 +205,7 @@ let user = { alert( user.sizes.height ); // 182 ``` -Тепер при клонуванні недостатньо просто скопіювати `clone.sizes = user.sizes`, тому що `user.sizes` є об’єктом, і він буде скопійований за посиланням. Тому `clone` і `user` у своїх властивостях `sizes` будуть посилатися на один і той же об’єкт: +Тепер при клонуванні недостатньо просто скопіювати `clone.sizes = user.sizes`, тому що `user.sizes` є об’єктом, і він буде скопійований за посиланням. Тому `clone` і `user` у своїх властивостях `sizes` будуть посилатися на той самий об’єкт: Ось так: From 0e8996a6081d2050f2c6cb42f8742a7fd05ac00c Mon Sep 17 00:00:00 2001 From: Taras Date: Tue, 13 Jul 2021 20:33:10 +0300 Subject: [PATCH 18/18] Update 1-js/04-object-basics/02-object-copy/article.md --- 1-js/04-object-basics/02-object-copy/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/02-object-copy/article.md b/1-js/04-object-basics/02-object-copy/article.md index f4329a4fa..0433fdae3 100644 --- a/1-js/04-object-basics/02-object-copy/article.md +++ b/1-js/04-object-basics/02-object-copy/article.md @@ -224,7 +224,7 @@ alert( user.sizes === clone.sizes ); // true, той самий об’єкт // user і clone мають посилання на єдиний об’єкт у властивості sizes user.sizes.width++; // міняємо властивість з одного місця -alert(clone.sizes.width); // 51, бачемо результат в інщому об’єкті +alert(clone.sizes.width); // 51, бачимо результат в іншому об’єкті ``` Щоб це виправити, слід використовувати цикл клонування, який перевіряє кожне значення `user[key]`, і якщо це об’єкт, то також копіює його структуру. Це називається "глибоким клонуванням".