讲师中心 微信公众号
AI工具推荐 视频效率加速

javascript如何合并数组_有哪些方法可以拼接多个数组?

陌丽君_6683

陌丽君_6683

发布时间:2026-01-05 20:07:53

|

472人浏览过

|

来源于php中文网

原创

concat()最稳妥,不修改原数组、兼容性好;展开运算符更现代但需注意环境支持和浅层展开;push()有副作用,仅适用于可控场景;避免join()+split()等不可靠方法。

javascript如何合并数组_有哪些方法可以拼接多个数组?

用 concat() 合并数组最稳妥

concat() 是原生、无副作用、兼容性最好的方法,适合大多数拼接场景。它不修改原数组,而是返回一个新数组。

  • 支持任意数量的参数,可以是数组、值,或混合:
    const a = [1, 2];
    const b = [3, 4];
    const c = [5];
    const result = a.concat(b, 3.14, c); // [1, 2, 3, 4, 3.14, 5]
  • 传入空数组或 undefined 不报错,会被忽略;但传入字符串会按字符拆开('abc'.concat([1]) → ['a','b','c',1])
  • IE6+ 全兼容,没有 Symbol 或迭代器相关陷阱

用展开运算符 [...a, ...b] 更现代但有注意点

ES2015+ 推荐写法,语义清晰,性能通常优于 concat(),但要注意它只展开一层,且依赖目标环境支持迭代协议。

  • 不能直接展开非可迭代对象(比如普通对象、null、undefined 会报 TypeError: undefined is not iterable)
  • 嵌套数组不会被递归扁平化:
    const a = [1, [2, 3]];
    const b = [4];
    const result = [...a, ...b]; // [1, [2, 3], 4] —— 不是 [1, 2, 3, 4]
  • 若需深合并或处理稀疏数组(如 new Array(3)),展开运算符会保留空位,而 concat() 会转为 undefined

用 push(...arr) 原地拼接但要小心副作用

如果明确想复用第一个数组、避免创建新引用,可用 push() 配合展开运算符。但这是**有副作用的操作**,必须确认调用方能接受原数组被修改。

Java Maven Code Review
Java Maven Code Review

审查Java Maven项目(ZIP压缩包或GitLab仓库URL),检查代码规范、命名、模块边界、可维护性问题以及重复代码。

下载
  • 仅适用于第一个参数是数组且你拥有其控制权的场景:
    const target = [1, 2];
    const source = [3, 4, 5];
    target.push(...source); // target 变成 [1, 2, 3, 4, 5]
  • 传入空数组或 length === 0 的类数组没问题;但若 source 是伪数组(如 arguments)且没实现迭代器,可能失败
  • 不推荐在函数内部对传入的数组参数直接 push,除非文档明确约定“此函数会修改输入”

避免用 join() + split() 拼接数字/布尔等类型

有人会想到 a.join(',') + ',' + b.join(',') 再 split(','),这在处理纯字符串时看似可行,但对其他类型极不可靠。

立即学习“Java免费学习笔记(深入)”;

  • undefined、null、false、0 在 join() 中都会变成空字符串或 "0",导致无法还原原始值
  • 含逗号的字符串(如 ['a,b', 'c'])会被错误切分
  • 性能差:字符串转换 + 分割 + 类型重铸,三重开销,且结果全是字符串
  • 真正需要扁平化多维数组时,应选 flat() 或递归逻辑,而不是字符串中转
实际项目里,多数情况用 concat() 最省心;追求简洁和现代语法且确定环境可控时,用展开运算符;只有明确要改原数组、且调用链可控时,才用 push(...)。别碰字符串中转那套——看着短,出问题时根本没法 debug。

热门AI工具

更多
豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

立刻MV
立刻MV Hot

立刻MV是一款AI文本写作工具,AI 音乐视频(MV)创作工具。

Laper
Laper Hot

