当前位置:首页 > JavaScript

js实现一维数组合并

2026-03-02 02:11:37JavaScript

合并一维数组的几种方法

使用 concat() 方法
concat() 方法用于合并两个或多个数组,返回一个新数组而不改变原数组。

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const mergedArr = arr1.concat(arr2);
console.log(mergedArr); // [1, 2, 3, 4, 5, 6]

使用展开运算符(...)
ES6 的展开运算符可以简洁地合并数组。

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const mergedArr = [...arr1, ...arr2];
console.log(mergedArr); // [1, 2, 3, 4, 5, 6]

使用 push() 方法结合展开运算符
push() 可以修改原数组,结合展开运算符实现合并。

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
arr1.push(...arr2);
console.log(arr1); // [1, 2, 3, 4, 5, 6]

使用 Array.from() 和 reduce()
适合需要处理多个数组合并的场景。

const arrays = [[1, 2], [3, 4], [5, 6]];
const mergedArr = Array.from(arrays.reduce((acc, curr) => acc.concat(curr), []));
console.log(mergedArr); // [1, 2, 3, 4, 5, 6]

使用 flat() 方法
若数组成员是嵌套数组,flat() 可将其展平为一维。

js实现一维数组合并

const nestedArr = [[1, 2], [3, 4], [5, 6]];
const mergedArr = nestedArr.flat();
console.log(mergedArr); // [1, 2, 3, 4, 5, 6]

注意事项

  • 性能考量:对于大数组,展开运算符和 concat() 性能较好,push() 在循环中可能较慢。
  • 去重需求:若需合并后去重,可结合 Set 实现。
    const arr1 = [1, 2, 3];
    const arr2 = [3, 4, 5];
    const uniqueArr = [...new Set([...arr1, ...arr2])];
    console.log(uniqueArr); // [1, 2, 3, 4, 5]

标签: 数组js
分享给朋友:

相关文章

js实现轮播

js实现轮播

实现基础轮播效果 使用HTML结构创建轮播容器和图片元素: <div class="carousel"> <div class="carousel-inner">…

js实现计算器

js实现计算器

实现基础计算器功能 使用JavaScript创建一个基础计算器需要处理数字输入、运算符逻辑和结果显示。以下是一个简单的实现示例: let currentInput = '0'; let previo…

js实现列表

js实现列表

使用 JavaScript 实现列表 JavaScript 提供了多种方式来实现列表功能,包括数组操作、DOM 元素动态生成等。以下是几种常见的实现方法: 使用数组存储列表数据 数组是 JavaSc…

js实现瀑布流

js实现瀑布流

实现瀑布流布局 瀑布流布局是一种常见的网页布局方式,常用于图片展示、商品列表等场景。以下是使用 JavaScript 实现瀑布流布局的几种方法。 纯 JavaScript 实现 通过计算元素的位置和…

jquery数组

jquery数组

jQuery 数组操作 jQuery 提供了多种方法来操作数组或类数组对象(如 jQuery 对象集合)。以下是常见的数组操作方法: 遍历数组 使用 $.each() 方法可以遍历数组或对象: v…

js实现路由

js实现路由

js实现路由的方法 在JavaScript中实现路由功能可以通过多种方式完成,以下是几种常见的方法: 使用原生JavaScript实现路由 通过监听window.onhashchange事件来实现基…