Как склеить два массива js

Как склеить 2 массива на js

Есть ещё вариант склеить 2 массива — воспользоваться оператором spread:
Выглядит это следующим образом:

const result = [. array1, . array2]; 

Порядок, в котором вы перечисляете массивы при помощи оператора spread, имеет значение!
Элементы массива вставляются в том порядке в котором идут переменные этих массивов.
Обратимся к примеру:

const animals1 = ['cat', 'dog']; const animals2 = ['hamster', 'parrot']; const allAnimals = [. animals1, . animals2]; console.log(allAnimals); // => ['cat', 'dog', 'hamster', 'parrot'] 

Для справки: spread оператор позволяет объединять 2 и более массивов.

27 октября 2021

Самый простой вариант это использовать метод concat() . Он добавляет к массиву на котором был вызван массив, переданный в качестве аргумента.

const collection1 = ['hexlet', 'is']; const collection2 = ['awesome']; const collection3 = collection1.concat(collection2); console.log(collection3); // => ["hexlet", "is", "awesome"] 

Соединить два массива в специальном порядке [JS] [дубликат]

Кажется, сортировка здесь не соответствует цели. Если я правильно понял, автору вопроса нужно просто «переплести» массивы. Чтобы за каждым элементом первого массива следовал элемент второго с тем же индексом.

1 авг 2020 в 21:58

