diff options
Diffstat (limited to 'files/uk/web/javascript/reference/global_objects/object/assign')
| -rw-r--r-- | files/uk/web/javascript/reference/global_objects/object/assign/index.html | 273 |
1 files changed, 0 insertions, 273 deletions
diff --git a/files/uk/web/javascript/reference/global_objects/object/assign/index.html b/files/uk/web/javascript/reference/global_objects/object/assign/index.html deleted file mode 100644 index 3bbaac64b9..0000000000 --- a/files/uk/web/javascript/reference/global_objects/object/assign/index.html +++ /dev/null @@ -1,273 +0,0 @@ ---- -title: Object.assign() -slug: Web/JavaScript/Reference/Global_Objects/Object/assign -tags: - - ECMAScript 2015 - - JavaScript - - Method - - Object - - Довідка -translation_of: Web/JavaScript/Reference/Global_Objects/Object/assign ---- -<div>{{JSRef}}</div> - -<p>Метод <strong><code>Object.assign()</code></strong> призначено для копіювання у цільовий об'єкт всіх особистих (не успадкованих) перелічуваних властивостей одного або декількох об'єктів. Метод повертає цільовий об'єкт.</p> - -<p>{{EmbedInteractiveExample("pages/js/object-assign.html")}}</p> - -<div class="hidden"> -<p>The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> -</div> - -<h2 id="Синтаксис">Синтаксис</h2> - -<pre class="syntaxbox notranslate">Object.assign(<var>target</var>, ...<var>sources</var>)</pre> - -<h3 id="Параметри">Параметри</h3> - -<dl> - <dt><em><code>target</code></em></dt> - <dd>Цільовий об'єкт.</dd> - <dt><em><code>sources</code></em></dt> - <dd>Вхідні об'єкти (щонайменше один).</dd> -</dl> - -<h3 id="Вертає">Вертає</h3> - -<p>Цільовий об'єкт.</p> - -<h2 id="Опис">Опис</h2> - -<p>Властивості цільового об'єкта будуть заміщені властивостями вхідних об'єктів, якщо вони мають той самий ключ. Пізніші властивості вхідних об'єктів схожим чином заміщують більш ранні.</p> - -<p>Метод <code>Object.assign()</code> копіює лише перелічувані та <em>особисті</em> властивості з кожного джерела у цільовий об'єкт. Він використовує <code>[[Get]]</code> на вхідних об'єктах та <code>[[Set]]</code> на цільовому об'єкті, а отже, здійснює виклики гетерів і сетерів. Таким чином, він <em>присвоює</em> властивості, а не просто копіює чи визначає нові властивості. Ця особливість може зробити метод непридатним для приєднання нових властивостей до прототипу, якщо вхідні джерела містять гетери.</p> - -<p>Для копіювання визначень властивостей разом з їх перелічуваністю у прототип натомість скористайтеся методами {{jsxref("Object.getOwnPropertyDescriptor()")}} та {{jsxref("Object.defineProperty()")}}.</p> - -<p>Копіюються властивості обох типів: як {{jsxref("String","рядкові")}}, так і {{jsxref("Symbol","символьні")}}.</p> - -<p>В разі помилки, наприклад, якщо властивість є недоступною для запису, викидається помилка {{jsxref("TypeError")}}, а об'єкт <code>target</code> може бути змінений, якщо будь-які властивості були додані до викидання помилки.</p> - -<div class="blockIndicator note"> -<p><strong>Заувага:</strong> <code>Object.assign()</code> не викидає помилок, якщо серед джерел є значення {{jsxref("null")}} чи {{jsxref("undefined")}}.</p> -</div> - -<h2 id="Приклади">Приклади</h2> - -<h3 id="Клонування_обєкта">Клонування об'єкта</h3> - -<pre class="brush: js notranslate">const obj = { a: 1 }; -const copy = Object.assign({}, obj); -console.log(copy); // { a: 1 } -</pre> - -<h3 id="Deep_Clone" name="Deep_Clone">Заувага щодо створення глибокої копії</h3> - -<p>Для створення глибокої копії необхідно скористатись альтернативними методами, тому що метод <code>Object.assign()</code> копіює значення властивостей. Якщо значенням джерела буде посилання на об'єкт, метод скопіює лише значення посилання.</p> - -<pre class="brush: js notranslate">function test() { - 'use strict'; - - let obj1 = { a: 0 , b: { c: 0}}; - let obj2 = Object.assign({}, obj1); - console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}} - - obj1.a = 1; - console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}} - console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}} - - obj2.a = 2; - console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}} - console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 0}} - - obj2.b.c = 3; - console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 3}} - console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 3}} - - // Глибока копія - obj1 = { a: 0 , b: { c: 0}}; - let obj3 = JSON.parse(JSON.stringify(obj1)); - obj1.a = 4; - obj1.b.c = 4; - console.log(JSON.stringify(obj3)); // { a: 0, b: { c: 0}} -} - -test();</pre> - -<h3 id="Злиття_обєктів">Злиття об'єктів</h3> - -<pre class="brush: js notranslate">const o1 = { a: 1 }; -const o2 = { b: 2 }; -const o3 = { c: 3 }; - -const obj = Object.assign(o1, o2, o3); - -console.log(obj); // { a: 1, b: 2, c: 3 } -console.log(o1); // { a: 1, b: 2, c: 3 }, змінено сам цільовий об'єкт</pre> - -<h3 id="Злиття_обєктів_з_однаковими_властивостями">Злиття об'єктів з однаковими властивостями</h3> - -<pre class="brush: js notranslate">const o1 = { a: 1, b: 1, c: 1 }; -const o2 = { b: 2, c: 2 }; -const o3 = { c: 3 }; - -const obj = Object.assign({}, o1, o2, o3); -console.log(obj); // { a: 1, b: 2, c: 3 }</pre> - -<p>Властивості перезаписуються однойменними властивостями інших об'єктів, що стоять далі в списку параметрів.</p> - -<h3 id="Копіювання_символьних_властивостей">Копіювання символьних властивостей</h3> - -<pre class="brush: js notranslate">const o1 = { a: 1 }; -const o2 = { [Symbol('foo')]: 2 }; - -const obj = Object.assign({}, o1, o2); -console.log(obj); // { a : 1, [Symbol("foo")]: 2 } -Object.getOwnPropertySymbols(obj); // [Symbol(foo)] -</pre> - -<h3 id="Властивості_з_ланцюжка_прототипів_та_неперелічувані_властивості_скопіювати_не_можна">Властивості з ланцюжка прототипів та неперелічувані властивості скопіювати не можна</h3> - -<pre class="brush: js notranslate">const obj = Object.create({ foo: 1 }, { // властивість foo належить до ланцюжка прототипів об'єкта obj - bar: { - value: 2 // bar є неперелічуваною властивістю - }, - baz: { - value: 3, - enumerable: true // baz є перелічуваною особистою властивістю - } -}); - -const copy = Object.assign({}, obj); -console.log(copy); // { baz: 3 } -</pre> - -<h3 id="Прості_величини_буде_загорнуто_у_обєкти">Прості величини буде загорнуто у об'єкти</h3> - -<pre class="brush: js notranslate">const v1 = 'абв'; -const v2 = true; -const v3 = 10; -const v4 = Symbol('foo'); - -const obj = Object.assign({}, v1, null, v2, undefined, v3, v4); -// Прості величини будуть загорнуті, null та undefined ігноруються. -// Зауважте, лише рядкові обгортки можуть мати особисті неперелічувані властивості. -console.log(obj); // { "0": "а", "1": "б", "2": "в" } -</pre> - -<h3 id="Винятки_переривають_процес_копіювання">Винятки переривають процес копіювання</h3> - -<pre class="brush: js notranslate">const target = Object.defineProperty({}, 'foo', { - value: 1, - writable: false -}); // Властивість target.foo доступна лише для читання - -Object.assign(target, { bar: 2 }, { foo2: 3, foo: 3, foo3: 3 }, { baz: 4 }); -// TypeError: "foo" is read-only -// Викидається виняток під час присвоювання target.foo - -console.log(target.bar); // 2, перше джерело було успішно скопійовано -console.log(target.foo2); // 3, першу властивість другого джерела було успішно скопійовано -console.log(target.foo); // 1, тут трапилась помилка -console.log(target.foo3); // undefined, метод assign завершився, властивість foo3 не буде скопійована -console.log(target.baz); // undefined, третє джерело також не буде скопійоване -</pre> - -<h3 id="Копіювання_аксесорів">Копіювання аксесорів</h3> - -<pre class="brush: js notranslate">const obj = { - foo: 1, - get bar() { - return 2; - } -}; - -let copy = Object.assign({}, obj); -console.log(copy); -// { foo: 1, bar: 2 }, значенням copy.bar буде значення, що поверне геттер obj.bar - -// Ця функція присвоювання повністю скопіює дескриптори -function completeAssign(target, ...sources) { - sources.forEach(source => { - let descriptors = Object.keys(source).reduce((descriptors, key) => { - descriptors[key] = Object.getOwnPropertyDescriptor(source, key); - return descriptors; - }, {}); - // За замовчуванням, метод Object.assign копіює перелічувані властивості типу Symbol також - Object.getOwnPropertySymbols(source).forEach(sym => { - let descriptor = Object.getOwnPropertyDescriptor(source, sym); - if (descriptor.enumerable) { - descriptors[sym] = descriptor; - } - }); - Object.defineProperties(target, descriptors); - }); - return target; -} - -var copy = completeAssign({}, obj); -console.log(copy); -// { foo:1, get bar() { return 2 } } -</pre> - -<h2 id="Запасний_варіант_поліфіл">Запасний варіант (поліфіл)</h2> - -<p>Наведений {{Glossary("Polyfill", "поліфіл")}} не підтримує символьних властивостей, позаяк ES5 не має такого типу:</p> - -<pre class="brush: js notranslate">if (typeof Object.assign != 'function') { - // Має бути writable: true, enumerable: false, configurable: true - Object.defineProperty(Object, "assign", { - value: function assign(target, varArgs) { // .length функції дорівнює 2 - 'use strict'; - if (target == null || target === undefined) { - throw new TypeError('Cannot convert undefined or null to object'); - } - - var to = Object(target); - - for (var index = 1; index < arguments.length; index++) { - var nextSource = arguments[index]; - - if (nextSource != null && nextSource !== undefined) { - for (var nextKey in nextSource) { - // Запобігає помилок, коли hasOwnProperty заміщено - if (Object.prototype.hasOwnProperty.call(nextSource, nextKey)) { - to[nextKey] = nextSource[nextKey]; - } - } - } - } - return to; - }, - writable: true, - configurable: true - }); - } -</pre> - -<h2 id="Специфікації">Специфікації</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Специфікація</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-object.assign', 'Object.assign')}}</td> - </tr> - </tbody> -</table> - -<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2> - -<div class="hidden">Таблиця сумісності на цій сторінці створена зі структурованих даних. Якщо ви хочете долучитися до розробки цих даних, пропонуйте нам свої pull request до репозиторію <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div> - -<p>{{Compat("javascript.builtins.Object.assign")}}</p> - -<h2 id="Див._також">Див. також</h2> - -<ul> - <li>{{jsxref("Object.defineProperties()")}}</li> - <li><a href="/uk/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">Перелічуваність та належність властивостей</a></li> - <li><a href="/uk/docs/Web/JavaScript/Reference/Operators/Spread_syntax#Spread_in_object_literals">Розклад у об'єктних літералах</a></li> -</ul> |