Laper是专为编剧、导演和制片人推出的 AI 原生剧本创作工具。

二狗PPT
二狗PPT Hot

一款AI演示文稿工具,主要用于专为中式职场打造的AI PPT生成工具,适合需要提升相关任务效率的用户。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

蛙蛙写作

一款AI论文写作工具,主要用于超级AI智能写作助手,适合需要提升相关任务效率的用户。

墨刀AI
墨刀AI Hot

一款AI图像与设计工具,主要用于产品经理的专属智能体,适合需要提升相关任务效率的用户。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

LibLibAI
LibLibAI Hot

一款AI视频创作工具,主要用于国内领先的AI创意平台,以海量模型、低门槛操作与“创作-分享-商业化”生态,让小白与专业创作者都能高效实现图文乃至视频创意表达,适合需要提升相关任务效率的用户。

相关专题

更多
c语言中null和NULL的区别
c语言中null和NULL的区别

c语言中null和NULL的区别是:null是C语言中的一个宏定义,通常用来表示一个空指针,可以用于初始化指针变量,或者在条件语句中判断指针是否为空;NULL是C语言中的一个预定义常量,通常用来表示一个空值,用于表示一个空的指针、空的指针数组或者空的结构体指针。

549

2023.09.22

java中null的用法
java中null的用法

在Java中,null表示一个引用类型的变量不指向任何对象。可以将null赋值给任何引用类型的变量,包括类、接口、数组、字符串等。想了解更多null的相关内容,可以阅读本专题下面的文章。

1678

2024.03.01

java基础知识汇总
java基础知识汇总

java基础知识有Java的历史和特点、Java的开发环境、Java的基本数据类型、变量和常量、运算符和表达式、控制语句、数组和字符串等等知识点。想要知道更多关于java基础知识的朋友,请阅读本专题下面的的有关文章,欢迎大家来php中文网学习。

5924

2023.10.24

Go语言中的运算符有哪些
Go语言中的运算符有哪些

Go语言中的运算符有:1、加法运算符;2、减法运算符;3、乘法运算符;4、除法运算符;5、取余运算符;6、比较运算符;7、位运算符;8、按位与运算符;9、按位或运算符;10、按位异或运算符等等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

2664

2024.02.23

php三元运算符用法
php三元运算符用法

本专题整合了php三元运算符相关教程,阅读专题下面的文章了解更多详细内容。

1692

2025.10.17

js 字符串转数组
js 字符串转数组

js字符串转数组的方法:1、使用“split()”方法;2、使用“Array.from()”方法;3、使用for循环遍历;4、使用“Array.split()”方法。本专题为大家提供js字符串转数组的相关的文章、下载、课程内容,供大家免费下载体验。

1638

2023.08.03

js截取字符串的方法
js截取字符串的方法

js截取字符串的方法有substring()方法、substr()方法、slice()方法、split()方法和slice()方法。本专题为大家提供字符串相关的文章、下载、课程内容,供大家免费下载体验。

2464

2023.09.04

java基础知识汇总
java基础知识汇总

java基础知识有Java的历史和特点、Java的开发环境、Java的基本数据类型、变量和常量、运算符和表达式、控制语句、数组和字符串等等知识点。想要知道更多关于java基础知识的朋友,请阅读本专题下面的的有关文章,欢迎大家来php中文网学习。

5924

2023.10.24

FrankenPHP集成Laravel详细教程
FrankenPHP集成Laravel详细教程

本专题提供FrankenPHP集成Laravel的详细配置指南,全面解析运行原理、开发环境搭建、Caddyfile配置、Octane工作模式、数据库连接、队列任务、定时任务和生产环境优化,解决部署过程中常见的报错与兼容性问题。

0

2026.10.08

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
WebStorm 官方调试文档
WebStorm 官方调试文档

共0课时 | 0人学习

React 教程
React 教程

共58课时 | 12.1万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 6.6万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn