JS метод Array.flat()


Опис

Метод flat() служить для копіювання масивів. Цей метод забезпечує створення поверхневої копії вихідного масиву, зберігаючи при цьому всі його елементи. Відзначимо, що він не вносить жодних змін до початкового масиву.

Одна з особливостей flat() полягає в тому, що він автоматично ігнорує порожні позиції в розріджених масивах. Давайте розглянемо декілька прикладів:

  • Якщо рівень глибини depth дорівнює 1, порожні позиції на основному рівні та на першому рівні вкладеності будуть відкинуті.
  • Але на глибших рівнях вкладеності порожні позиції зберігатимуться разом з іншими елементами масиву.

Приклад:

let arr = [1, 2, , 4, [5, 6, , 8]];
let flattened = arr.flat();
console.log(flattened);  // Виведе: [1, 2, 4, 5, 6, , 8]

У цьому прикладі ми використовуємо flat() для масиву, який має порожні позиції та один вкладений масив. Результатом є масив без вкладеності, але з збереженими порожніми позиціями з глибших рівнів.

автор: Bond

Порада

Перед використанням методу flat(), переконайтесь, що ваш масив має вкладену структуру або підмасиви. Якщо ваш масив не має вкладеної структури, метод flat() не буде мати ефекту.

автор: Bond
Порада

Також flat() вимагає, щоб об'єкт this мав властивість length і інші властивості з цілочисельними ключами.

автор: Bond
Нотатка

Метод flat() може приймати необов'язковий параметр depth, який задає максимальний рівень вкладеності для вирівнювання масиву. За замовчуванням, якщо depth не задано, метод flat() вирівнює масив до однорівневого. Однак, ви можете задати більш глибокий рівень, якщо у вас є вкладені масиви з більш високим рівнем вкладеності.

автор: Bond
Нотатка

Пам'ятайте, що метод flat() не вносить зміни до початкового масиву, він створює новий масив, в якому всі елементи вирівняні. Якщо ви бажаєте змінити оригінальний масив, ви можете присвоїти результат виконання методу flat() цій самій змінній.

автор: Bond

Синтаксис

flat()
flat(depth)

Параметри

depth

Рівень глибини, який вказує, наскільки глибоко вкладена структура масиву має бути розгорнута. За замовчуванням depth становить 1.

автор: Bond

Повернення

array

Новий масив з об'єднаними в ньому елементами підмасивів.

автор: Bond

Переглядачі

Підтримка: стаціонарні переглядачі
Переглядач Google Chrome Mozilla Firefox Apple Safari Opera Microsoft EDGE
69 62 12 56 79
Підтримка: мобільні переглядачі
Переглядач Mobile Google Android Mobile Google Chrome Mobile Mozilla Firefox Mobile Apple Safari
69 69 62 12
Підтримка: серверні переглядачі
Переглядач Node.js Deno
11.0.0 1.0

Приклади

+ запропонувати свій приклад у пісочниці

Розгортання вкладених масивів

const arr1 = [1, 2, [3, 4]];
arr1.flat();
// [1, 2, 3, 4]

const arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]

const arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]

const arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Infinity);
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
автор: Bond

Приклад демонструє використання методу flat() для розгортання вкладених масивів. Перший приклад розгортає масив на один рівень глибини, а другий приклад розгортає масив на два рівні глибини.

автор: Bond

Метод flat() видаляє порожні слоти в масивах.

const arr5 = [1, 2, , 4, 5];
console.log(arr5.flat()); // [1, 2, 4, 5]

const array = [1, , 3, ["a", , "c"]];
console.log(array.flat()); // [ 1, 3, "a", "c" ]

const array2 = [1, , 3, ["a", , ["d", , "e"]]];
console.log(array2.flat()); // [ 1, 3, "a", ["d", empty, "e"] ]
console.log(array2.flat(2)); // [ 1, 3, "a", "d", "e"]
автор: Bond

Метод flat() зчитує властивість length цього об'єкта і потім отримує доступ до кожної властивості, ключем якої є невід'ємне ціле число менше за length. Якщо елемент не є масивом, він безпосередньо додається до результату. Якщо елемент є масивом, він розгортається відповідно до параметра глибини.

const arrayLike = {
  length: 3,
  0: [1, 2],
  // Подібні до масивів об'єкти не розгортаються
  1: { length: 2, 0: 3, 1: 4 },
  2: 5,
  3: 3, // ігнорується flat(), оскільки length дорівнює 3
};
console.log(Array.prototype.flat.call(arrayLike));
// [ 1, 2, { '0': 3, '1': 4, length: 2 }, 5 ]
автор: Bond

Коментарі

Коментарів ще немає — будьте першим!

Відповідь для

Увійдіть — коментар з'явиться одразу, без капчі й очікування перевірки.

Пропозиція правки

Ваша версія — : після перевірки замінить чинну. Нова порада чи нотатка — з'явиться на сторінці після перевірки.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Ваша версія секції «»: після перевірки замінить чинну.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Ваша версія опису «»: після перевірки замінить чинну.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Зворотний зв'язок
Вхід