当前位置:首页 > 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 的展开运算符可以简洁地合并数组。

js实现一维数组合并

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() 可以修改原数组,结合展开运算符实现合并。

js实现一维数组合并

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() 可将其展平为一维。

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实现换肤

使用CSS变量实现换肤 通过CSS变量可以轻松实现主题切换功能。CSS变量在根元素中定义,通过JavaScript动态修改这些变量值。 :root { --primary-color: #349…

js实现预览

js实现预览

文件上传预览实现 使用JavaScript实现文件上传预览功能,可以通过FileReader对象读取文件内容并显示预览。以下代码支持图片、文本和PDF文件的预览: // HTML部分需要包含inpu…

js实现百叶窗

js实现百叶窗

使用CSS和JavaScript实现百叶窗效果 通过CSS动画和JavaScript事件监听可以实现百叶窗效果。核心思路是将内容区域分割为多个条状元素,通过控制它们的展开/折叠状态来模拟百叶窗。…

js实现防洪

js实现防洪

防抖(Debounce)实现 防抖的核心思想是在事件触发后延迟执行回调函数,若在延迟时间内再次触发事件,则重新计时。适用于输入框搜索、窗口调整等场景。 function debounce(func,…

js实现求导

js实现求导

实现数值求导的方法 在JavaScript中实现求导通常采用数值方法,因为JavaScript不是符号计算语言。以下是常见的数值微分方法: 中心差分法 中心差分法提供较高精度的导数近似: func…

js实现自举

js实现自举

实现 JavaScript 自举的方法 JavaScript 自举(Bootstrap)通常指通过 JavaScript 动态加载自身或依赖的脚本,实现运行时环境的初始化或扩展。以下是几种常见实现方式…