@vsemozhebuty Не понятно какой должен быть результат. Я думал функция sort сделает по убыванию :(( сейчас уберу.

1 авг 2020 в 22:03

Да, в вопросе не совсем точно определены требования, но пример результата дан, его можно проанализировать.

1 авг 2020 в 22:05
@vsemozhebuty не буду спорить как скажите
1 авг 2020 в 22:05

Важное на Мете

Связанные

Похожие

Дизайн сайта / логотип © 2023 Stack Exchange Inc; пользовательские материалы лицензированы в соответствии с CC BY-SA . rev 2023.10.27.43697

Нажимая «Принять все файлы cookie» вы соглашаетесь, что Stack Exchange может хранить файлы cookie на вашем устройстве и раскрывать информацию в соответствии с нашей Политикой в отношении файлов cookie.

Как объединить массивы в JavaScript

Массивы по своей сути это структура данных, представляющая упорядоченную коллекцию индексированных элементов.

И довольно часто в практике возникает необходимость объединения массивов — когда два и более отдельных массивов превращаются в большой массив содержащий все элементы первоначальных массивов.

Например объединение массива [1,2] и [5,6] приведет к появлению массива [1,2,5,6]

Мы рассмотрим три способа объединить массивы в JavaScript: 2 иммутабельных (новый массив создается после объединения)

Способ 1 — объединение массивов через оператор spread

Если вам нужен один хороший способ объединения массивов в JavaScript, тогда оператор spread — ваш выбор.

Напишите внутри массива две или более переменных с префиксом в виде spread оператора . и JavaScript объединит их в один новый массив. Собственно синтаксис:

const result = [. array1, . array2];

Как пример предположим у нас есть два массива содержащих фамилии студентов students1 и students2

const students1 = ['Иванов', 'Сидоров']; const students2 = ['Петров', 'Курочкина']; const all = [. students1, . students2]; all; // ['Иванов', 'Сидоров', 'Петров', 'Курочкина'] 

const all = [. students1, . students2] создает новый массив содержащий элементы исходных массивов students1 и students2

Порядок в котором вы перечисляете массивы при помощи оператора spread имеет значение! Элементы массива вставляются в том порядке в котором идут переменные этих массивов.

В нашем примере поменяем порядок:

const students1 = ['Иванов', 'Сидоров']; const students2 = ['Петров', 'Курочкина']; const all = [. students2, . students1]; all; // ['Петров', 'Курочкина', 'Иванов', 'Сидоров'] 

Spread оператор позволяет объединять 2 и более массивов:

const newArray = [. array1, . array2, . array3, . arrayN];

Способ 2 — объединение массивов методом array.concat()

Если вы предпочитаете функциональные методы объединения массивов, то можете использовать array1.concat(array2) метод:

const newArray = array1.concat(array2);

или в другом варианте

const newArray = [].concat(array1, array2);

array.concat() не изменяет исходные массивы, а формирует новый имеющий в составе элементы объединяемых массивов.

Давайте попробуем повторить пример из первого способа:

const students1 = ['Иванов', 'Сидоров']; const students2 = ['Петров', 'Курочкина']; const all_1 = students1.concat(students2); const all_2 = [].concat(students1,students2); all_1; // ['Иванов', 'Сидоров', 'Петров', 'Курочкина'] all_2; // ['Иванов', 'Сидоров', 'Петров', 'Курочкина'] 

Метод concat позволяет объединять более двух массивов:

const newArray = [].concat(array1, array2, array3, arrayN);

Способ 3 — объединение массивов через метод array.push()

Как мы видели ранее два предыдущих способа создают новый массив содержащий исходные, но иногда необходимо не создавать новый массив, а добавить один массив в другой. В этом случает один из исходных массивов будет изменен.

Вы наверняка знаете что метод array.push(item) добавляет к имеющемуся массиву новый элемент и ставит его в конец массива.

const students = ['Иванов']; students.push('Сидоров'); students; // ['Иванов', 'Сидоров'] 

Благодаря тому факту что array.push(item1, item2, . itemN) может принимать множественное количество элементов, мы можем запушить целый массив через оператор spread примененный к аргументу:

array1.push(. array2); 

И если брать пример с нашими студентами то получим:

const students1 = ['Иванов', 'Сидоров']; const students2 = ['Петров', 'Курочкина']; students1.push(. students2); students1; // ['Иванов', 'Сидоров', 'Петров', 'Курочкина'] 

А какой из способов используете вы? Поделитесь в комментариях

Статья обновлена 28/12/2022

Сергей Мочалов

Веб-разработчик. Создаю и поддерживаю сайты для клиентов с 2009 года

Array.prototype.concat()

Метод concat() возвращает новый массив, состоящий из массива, на котором он был вызван, соединённого с другими массивами и/или значениями, переданными в качестве аргументов.

Интерактивный пример

Синтаксис

var new_array = old_array.concat(value1[, value2[, . [, valueN]]])

Параметры

Массивы и/или значения, соединяемые в новый массив. Смотрите описание ниже.

Возвращаемое значение

Описание

Метод concat создаёт новый массив, состоящий из элементов в объекте, на котором он был вызван, за которыми по порядку следуют, для каждого аргумента, все его элементы (если аргумент является массивом), либо сам аргумент (если он массивом не является).

Метод concat не изменяет данный массив или любой из массивов, переданных в аргументах, а вместо этого возвращает поверхностную копию, содержащую копии тех элементов, что были объединены с исходными массивами. Элементы оригинальных массивов копируются в новый массив по следующим правилам:

• Ссылки на объекты (но не фактические объекты): метод concat копирует ссылки на объекты в новый массив. И оригинал, и новый массив ссылаются на один и тот же объект. То есть, если объект по ссылке будет изменён, изменения будут видны и в новом, и в исходном массивах.
• Строки, числа и булевы значения (но не объекты String , Number или Boolean ): метод concat копирует значения строк и чисел в новый массив.

Примечание: Соединение массивов и/или значений в новый массив оставит соединяемые массивы/значения неизменными. Кроме того, любая операция над новым массивом (если только элемент не является ссылкой) не будет затрагивать исходные массивы и наоборот.

Примеры

Соединение двух массивов

Следующий код соединяет два массива:

var alpha = ["a", "b", "c"], numeric = [1, 2, 3]; var alphaNumeric = alpha.concat(numeric); console.log(alphaNumeric); // Результат: ['a', 'b', 'c', 1, 2, 3] 

Соединение трёх массивов

Следующий код соединяет три массива:

var num1 = [1, 2, 3], num2 = [4, 5, 6], num3 = [7, 8, 9]; var nums = num1.concat(num2, num3); console.log(nums); // Результат: [1, 2, 3, 4, 5, 6, 7, 8, 9] 

Соединение значений в массив

Следующий код соединяет три значения в массив:

var alpha = ["a", "b", "c"]; var alphaNumeric = alpha.concat(1, [2, 3]); console.log(alphaNumeric); // Результат: ['a', 'b', 'c', 1, 2, 3] 

Спецификации

Specification
ECMAScript Language Specification # sec-array.prototype.concat

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также

• push / pop — добавление / удаление элементов с конца массива
• unshift / shift — добавление / удаление элементов с начала массива
• splice — добавление / удаление элементов в указанной позиции массива
• String.prototype.concat()
• Symbol.isConcatSpreadable — управление уменьшением размерности массива

Found a content problem with this page?

• Edit the page on GitHub.
• Report the content issue.
• View the source on GitHub.

This page was last modified on 4 авг. 2023 г. by MDN contributors.

Your blueprint for a better internet.

MDN

Support

• Product help
• Report an issue

Our communities

Developers

• Web Technologies
• Learn Web Development
• MDN Plus
• Hacks Blog

• Website Privacy Notice
• Cookies
• Legal
• Community Participation Guidelines

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998– 2023 by individual mozilla.org contributors. Content available under a Creative Commons license.