JavaScript 如何从多个数组中获取单个数组

在这个问题中，我们将了解如何从多个数组中获取一个单个数组以及解决这个问题的不同方法。

我们将使用三种方法来解决这个问题：第一种方法是使用扩展运算符，第二种方法是使用concat方法，最后一种方法是使用扩展运算符和push方法。

了解问题

我们给出了两个或多个数组，我们必须将它们连接在一个单个的数组中。可以给出许多数组，并且在连接它们后，应该显示为一个单个的数组。

让我们通过下面的示例来理解：

在上面的示例中，我们给出了三个数组，array1、array2和array3，在将它们组合后，我们得到了一个单个的数组[2,4,5,6,3,7,1,8,9]。注意，它的顺序与我们在开始时传递的顺序相同[array1，array2，array3]。

问题的代码

如上所讨论，我们将逐个使用三种方法解决这个问题。

使用扩展运算符

扩展运算符是在javascript ES6中引入的。扩展运算符的主要操作是将数组的一部分或全部复制到另一个数组中。扩展运算符的语法由三个点(…)表示。当需要将数组或对象的所有元素添加到一个新创建的数组中时，使用这个运算符。

JavaScript 如何从多个数组中获取单个数组

步骤

第一步： 定义数组并为其分配值。

第二步： 使用扩展运算符创建另一个数组，并将这两个创建的数组传递给它。

第三步： 返回组合的数组。

示例

// Define arrays
var name1 = ['Nick', 'John', 'Mili'];
var name2 = ['Peter', 'Abraham', 'Avi'];

//using spread operator
var combine = [...name1, ...name2];
console.log(combine);

输出

['Nick', 'John', 'Mili', 'Peter', 'Abraham', 'Avi']

使用concat方法

在JavaScript中，有一个预定义的方法叫做concat()。使用这个方法，我们可以将多个数组合并为一个单独的数组。在下面的代码中，我们可以了解这个方法。代码中定义了三个数组arr1、arr2和arr3。然后我们有一个新的数组叫做combinedArray，它在执行连接操作之后存储一个数组。我们可以通过两种方式执行连接操作，[].concat(arr1, arr2, arr3)或arr1.concat(arr2, arr3)，这两行代码都会给出相同的结果。

步骤

步骤1 ：定义数组arr1、arr2、arr3并赋值。

步骤2 ：创建另一个数组’combinedArray’，使用concat方法赋值，并将步骤1中创建的所有数组添加到其中。

步骤3 ：返回合并后的数组。

示例

// Define arrays
var arr1 = [100, 200, 300]

var arr2 = [400, 500, 600];

var arr3 = [700, 800, 900];

// Before using concat method 

console.log("Before Merging Arrays");
console.log(arr1, arr2, arr3);

//Using concat method

var combinedArray = [].concat(arr1, arr2, arr3);  // or we can write as arr1.concat(arr2, arr3);

console.log("After Merging Arrays", combinedArray);

输出

Before Merging Arrays
[ 100, 200, 300 ] [ 400, 500, 600 ] [ 700, 800, 900 ]
After Merging Arrays [ 100, 200, 300, 400, 500, 600, 700, 800, 900 ]

使用push和spread操作符

在这一步中，我们将使用spread操作符来展开所有的元素，然后我们将使用Javascript预定义的push方法将展开的元素添加到一个数组中。

在下面的代码中，我们在函数combineArrays中使用了剩余参数来接收任意数量的参数（…multipleArrays）。然后，我们使用一个for循环，以便所有传入函数的参数都能使用spread操作符展开数组。最后，我们将展开的元素推送到新创建的数组singleArray中。

步骤

第一步 ：定义数组并赋值。

第二步 ：创建一个函数combineArrays并使用spread操作符传递参数给函数。

第三步 ：创建一个名为singleArray的空数组。

第四步 ：定义一个for循环，通过计算数组的长度将arr1、arr2和arr3中的所有元素推送到singleArray中。

第五步 ：返回singleArray的值。

第六步 ：现在打印出来看看合并后的数组。

示例

//Define multiple arrays
var arr1 = [1,2,3];
var arr2 = [4,5,6];
var arr3 = [7,8,9];

//define function to perform merge operation 
function combineArrays(...multipleArrays) {
   let singleArray = [];
   for(let i = 0; i < multipleArrays.length; i++) {
      singleArray.push(...multipleArrays[i]);
   }
   return singleArray;
}

console.log("Single array from multiple arrays")
console.log(combineArrays(arr1, arr2, arr3))

输出

Single array from multiple arrays
[ 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

复杂性

由于我们已经以三种方式实现了这个问题，我们将逐一讨论以下每种方法的时间复杂性。

首先，我们谈谈展开运算符方法。展开运算符几乎需要O(n)的时间，因此第一种方法的总体时间复杂性为O(n2)。

第二种方法将需要O(n)的时间，因为数组中有n个元素。

在最后一种方法中，我们使用了一个名为combineArrays的函数，其中我们使用了一个for循环。for循环将一直运行，直到将数组的所有元素添加到一个名为singleArray的新数组中。因此，如果arr1的长度为l，arr2的长度为m，arr3的长度为n，那么时间复杂度将为O(lmn)或O(N)，其中N是l、m和n的乘积。