diff options
Diffstat (limited to 'files/uk/web/javascript/reference/trailing_commas/index.html')
-rw-r--r-- | files/uk/web/javascript/reference/trailing_commas/index.html | 171 |
1 files changed, 171 insertions, 0 deletions
diff --git a/files/uk/web/javascript/reference/trailing_commas/index.html b/files/uk/web/javascript/reference/trailing_commas/index.html new file mode 100644 index 0000000000..3daa0363b5 --- /dev/null +++ b/files/uk/web/javascript/reference/trailing_commas/index.html @@ -0,0 +1,171 @@ +--- +title: Кінцеві коми +slug: Web/JavaScript/Reference/Trailing_commas +tags: + - ECMAScript2017 + - ECMAScript5 + - JavaScript + - Синтаксис + - кома + - кінцева кома +translation_of: Web/JavaScript/Reference/Trailing_commas +--- +<div>{{JsSidebar("More")}}</div> + +<p><strong>Кінцеві коми</strong> (іноді їх називають "заключними комами") можуть бути корисними для додавання нових елементів, параметрів чи властивостей у коді JavaScript. Якщо ви хочете додати нову властивість, ви можете просто додати новий рядок, не змінюючи перед цим попередній рядок, якщо цей рядок вже використовує кінцеву кому. Це робить контроль версій зрозумілішим, а редагування коду може бути менш проблемним.</p> + +<p>Кінцеві коми були дозволені у масивних літералах JavaScript з самого початку, а пізніше вони були додані до об'єктних літералів (ECMAScript 5) та нещодавно (ECMAScript 2017) до параметрів функцій.</p> + +<p><a href="/uk/docs/Glossary/JSON">JSON</a>, однак, не дозволяє кінцеві коми.</p> + +<h2 id="Синтаксис">Синтаксис</h2> + +<pre class="syntaxbox notranslate">,</pre> + +<h2 id="Приклади">Приклади</h2> + +<h3 id="Кінцеві_коми_у_літералах">Кінцеві коми у літералах</h3> + +<h4 id="Масиви">Масиви</h4> + +<p>JavaScript ігнорує кінцеві коми у масивах:</p> + +<pre class="brush: js notranslate">var arr = [ + 1, + 2, + 3, +]; + +arr; // [1, 2, 3] +arr.length; // 3</pre> + +<p>Якщо використовується більше однієї кінцевої коми, утворюється пропуск (або діра). Масив з дірами називається <em>розрідженим</em> (<em>щільний</em> масив не має дір). Під час перебору масивів, наприклад, за допомогою {{jsxref("Array.prototype.forEach()")}} або {{jsxref("Array.prototype.map()")}}, діри в масивах пропускаються.</p> + +<pre class="brush: js notranslate">var arr = [1, 2, 3,,,]; +arr.length; // 5 +</pre> + +<h4 id="Обєкти">Об'єкти</h4> + +<p>Починаючи з ECMAScript 5, кінцеві коми у об'єктних літералах також дозволені:</p> + +<pre class="brush: js notranslate">var object = { + foo: "bar", + baz: "qwerty", + age: 42, +};</pre> + +<h3 id="Кінцеві_коми_у_функціях">Кінцеві коми у функціях</h3> + +<p>ECMAScript 2017 дозволяє кінцеві коми у списку параметрів функцій.</p> + +<h4 id="Визначення_параметрів">Визначення параметрів</h4> + +<p>Наступні пари визначень функцій є дозволеними та еквівалентні одне одному. Кінцеві коми не впливають на властивість <code>length</code> оголошень функцій або на їхній об'єкт <code>arguments</code>.</p> + +<pre class="brush: js notranslate">function f(p) {} +function f(p,) {} + +(p) => {}; +(p,) => {}; +</pre> + +<p>Кінцеві коми також працюють у <a href="/uk/docs/Web/JavaScript/Reference/Functions/Method_definitions">визначеннях методів</a> для класів чи об'єктів:</p> + +<pre class="brush: js notranslate">class C { + one(a,) {} + two(a, b,) {} +} + +var obj = { + one(a,) {}, + two(a, b,) {}, +}; +</pre> + +<h4 id="Виклики_функцій">Виклики функцій</h4> + +<p>Наступні пари викликів функцій є дозволеними та еквівалентні один одному.</p> + +<pre class="brush: js notranslate">f(p); +f(p,); + +Math.max(10, 20); +Math.max(10, 20,); +</pre> + +<h4 id="Недозволені_кінцеві_коми">Недозволені кінцеві коми</h4> + +<p>Визначення параметрів функцій або виклики функцій, які містять лише кому, викинуть {{Jsxref("SyntaxError")}}. Крім того, при використанні <a href="/uk/docs/Web/JavaScript/Reference/Functions/решта_параметрів">залишкових параметрів</a> кінцеві коми недозволені:</p> + +<pre class="brush: js example-bad notranslate">function f(,) {} // SyntaxError: missing formal parameter +(,) => {}; // SyntaxError: expected expression, got ',' +f(,) // SyntaxError: expected expression, got ',' + +function f(...p,) {} // SyntaxError: parameter after rest parameter +(...p,) => {} // SyntaxError: expected closing parenthesis, got ',' +</pre> + +<h3 id="Кінцеві_коми_у_деструктуризації">Кінцеві коми у деструктуризації</h3> + +<p>Кінцеві коми також дозволені по ліву сторону при використанні <a href="/uk/docs/Web/JavaScript/Reference/Operators/Деструктуризація">деструктуризаційного присвоєння</a>:</p> + +<pre class="brush: js notranslate">// деструктуризація масиву з кінцевою комою +[a, b,] = [1, 2]; + +// деструктуризація об'єкта з кінцевою комою +var o = { + p: 42, + q: true, +}; +var {p, q,} = o; +</pre> + +<p>Знову ж таки, при використання залишкового елемента, буде викинуто {{jsxref("SyntaxError")}}:</p> + +<pre class="brush: js example-bad notranslate">var [a, ...b,] = [1, 2, 3]; +// SyntaxError: rest element may not have a trailing comma</pre> + +<h3 id="Кінцеві_коми_у_JSON">Кінцеві коми у JSON</h3> + +<p>Кінцеві коми у об'єктах були введені лише починаючи з ECMAScript 5. Оскільки JSON базується на синтаксисі JavaScript, що існував до ES5, <strong>кінцеві коми не дозволені у JSON</strong>.</p> + +<p>Обидва рядки викинуть <code>SyntaxError</code>:</p> + +<pre class="brush: js example-bad notranslate">JSON.parse('[1, 2, 3, 4, ]'); +JSON.parse('{"foo" : 1, }'); +// SyntaxError JSON.parse: unexpected character +// at line 1 column 14 of the JSON data +</pre> + +<p>Уникайте кінцевих ком, щоб розібрати JSON коректно:</p> + +<pre class="brush: js example-good notranslate">JSON.parse('[1, 2, 3, 4 ]'); +JSON.parse('{"foo" : 1 }');</pre> + +<h2 id="Специфікації">Специфікації</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Специфікація</th> + </tr> + <tr> + <td>{{SpecName('ESDraft')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2> + +<div> + + +<p>{{Compat("javascript.grammar.trailing_commas")}}</p> +</div> + +<h2 id="Див._також">Див. також</h2> + +<ul> + <li>Початкова пропозиція ECMAScript: <a href="https://github.com/tc39/proposal-trailing-function-commas">кінцеві коми у функції</a>, автор Jeff Morrison</li> +</ul> |