JavaScript数组对象的使用——数组去重数组对象

75 阅读 0 评论 50 点赞

我是靠谱客的博主火星上小鸭子，最近开发中收集的这篇文章主要介绍JavaScript数组对象的使用——数组去重数组对象，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

数组对象

数组元素的添加和删除

方法名	说明	返回值
push(参数1…)	末尾添加一个或多个元素，注意修改原数组	并返回新的长度
pop()	删除数组最后一个元素，把数组长度减1 无参数、修改原数组	返回它删除的元素的值
unshift(参数1…)	向数组的开头添加一个或多个元素，注意修改原数组	并返回新的长度
shift()	删除数组的第一个元素，数组长度减1 无参数、修改原数组	并返回第一个元素的值

数组元素的翻转和排序

方法名	说明	是否修改原数组
reverse()	颠倒数组中元素的顺序，无参数	该方法会改变原来的数组返回新数组
sort()	对数组的元素进行排序	该方法会改变原来的数组返回新数组

注意
sort() 语法格式为：arr.sort([compareFunction])
如果没有指明 compareFunction ，那么元素会按照转换为的字符串的诸个字符的Unicode位点进行排序。例如 “Banana” 会被排列到 “cherry” 之前。当数字按由小到大排序时，9 出现在 80 之前，但因为（没有指明 compareFunction），比较的数字会先被转换为字符串，所以在Unicode顺序上 “80” 要比 “9” 要靠前。
如果指明了 compareFunction ，那么数组会按照调用该函数的返回值排序。即 a 和 b 是两个将要被比较的元素：

如果 compareFunction(a, b) 小于 0 ，那么 a 会被排列到 b 之前；
如果 compareFunction(a, b) 等于 0 ， a 和 b 的相对位置不变。备注： ECMAScript 标准并不保证这一行为，而且也不是所有浏览器都会遵守（例如 Mozilla 在 2003 年之前的版本）；
如果 compareFunction(a, b) 大于 0 ， b 会被排列到 a 之前。
compareFunction(a, b) 必须总是对相同的输入返回相同的比较结果，否则排序的结果将是不确定的。

数组索引方法

方法名	说明	返回值
indexOf()	数组中查找给定元素的第一个索引	如果存在返回索引号如果不存在，则返回-1
lastIndexOf()	在数组中的给定元素的最后一个索引	如果存在返回索引号如果不存在，则返回-1

数组去重小案例

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        // 数组去重 ['c','a','z','a','x','a','x','c','b'] 要求去除数组中重复的元素。
        // 1.目标：把旧数组里面不重复的元素选取出来放到新数组中，重复的元素只保留一个，放到新数组中去重。
        // 2.核心算法：我们遍历旧数组，然后拿着旧数组元素去查询新数组，如果该元素在新数组里面没有出现过，我们就添加，否则不添加。
        // 3.我们怎么知道该元素没有存在？利用 新数组.indexOf(数组元素) 如果返回是 -1 就说明 新数组里面没有该元素。

        // 封装一个去重的函数 unique()
        function unique(arr) {
            var newArray = [];
            for (var i = 0; i < arr.length; i++) {
                if (newArray.indexOf(arr[i]) === -1) {
                    newArray.push(arr[i]);
                }
            }
            return newArray;
        }

        var demo = unique(['c', 'a', 'z', 'a', 'x', 'a', 'x', 'c', 'b']);
        console.log(demo);
    </script>
</head>

<body>

</body>

</html>