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了。

上面总结了下数组的常用方法,然后数组的去重也就简单易懂了;

1、取出两个数组的不同元素

 getArrDifference(arr1, arr2) {

     return arr1.concat(arr2).filter(function(v, i, arr) {

         return arr.indexOf(v) === arr.lastIndexOf(v);

     });

 },

eg:ES6语法有更简洁方法可参考

2、取出两个数组的相同元素

 getArrEqual(arr1, arr2) {
let newArr = [];
for (let i = 0; i < arr2.length; i++) {
for (let j = 0; j < arr1.length; j++) {
if(arr1[j] === arr2[i]){
newArr.push(arr1[j]);
}
}
}
return newArr;
},

JS取出两个数组的不同或相同元素的更多相关文章

  1. JS取出两个数组中的不同或相同元素

    1.取出两个数组的不同元素 var arr1 = [0,1,2,3,4,5]; var arr2 = [0,4,6,1,3,9]; function getArrDifference(arr1, ar ...

  2. JS取出两个数组中不重复的值

    var array = [0, 1, 2, 3, 4, 'age', 6, 7, 8, 9]; var array2 = [0, 1, 'age', 6, 7, 8, 9]; var arr3 = [ ...

  3. JS合并两个数组的方法

    JS合并两个数组的方法 我们在项目过程中,有时候会遇到需要将两个数组合并成为一个的情况.比如: var a = [1,2,3]; var b = [4,5,6]; 有两个数组a.b,需求是将两个数组合 ...

  4. JS 比较两个数组是否相等 是否拥有相同元素

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

  5. JS比较两个数组是否相等 是否拥有相同元素

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

  6. 探讨JS合并两个数组的方法

    我们在项目过程中,有时候会遇到需要将两个数组合并成为一个的情况. 比如: var a = [1,2,3]; var b = [4,5,6]; 有两个数组a.b,需求是将两个数组合并成一个.方法如下: ...

  7. 转:探讨JS合并两个数组的方法

    我们在项目过程中,有时候会遇到需要将两个数组合并成为一个的情况. 比如: var a = [1,2,3]; var b = [4,5,6]; 有两个数组a.b,需求是将两个数组合并成一个.方法如下: ...

  8. [转] 探讨JS合并两个数组的方法

    我们在项目过程中,有时候会遇到需要将两个数组合并成为一个的情况. 比如: 1 2 var a = [1,2,3]; var b = [4,5,6]; 有两个数组a.b,需求是将两个数组合并成一个.方法 ...

  9. js 合并两个数组对象

    项目背景是合并a = [{name:'dede'},{name:'jenny'}],  b = [{age:18},{age:19}]  合并成[{name:'dede',age:18},{name: ...

随机推荐

  1. [Angular] Configure an Angular App at Compile Time with the Angular CLI

    Compile time configuration options allow you to provide different kind of settings based on the envi ...

  2. Java Bean 简单介绍及其应用

    Bean的中文含义是"豆子",顾名思义JavaBean是一段Java小程序.JavaBean实际上是指一种特殊的Java类.它通经常使用来实现一些比較经常使用的简单功能.并能够非常 ...

  3. Windows下使用静态库

    开发工具 vs2010 1.新建win32控制台应用程序 2.将静态库的头文件包括在程序中并手动链接静态库(库文件和头文件都在根文件夹下) watermark/2/text/aHR0cDovL2Jsb ...

  4. 适配 iOS 8 时遇到的问题两则:远程推送和 Unwind Segue

    原文:http://imtx.me/archives/1910.html 昨天我在微博上吐槽:iOS 8 / Xcode 6 真是史上对开发人员最糟糕的版本号了.收到非常多朋友表达同感. 之所以这么说 ...

  5. Vue Syntax Highlight

    Vue Syntax Highlight https://github.com/vuejs/vue-syntax-highlight

  6. 相机拍照友盟检测crash是为什么?

    友盟报错如下* setObjectForKey: object cannot be nil (key: UIImagePickerControllerOriginalImage)(null)(( 0 ...

  7. Mac or windows eclipse配置tomcat

    1.选择window --> Preferences 首选项 2.选择server --> Runtime Environements --> Add 3.选择对应的tomcat版本 ...

  8. 并查集 (Union Find ) P - The Suspects

    Severe acute respiratory syndrome (SARS), an atypical pneumonia of unknown aetiology, was recognized ...

  9. vue之filter用法

    1.全局写法: 全局过滤器必须写在vue实例创建之前. Vue.filter('testfilter', function (value,text) { // 返回处理后的值 return value ...

  10. sed命令的介绍

    命令格式 sed [options] 'command' file(s) sed [options] -f scriptfile file(s) 选项 -e<script>或--expre ...