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


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

在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() 方法添加两个数组而获得的数组。这在执行脚本时触发。

使用展开运算符

展开运算符(...)是一个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>

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

在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>

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

更新于:2023年1月18日

2K+ 浏览量

启动您的职业生涯

通过完成课程获得认证

开始学习
广告
© . All rights reserved.