js去重的两种方法

时间:2022-05-08 08:10:56

去重

去重方法和思路也很多,这里就介绍两种吧。

方法一:

1
2
3
4
5
6
7
8
9
10
11
function unique1(arr) {
    var res = [],
        len = arr.length;
    for (var i = 0; i < len; i++) {
        if (res.indexOf(arr[i]) == -1) {
            res.push(arr[i]);
        }
    }
    return res;
}

思路:利用了数组的indexOf()方法,此方法的目的是寻找存入参数在数组中第一次出现的位置,如果结果返回-1,说明还不存在,于是就可以保存起来了。实现这个方法的时候会遍历数组直到找到目标为止,比较耗时,速度方面要比借助hash表来实现慢。下文即将介绍~

方法二:

1
2
3
4
5
6
7
8
9
10
11
12
function unique2(arr) {
    var res = [],
        hash = {},
        len = arr.length;
    for (var i = 0; i < len; i++) {
        if (!hash[arr[i]]) {//如果不存在
            hash[arr[i]] = true;//记录下来
            res.push(arr[i]);//保存起来
        }
    }
    return res;
}

思路:将数组中的值通过作为下标(key)的形式存入一个Object内,利用这个加以判断,最后达到去重目的。这里有必再写详细一点,因为最初的时候有点懵逼,一时没看懂,定义了一个对象hash={},然后判断的时候又是这样写hash[],让人感觉又有点像数组。。。其实很好理解的。先来看个小例子:

1
2
3
4
5
6
7
8
9
10
var hash = {
    "name": "xiaojiecong",
    "sex": "male"
};
console.log(hash.name);
console.log(hash.sex);
console.log(hash["name"]);
console.log(hash["sex"]);

其实想说明就是,有两种方式能得到对象字面量中的某个键名(key)的键值(value),第一种是用点连接,第二种是用中括号,所以看到上面hash[]这样写也不会觉得奇怪了。用点连接或中括号,这个也适用于元素操作属性这种场景,比如:

1
2
3
4
document.getElementsByTagName('div')[0].style.display = 'block';
document.getElementsByTagName('div')[0].style['display'] = 'block';
document.getElementsByTagName('input')[0].value ='123';
document.getElementsByTagName('input')[0]['value'] ='123';

这里解释太多,好像有点啰嗦了 - -!