diff options
| author | Ryan Johnson <rjohnson@mozilla.com> | 2021-04-29 16:16:42 -0700 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2021-04-29 16:16:42 -0700 |
| commit | 95aca4b4d8fa62815d4bd412fff1a364f842814a (patch) | |
| tree | 5e57661720fe9058d5c7db637e764800b50f9060 /files/uk/web/javascript/reference/global_objects/array/foreach | |
| parent | ee3b1c87e3c8e72ca130943eed260ad642246581 (diff) | |
| download | translated-content-95aca4b4d8fa62815d4bd412fff1a364f842814a.tar.gz translated-content-95aca4b4d8fa62815d4bd412fff1a364f842814a.tar.bz2 translated-content-95aca4b4d8fa62815d4bd412fff1a364f842814a.zip | |
remove retired locales (#699)
Diffstat (limited to 'files/uk/web/javascript/reference/global_objects/array/foreach')
| -rw-r--r-- | files/uk/web/javascript/reference/global_objects/array/foreach/index.html | 290 |
1 files changed, 0 insertions, 290 deletions
diff --git a/files/uk/web/javascript/reference/global_objects/array/foreach/index.html b/files/uk/web/javascript/reference/global_objects/array/foreach/index.html deleted file mode 100644 index 97a354787f..0000000000 --- a/files/uk/web/javascript/reference/global_objects/array/foreach/index.html +++ /dev/null @@ -1,290 +0,0 @@ ---- -title: Array.prototype.forEach() -slug: Web/JavaScript/Reference/Global_Objects/Array/forEach -tags: - - ECMAScript5 - - JavaScript - - Method - - Prototype - - Довідка -translation_of: Web/JavaScript/Reference/Global_Objects/Array/forEach ---- -<div>{{JSRef}}</div> - -<p>Метод <code><strong>forEach()</strong></code> виконує надану функцію один раз для кожного елемента масиву.</p> - -<p>{{EmbedInteractiveExample("pages/js/array-foreach.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"><var>arr.forEach(callback(currentValue [, index [, array]])[, thisArg]);</var></pre> - -<h3 id="Параметри">Параметри</h3> - -<dl> - <dt><code>callback</code></dt> - <dd>Функція, що виконується для кожного елемента. Приймає три аргументи:</dd> - <dd> - <dl> - <dt><code>currentValue</code></dt> - <dd>Черговий елемент масиву, що обробляється.</dd> - <dt><code>index</code> {{optional_inline}}</dt> - <dd>Індекс чергового елемента в масиві.</dd> - <dt><code>array</code> {{optional_inline}}</dt> - <dd>Масив, для якого було викликано <code>forEach()</code>.</dd> - </dl> - </dd> - <dt><code>thisArg</code> {{optional_inline}}</dt> - <dd> - <p>Значення, що використовується як <code><strong>this</strong></code> при виконанні <code>callback</code>.</p> - </dd> -</dl> - -<h3 id="Вертає">Вертає</h3> - -<p><code>undefined</code>.</p> - -<h2 id="Опис">Опис</h2> - -<p>Метод <code>forEach()</code> викликає надану функцію <code>callback</code> для кожного елемента масиву у порядку зростання. Оминає властивості, які було видалено або не було <abbr title="ініціалізовано">започатковано</abbr> (тобто, в розріджених масивах, <a href="/uk/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach#sparseArray">дивіться приклад, наведений нижче</a>).</p> - -<p>Функція <em><code>callback</code></em> викликається з трьома аргументами:</p> - -<ol> - <li>значення елемента;</li> - <li>індекс елемента;</li> - <li>масив, що перебирається.</li> -</ol> - -<p>Якщо для <code>forEach()</code> вказано параметр <em><code>thisArg</code></em>, його буде використано як <code>this</code> для функції <code>callback</code>. Зрештою значення <code>this</code> для функції <em><code>callback</code></em> визначатиметься відповідно до <a href="/uk/docs/Web/JavaScript/Reference/Operators/this">загальних правил</a>.</p> - -<p>Множина індексів елементів, що їх перебиратиме <code>forEach()</code> з'ясовується ще до першого виклику <em><code>callback</code></em>. Елементи, додані після здійснення виклику <code>forEach()</code>, буде знехтувано (<em><code>callback</code></em> для жодного з них не викликатиметься). Якщо змінити або видалити якийсь з елементів масиву, до функції <code>callback</code> потрапить те значення елемента, яке він мав безпосередньо перед відповідним викликом <code>callback</code>. Якщо елемент видалено до відвідування, відвідано не буде. Якщо вже відвіданий елемент видалено упродовж перебирання (наприклад, за допомогою {{jsxref("Array.prototype.shift()", "shift()")}}), подальші елементи будуть пропущені — <a href="#Якщо_масив_змінено_під_час_перебору_деякі_елементи_може_бути_пропущено">дивіться приклади нижче у статті</a>.</p> - -<p>Метод <code>forEach()</code> виконує функцію <em><code>callback</code></em> один раз для кожного елемента масиву. На відміну від {{jsxref("Array.prototype.map()", "map()")}} чи {{jsxref("Array.prototype.reduce()", "reduce()")}}, він завжди вертає значення {{jsxref("undefined")}}, тож продовжити ланцюжок викликів після нього неможливо. Досить типовим є виклик <code>forEach()</code> наприкінці ланцюжка методів з метою виконання додаткових дій.</p> - -<p>Сам метод <code>forEach()</code> не змінює масив, на якому його викликано, втім усередині функції <em><code>callback</code></em> це можливо.</p> - -<div class="note"> -<p><strong>Заувага:</strong> Зупинити чи перервати цикл <code>forEach()</code> неможливо без викидання винятку. Якщо вам це потрібно, метод <code>forEach()</code> — не ліпший вибір. </p> - -<p>Завчасне переривання може бути виконане за допомогою:</p> - -<ul> - <li>Простого циклу <a href="/uk/docs/Web/JavaScript/Reference/Statements/for">for</a></li> - <li>Циклів <a href="/uk/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a> / <a href="/uk/docs/Web/JavaScript/Reference/Statements/for...in">for..in</a></li> - <li>{{jsxref("Array.prototype.every()")}}</li> - <li>{{jsxref("Array.prototype.some()")}}</li> - <li>{{jsxref("Array.prototype.find()")}}</li> - <li>{{jsxref("Array.prototype.findIndex()")}}</li> -</ul> - -<p>Методи масивів: {{jsxref("Array.prototype.every()", "every()")}}, {{jsxref("Array.prototype.some()", "some()")}}, {{jsxref("Array.prototype.find()", "find()")}} та {{jsxref("Array.prototype.findIndex()", "findIndex()")}} перевіряють елементи масиву функцією-предикатом, яка повертає правдиве значення, якщо наступна ітерація необхідна.</p> -</div> - -<h2 id="Приклади">Приклади</h2> - -<h3 id="sparseArray" name="sparseArray">Операція не виконується для неініціалізованих значень (розріджені масиви)</h3> - -<pre class="brush: js">const arraySparse = [1,3,,7]; -let numCallbackRuns = 0; - -arraySparse.forEach(function(element){ - console.log(element); - numCallbackRuns++; -}); - -console.log("numCallbackRuns: ", numCallbackRuns); - -// 1 -// 3 -// 7 -// numCallbackRuns: 3 -// коментар: як бачите, пропущене значення між 3 та 7 не викликало функцію.</pre> - -<h3 id="Перетворення_циклу_for_на_forEach">Перетворення циклу for на forEach</h3> - -<pre class="brush: js">const items = ['щось', 'то', 'має', 'бути']; -const copy = []; - -// було -for (let i = 0; i < items.length; i++) { - copy.push(items[i]) -} - -// стане -items.forEach(function(item) { - copy.push(item) -});</pre> - -<h3 id="Друк_вмісту_масиву">Друк вмісту масиву</h3> - -<div class="blockIndicator note"> -<p><strong>Заувага:</strong> Для того, щоб відобразити вміст масиву у консолі, ви можете скористатись методом {{domxref("Console/table", "console.table()")}}, який виведе відформатовану версію масиву. Наступний приклад ілюструє інший спосіб це зробити, за допомогою <code>forEach()</code>.</p> -</div> - -<p>Наведений код виводить значення кожного елемента масиву з нового рядка:</p> - -<pre class="brush:js">function logArrayElements(element, index, array) { - console.log('array[' + index + '] = ' + element); -} - -// Завважте, що індекс 2 буде пропущено, -// позаяк елемента на тому місці в масиві немає. -[2, 5, , 9].forEach(logArrayElements); - -// Буде виведено у консоль: -// array[0] = 2 -// array[1] = 5 -// array[3] = 9 -</pre> - -<h3 id="Використання_thisArg">Використання <em><code>thisArg</code></em></h3> - -<p>Наведений приклад змінює властивості об'єкта відповідно до кожного елемента в отриманому масиві:</p> - -<pre class="brush:js">function Counter() { - this.sum = 0; - this.count = 0; -} - -Counter.prototype.add = function(array) { - array.forEach(function(entry) { - this.sum += entry; - ++this.count; - }, this); - // ^---- Зверніть увагу! -}; - -const obj = new Counter(); -obj.add([2, 5, 9]); -obj.count; -// 3 -obj.sum; -// 16 -</pre> - -<p>Оскільки для <code>forEach()</code> вказано параметр <code>thisArg</code>, для кожного виклику <code>callback</code> (тут безіменної функції) він вживатиметься як <code>this</code>.</p> - -<div class="note"> -<p>Якщо передавати аргумент функції за допомогою <a href="/uk/docs/Web/JavaScript/Reference/Functions/Стрілкові_функції">стрілкового запису функції</a>, то параметр <em><code>thisArg</code></em> можна не вказувати, позаяк стрілкова функція лексично прив'язує значення {{jsxref("Operators/this", "this")}}.</p> -</div> - -<h3 id="Функція_копіювання_об'єкта">Функція копіювання об'єкта</h3> - -<p>Наступний код створює копію наданого об'єкта. Існує чимало способів створення копії об'єкта. Наведений приклад є лише одним з них і насправді призначений лише для наочного пояснення того, як працює <code>Array.prototype.forEach()</code> на прикладі використання нових функцій ECMAScript 5 з <code>Object.*</code> для роботи з керованими властивостями:</p> - -<pre class="brush: js">function copy(obj) { - const copy = Object.create(Object.getPrototypeOf(obj)); - const propNames = Object.getOwnPropertyNames(obj); - - propNames.forEach(function(name) { - const desc = Object.getOwnPropertyDescriptor(obj, name); - Object.defineProperty(copy, name, desc); - }); - - return copy; -} - -const obj1 = {a: 1, b: 2}; -const obj2 = copy(obj1); // obj2 тепер схожий на obj1 -</pre> - -<h3 id="Якщо_масив_змінено_під_час_перебору_інші_елементи_може_бути_пропущено">Якщо масив змінено під час перебору, інші елементи може бути пропущено</h3> - -<p>Наведений приклад виводить у консоль послідовно "перший", "другий" та "четвертий". Коли перебір сягне другого елемента (що має значення "другий"), виклик <code>words.shift()</code> видалить перший елемент масиву, а всі, що лишаться, посунуться на одне місце ліворуч — "четвертий" стане наступним (після поточного), і "третій" таким чином буде пропущено:</p> - -<pre class="brush:js">var words = ['перший', 'другий', 'третій', 'четвертий']; - -words.forEach(function(word) { - console.log(word); - - if (word === 'другий') { - words.shift(); - } -}); - -// перший -// другий -// четвертий -</pre> - -<h3 id="Вирівнювання_масиву">Вирівнювання масиву</h3> - -<p>Даний приклад наведено суто для навчальння. Якщо вам потрібно вирівняти масив вбудованими методами, ви можете скористатись методом {{jsxref("Array.prototype.flat()")}} (очікується у ES2019 та вже реалізований у деяких переглядачах).</p> - -<pre class="brush: js">/** -* Вирівнює переданий масив у одномірний -* -* @params {array} arr -* @returns {array} -*/ -function flatten(arr) { - const result = []; - - arr.forEach((i) => { - if (Array.isArray(i)) { - result.push(...flatten(i)) - } else { - result.push(i) - } - }); - - return result; -} - -// Використання -const problem = [1, 2, 3, [4, 5, [6, 7], 8, 9]] - -flatten(problem) // [1, 2, 3, 4, 5, 6, 7, 8, 9]</pre> - -<h2 id="Специфікації">Специфікації</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Специфікація</th> - <th scope="col">Статус</th> - <th scope="col">Коментар</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-array.prototype.foreach', 'Array.prototype.forEach')}}</td> - <td>{{Spec2('ESDraft')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-array.prototype.foreach', 'Array.prototype.forEach')}}</td> - <td>{{Spec2('ES6')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('ES5.1', '#sec-15.4.4.18', 'Array.prototype.forEach')}}</td> - <td>{{Spec2('ES5.1')}}</td> - <td>Початкова виознака. Запроваджено у JavaScript 1.6.</td> - </tr> - </tbody> -</table> - -<h2 id="Підтримка_веб-переглядачами">Підтримка веб-переглядачами</h2> - -<div> -<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.Array.forEach")}}</p> -</div> - -<h2 id="Див._також">Див. також</h2> - -<ul> - <li>{{jsxref("Array.prototype.find()")}}</li> - <li>{{jsxref("Array.prototype.findIndex()")}}</li> - <li>{{jsxref("Array.prototype.map()")}}</li> - <li>{{jsxref("Array.prototype.filter()")}}</li> - <li>{{jsxref("Array.prototype.every()")}}</li> - <li>{{jsxref("Array.prototype.some()")}}</li> - <li>{{jsxref("Map.prototype.forEach()")}}</li> - <li>{{jsxref("Set.prototype.forEach()")}}</li> -</ul> |
