JS合并两个数组的方法

我们在项目过程中,有时候会遇到需要将两个数组合并成为一个的情况。比如:
    var a = [1,2,3];
var b = [4,5,6];
有两个数组a、b,需求是将两个数组合并成一个。方法如下:
  • 1、concat
    js的Array对象提供了一个叫concat()方法,连接两个或更多的数组,并返回结果。
    var c = a.concat(b);//c=[1,2,3,4,5,6];

这里有一个问题,concat方法连接a、b两个数组后,a、b两个数组的数据不变,同时会返回一个新的数组。这样当我们需要进行多次的数组合并时,会造成很大的内存浪费,所以这个方法肯定不是最好的。

  • 2、for循环

    大概的思路是:遍历其中一个数组,把该数组中的所有元素依次添加到另外一个数组中。直接上代码:

    for(var i in b){
    a.push(b[i]);
    }

    这样的写法可以解决第一种方案中对内存的浪费,但是会有另一个问题:丑!这么说不是没有道理,如果能只用一行代码就搞定,岂不快哉~

  • 3、apply
    函数的apply方法有一个特性,那就是func.apply(obj,argv),argv是一个数组。所以我们可以利用这点,直接上代码:
    a.push.apply(a,b);

调用a.push这个函数实例的apply方法,同时把,b当作参数传入,这样a.push这个方法就会遍历b数组的所有元素,达到合并的效果。

这里可能有点绕,我们可以把b看成[4,5,6],变成这样:

    a.push.apply(a,[4,5,6]);

然后上面的操作就等同于:

    a.push(4,5,6);

这样就很清楚了!

  另外,还要注意两个小问题:

  1)以上3种合并方法并没有考虑过a、b两个数组谁的长度更小。

  所以好的做法是预先判断a、b两个数组哪个更大,然后使用大数组合并小数组,这样就减少了数组元素操作的次数!

  2)有时候我们不希望原数组(a、b)改变,这时就只能使用concat了。

Javascript 连接两个数组的更多相关文章

  1. javascript对比两个数组,打印出差异值

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. javascript合并两个数组

    在开发的过程中,我们很多时候会遇到需要将两个数组合并成一个数组的情况出现. var arr1 = [1, 2, 3]; var arr2 = [4, 5, 6]; // 将arr1和arr2合并成为[ ...

  3. 用JavaScript比较两个数组是否相等

    JS怎么比较两个数组是否有完全相同的元素?Javascript不能直接用==或者===来判断两个数组是否相等,无论是相等还是全等都不行,以下两行JS代码都会返回false alert([0,0,0]= ...

  4. JavaScript 将两个数组合并,且删除重复的值

    var a=[1,2,3,4,5,8,9,10]; var b=[6,7,8,9,10]; var c = a.concat(b);//合并成一个数组 console.log(c) temp = {} ...

  5. JavaScript中两个数组的拼接

    方法一:使用for循环 var arr = ['tom', 'jerry']; var arr2 = [1, 2]; for(var i=0; i<arr2.length; i++){ arr. ...

  6. JavaScript查找两个数组的相同元素和相差元素

    let intersection = a.filter(v => b.includes(v)) 返回交集数组 let difference = a.concat(b).filter(v => ...

  7. JavaScript把两个数组对象合并成一个一一对应的数组对象

    合并数组或者对象在数组或对象前面加...,是es6的新写法,然后数组的map方法会返回数组. var obj1 = [{ , "model": "XQG70-S1208F ...

  8. JavaScript concat() 方法-连接两个或多个数组

    一,定义和用法 concat() 方法用于连接两个或多个数组. 该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本. 语法 arrayObject.concat(arrayX,arrayX,. ...

  9. JavaScript基础进阶之数组方法总结

    数组常用方法总结:  下面我只总结了es3中常用的数组方法,一共有11个.es5中新增的9个数组方法,后续再单独总结. 1个连接数组的方法:concat() 2个数组转换为字符串的方法:join(). ...

随机推荐

  1. 【转】在SharePoint Server 2010中更改“我的网站”

    在安装SharePoint Server 2010的时候,创建的第一个站点是一个"NetBIOS名称"的网站,而这个时候,"我的网站"(或称"个人网站 ...

  2. 中国大学MOOC 玩转AutoCAD 熟悉AutoCAD的人机交互方式

  3. js弹出窗口

    function openModalDialog(url, height, width) { var t_height = 400; var t_width = 600; if (!isNaN(hei ...

  4. FreeMarker 的空值处理 , 简单理解 , 不用TMD就会忘记

    NO.1 而对于FreeMarker来说,null值和不存在的变量是完全一样的 NO.2 ! 指定缺失变量的默认值 返回String NO.3 ?? 判断变量是否存在 返回boolean NO.4 $ ...

  5. javascript总结11:JavaScript的自增自减

    1 自增自减 1.1 自增写法i++ 作用:在不参与运算的情况下,i++和++i都是在变量的基础加1 var n1 =123; //n1++ 等价于 n1 = n1 +1; ++n1 //等价于 n1 ...

  6. python 爬虫proxy,BeautifulSoup+requests+mysql 爬取样例

    实现思路: 由于反扒机制,所以需要做代理切换,去爬取,内容通过BeautifulSoup去解析,最后入mysql库 1.在西刺免费代理网获取代理ip,并自我检测是否可用 2.根据获取的可用代理ip去发 ...

  7. C#NPOI.RabbitMQ.EF.Attribute.HttpRuntime.Cache.AD域.List<T>根据指定字段去重.前端JQuery.Cache.I18N(多语言).data-xx(自定义属性)

    使用NPOI 操作Excel 个人使用的电脑基本默认安装Excel 操作起来 调用Excel的组件便可.如果是一台服务器.没有安装Excel,也就无法调用Excel组件. 在此推荐第三方插件.NPOI ...

  8. C#多线程编程实战1.7前台线程和后台线程

    using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threa ...

  9. 【大数据之数据仓库】安装部署GreenPlum集群

    本篇将向大家介绍如何快捷的安装部署GreenPlum测试集群,大家可以跟着我一块儿实践一把^_^ 1.主机资源 申请2台网易云主机,操作系统必须是RedHat或者CentOS,配置尽量高一点.如果是s ...

  10. Delphi XE8中开发DataSnap程序常见问题和解决方法 (二)想对DBExpress的TSQLDataSet写对数据库操作的SQL语句出错了!

    当我们搞定DataSnap后,我们进入客户端程序开发阶段了,我们建立了客户端模块后,打算按照刚才开发服务器的步骤开发客户端程序,随后加入了DBExpress的TSQLDataSet,设定数据库连接后, ...