如何在 JavaScript 中将两个数组添加到一个新数组中?

javascriptweb developmentfront end technology

有序的索引元素组由 数组 表示,它是一种数据结构。合并两个或多个数组以创建一个包含原始数组中所有项目的更大数组是对多个数组执行的典型操作。

在 JavaScript 中,有几种方法可以将两个数组加在一起并创建一个新数组。本文将介绍如何正确使用 concat() 方法、扩展运算符 (...) 将两个单独的数组合并为一个新创建的数组。

此外,我们将通过示例讨论每种方法,以便您更好地了解它们的工作原理并知道何时最好使用它们。

在 JavaScript 中使用 concat()

concat() 方法连接两个或多个数组。 concat() 方法返回由组合 数组 组成的新数组。concat() 技术不会影响已存在的数组。

语法

以下是 concat() 的语法>

array1.concat(array2, array3, ..., arrayX)

示例

在下面的示例中,我们运行脚本以及 concat() 来合并两个 数组 并获得新的 数组

<!DOCTYPE HTML>
<html>
<body>
   <script>
      var arr1 = ["MSD", "VIRAT"];
      var arr2 = ["YUVRAJ", "ABD"];
      arr3 = arr1.concat(arr2);
      document.write(JSON.stringify(arr3));
   </script>
</body>
</html>

脚本执行时,将生成一个输出,其中包含一个打印数组,该数组是通过使用 concat() 方法将两个数组相加而获得的。这将在执行脚本时触发。

使用 Spread 运算符

扩展运算符 (...) 是一个 JavaScript 运算符,允许在需要多个参数(用于函数调用)或多个元素(用于数组文字)的地方扩展表达式。扩展运算符将可迭代对象(例如数组、集合、字符串甚至映射)扩展为其各个值。

语法

以下是 扩展运算符 的语法>

var variablename1 = [...value];

示例

让我们看下面的例子,我们使用扩展运算符数组合并以形成第三个数组

<!DOCTYPE HTML>
<html>
<body>
   <script>
      var car = ["BMW","BENZ","AUDI"];
      var bike = ["RX100","RC390","VESPA"];
      const merged = [...car, ...bike];
      document.write("First Array value=");
      document.write(JSON.stringify(car)+"<br>");
      document.write("Second Array value=");
      document.write(JSON.stringify(bike)+"<br>");
      document.write("After result=");
      document.write(JSON.stringify(merged));
   </script>
</body>
</html>

运行上述脚本时,Web 浏览器会显示脚本中使用的两个数组以及一个新数组,该数组由运行脚本时触发的事件创建。

在 JavaScript 中使用 push() 方法

push() 方法使用新元素扩展数组。数组的长度由 push() 方法修改。Push() 返回新长度。

语法

以下是 push() 的语法

array.push(item1, item2, ..., itemX)

示例

让我们考虑以下示例,其中我们使用 push() 方法 将两个数组添加到新数组中。

<!DOCTYPE HTML>
<html>
<body>
   <script>
      const movie = ['Balu', 'Pokiri'];
      const hero = ['Pavankalyan', 'MaheshBabu'];
      movie.push(...hero);
      document.write(JSON.stringify(movie));
   </script>
</body>
</html>

当脚本执行时,它将导致事件被触发并显示一个新数组,该数组是由我们在上面的脚本中使用的两个数组合并创建的。


相关文章