数组去重合并

最近遇到了一个问题，有一个比较费时的JS操作，在IE下总报错：

通过使用chrome下的profile找出了那个费时的函数，是一个关于数组合并的函数。

function union_arr_1(arr, arr_b) {
    var i,
        len;

    for (i = 0, len = arr_b.length; i < len; i++) {
        if (in_arr(arr_b[i], arr)) {
            continue;
        }
        arr.push(arr_b[i]);
    }

    return arr;
}

function in_arr(num, arr) {
    var i,
        len;
    for (i = 0, len = arr.length; i < len; i++) {
        if (num == arr[i]) {
            return true;
        }
    }

    return false;
}

将两个只含数字的数组进行合并，并且重复的项只保留一个。分析上面的算法，将arr_a与arr_b数组合并，需要遍历数组arr_b，将元素push到arr_a中，在push之前，需要遍历一次arr_a是否包含那个元素，关键影响效率的问题就是这里了。 每插入一个元素前，需要遍历arr_a。

改进的算法：

先将arr_a和arr_b合并，然后再处理重复数据。我们知道object对象是不会包含重复键值对的，因此可以把元素当做属性插入到object中。

function union_arr_2(arr, arr_b) {
    var i,
        len,
        arr_c,
        newArr = [],
        obj = {};

    arr_c = arr.concat(arr_b);

    for (i = 0, len = arr_c.length; i < len; i++) {
        if (!obj[arr_c[i]]) { //查找object对象的属性，要比查找数组更高效
            obj[arr_c[i]] = 1;
            newArr.push(arr_c[i]);
        }
    }

    return newArr;
}

 

耗时比较：

var time_start,
    i,
    len,
    limit_a = 20000,
    limit_b = 35000,
    arr_a,
    arr_b;

arr_a = [];
for(i=0; i<limit_a; i++){
    arr_a.push(i);
}

arr_b =[];
for(i=limit_b-limit_a; i<limit_b; i++){
    arr_b.push(i);
}

time_start = new Date();
union_arr_1(arr_a, arr_b);
console.log("First method takes " + ((new Date())-time_start) + 'ms.');

arr_a = [];
for(i=0; i<limit_a; i++){
    arr_a.push(i);
}

arr_b =[];
for(i=limit_b-limit_a; i<limit_b; i++){
    arr_b.push(i);
}

time_start = new Date();
union_arr_2(arr_a, arr_b);
console.log("First method takes " + ((new Date())-time_start) + 'ms.');

随着合并数组数据量的增加，性能相差将会非常大。

First method takes 864ms. 
First method takes 17ms.