1 files changed, 211 insertions, 0 deletions
diff --git a/files/uk/web/javascript/reference/functions/решта_параметрів/index.html b/files/uk/web/javascript/reference/functions/решта_параметрів/index.html
new file mode 100644
index 0000000000..f117aecc60
--- /dev/null
+++ b/files/uk/web/javascript/reference/functions/решта_параметрів/index.html
@@ -0,0 +1,211 @@
+---
+title: Залишкові параметри
+slug: Web/JavaScript/Reference/Functions/решта_параметрів
+tags:
+  - JavaScript
+  - Rest
+  - параметри
+  - функції
+translation_of: Web/JavaScript/Reference/Functions/rest_parameters
+---
+<div>{{jsSidebar("Functions")}}</div>
+
+<div>Синтаксис <strong>залишкових параметрів</strong> дозволяє представити невизначену кількість аргументів у вигляді масиву.</div>
+
+<div></div>
+
+<p>{{EmbedInteractiveExample("pages/js/functions-restparameters.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">function f(a, b, ...theArgs) {
+  // ...
+}
+</pre>
+
+<h2 id="Опис">Опис</h2>
+
+<p>Перед останнім параметром функції може стояти <code>...</code>, в результаті решта аргументів (наданих користувачем) будуть розміщені у  "стандартному" масиві JavaScript.</p>
+
+<p>Лише останній параметр може бути "залишковим".</p>
+
+<pre class="brush: js notranslate">function myFun(a, b, ...manyMoreArgs) {
+  console.log("a", a);
+  console.log("b", b);
+  console.log("manyMoreArgs", manyMoreArgs);
+}
+
+myFun("один", "два", "три", "чорити", "п'ять", "шість");
+
+// Виведе:
+// a, один
+// b, два
+// manyMoreArgs, ["три", "чотири", "п'ять", "шість"]</pre>
+
+<h3 id="Різниця_між_залишковими_параметрами_та_обєктом_arguments">Різниця між залишковими параметрами та об'єктом <code>arguments</code></h3>
+
+<p>Існують три основні відмінності між залишковими параметрами та об'єктом {{jsxref("Functions/arguments", "arguments")}}:</p>
+
+<ul>
+ <li>залишковими є лише ті параметри, яким не надали окремого імені, в той час, як об'єкт <code>arguments</code> містить усі аргументи, передані у функцію;</li>
+ <li>об'єкт <code>arguments</code> не є справжнім масивом, в той час, як залишкові параметри є екземплярами {{jsxref("Global_Objects/Array", "Array")}}, тобто, методи на кшталт {{jsxref("Array.sort", "sort")}}, {{jsxref("Array.map", "map")}}, {{jsxref("Array.forEach", "forEach")}} чи {{jsxref("Array/pop", "pop")}} можуть викликатись безпосередньо на них;</li>
+ <li>об'єкт <code>arguments</code> має також власну, специфічну функціональність (наприклад, властивість <code>callee</code>).</li>
+</ul>
+
+<h3 id="Від_arguments_до_масиву">Від arguments до масиву</h3>
+
+<p>Залишкові параметри були запроваджені, щоб зменшити кількість шаблонного коду, спричиненого об'єктом arguments.</p>
+
+<pre class="brush: js notranslate">// До появи залишкових параметрів, "arguments" можна було перетворити на масив таким чином:
+
+function f(a, b) {
+
+  let normalArray = Array.prototype.slice.call(arguments);
+  // -- або --
+  let normalArray = [].slice.call(arguments);
+  // -- або --
+  let normalArray = Array.from(arguments);
+
+  let first = normalArray.shift(); // OK, вертає перший аргумент
+  let first = arguments.shift(); // ERROR (arguments не є справжнім масивом)
+}
+
+// Тепер ми легко можемо отримати звичайний масив за допомогою залишкових параметрів
+
+function f(...args) {
+  let normalArray = args;
+  let first = normalArray.shift(); // OK, вертає перший аргумент
+}</pre>
+
+<h2 id="Приклади">Приклади</h2>
+
+<h3 id="Використання_залишкових_параметрів">Використання залишкових параметрів</h3>
+
+<p>У цьому прикладі перший аргумент відповідає <code>"a"</code>, а другий <code>"b"</code>, отже, ці іменовані аргументи можуть використовуватись як звичайні.</p>
+
+<p>Однак, третій аргумент, <code>"manyMoreArgs"</code>, буде масивом, який містить 3-й, 4-й, 5-й, 6-й ... n-й -- стільки аргументів, скільки надасть користувач.</p>
+
+<pre class="brush: js notranslate">function myFun(a, b, ...manyMoreArgs) {
+  console.log("a", a);
+  console.log("b", b);
+  console.log("manyMoreArgs", manyMoreArgs);
+}
+
+myFun("один", "два", "три", "чотири", "п'ять", "шість");
+
+// a, один
+// b, два
+// manyMoreArgs, ["три", "чотири", "п'ять", "шість"]</pre>
+
+<p>Нижче... хоча тут всього одне значення, останній аргумент все одно додається у масив.</p>
+
+<pre class="brush: js notranslate">// використовуємо ту саму функцію з наведеного вище прикладу
+
+myFun("один", "два", "три");
+
+// a, один
+// b, два
+// manyMoreArgs, ["три"]</pre>
+
+<p>Нижче... третій аргумент не був переданий, але "manyMoreArgs" все одно є масивом (хоча й порожнім).</p>
+
+<pre class="brush: js notranslate">// використовуємо ту саму функцію з наведеного вище прикладу
+
+myFun("один", "два");
+
+// a, один
+// b, два
+// manyMoreArgs, []</pre>
+
+<h3 id="Кількість_аргументів">Кількість аргументів</h3>
+
+<p>Оскільки <code>theArgs</code> є масивом, кількість його елементів надається властивістю <code>length</code>:</p>
+
+<pre class="brush: js notranslate">function fun1(...theArgs) {
+  console.log(theArgs.length);
+}
+
+fun1()         // 0
+fun1(5)        // 1
+fun1(5, 6, 7)  // 3</pre>
+
+<h3 id="Звичайний_параметр_та_залишкові_параметри">Звичайний параметр та залишкові параметри</h3>
+
+<p>У наступному прикладі залишковий параметр використовується, щоб зібрати усі аргументи після першого у масиві. Далі кожен з них помножується на перший параметр, і масив повертається:</p>
+
+<pre class="brush: js notranslate">function multiply(multiplier, ...theArgs) {
+  return theArgs.map(function(element) {
+    return multiplier * element;
+  });
+}
+
+let arr = multiply(2, 1, 2, 3);
+console.log(arr); // [2, 4, 6]</pre>
+
+<h3 id="Використання_з_обєктом_arguments">Використання з об'єктом arguments</h3>
+
+<p>Методи <code>Array</code> можуть використовуватись на залишкових параметрах, але не на об'єкті <code>arguments</code>:</p>
+
+<pre class="brush: js notranslate">function sortRestArgs(...theArgs) {
+  var sortedArgs = theArgs.sort();
+  return sortedArgs;
+}
+
+console.log(sortRestArgs(5, 3, 7, 1)); // виводить [1, 3, 5, 7]
+
+function sortArguments() {
+  var sortedArgs = arguments.sort();
+  return sortedArgs; // цього ніколи не станеться
+}
+
+// викидає TypeError: arguments.sort is not a function
+console.log(sortArguments(5, 3, 7, 1));
+</pre>
+
+<p>Щоб скористатись методами <code>Array</code> на об'єкті <code>arguments</code>, він спочатку має бути перетворений на справжній масив.</p>
+
+<pre class="brush: js notranslate">function sortArguments() {
+  var args = Array.from(arguments);
+  var sortedArgs = args.sort();
+  return sortedArgs;
+}
+console.log(sortArguments(5, 3, 7, 1)); // [1, 3, 5, 7]</pre>
+
+<h2 id="Специфікації">Специфікації</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Специфікація</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-function-definitions', 'Function Definitions')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2>
+
+<div>
+<div>
+
+
+<p>{{Compat("javascript.functions.rest_parameters")}}</p>
+</div>
+</div>
+
+<h2 id="Див._також">Див. також</h2>
+
+<ul>
+ <li><a href="/uk/docs/Web/JavaScript/Reference/Operators/Spread_syntax" title="spread operator">Оператор розкладу</a> (також ‘<code>...</code>’)</li>
+ <li><a href="/uk/docs/Web/JavaScript/Reference/Functions/arguments" title="arguments">Об'єкт arguments</a></li>
+ <li><a href="/uk/docs/Web/JavaScript/Reference/Global_Objects/Array" title="Array">Array</a></li>
+ <li><a href="/uk/docs/Web/JavaScript/Reference/Functions" title="Functions and function scope">Функції</a></li>
+ <li><a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:rest_parameters">Original proposal at ecmascript.org</a></li>
+ <li><a class="external" href="http://javascriptweblog.wordpress.com/2011/01/18/javascripts-arguments-object-and-beyond/">JavaScript arguments object and beyond</a></li>
+ <li><a href="/uk/docs/Web/JavaScript/Reference/Operators/Деструктуризація">Деструктуризаційне присвоєння</a></li>
+</ul>