博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
数组去重的正确编写姿势
阅读量:6404 次
发布时间:2019-06-23

本文共 1748 字,大约阅读时间需要 5 分钟。

引言

数组去重是前端面试的一个必备题目,其具体表现内容为:怎样去掉Javascript的Array的重复项。问题简单直接,咱们也废话不多说,直入主题吧。

一般姿势

使用数组的indexOf()方法可以很简单的达到目的。

Array.prototype.unique = function() {    // 创建一个新的临时数组,用于保存输出结果    var n = [];     // 遍历当前数组    for (var i = 0; i < this.length; i++) {        // 如果当前数组的第i个元素已经保存进了临时数组,那么跳过,否则把当前项push到临时数组里面        if (n.indexOf(this[i]) == -1) n.push(this[i]);    }    return n;}

再列出一个变换一点的方式。

Array.prototype.unique = function() {    // 创建一个新的临时数组,并且把当前数组的第一元素存入到数组中    var n = [this[0]];     // 从第二项开始遍历    for (var i = 1; i < this.length; i++)     {        // 如果当前数组的第i项在当前数组中第一次出现的位置不是i,那么表示第i项是重复的,忽略掉,否则存入结果数组        if (this.indexOf(this[i]) == i) n.push(this[i]);    }    return n;}

JS引擎在实现indexOf()的时候会遍历数组直到找到目标为止,此函数会浪费掉很多时间。所有这两种方式都不是最优的解决方式。

// 另一个简洁粗暴的方法Array.prototype.unique = function() {    return this.filter((v, i) => this.indexOf(v) === i)}

感谢童鞋提供的简单粗暴的一般姿势ES6改良版,优雅而简约 :)

最快姿势

把已经出现过的元素通过下标的形式存入一个Object内。下标的引用的实现原理利用的是哈希算法,要比用indexOf()搜索数组快的多。

Array.prototype.unique = function() {    // n为hash表,r为临时数组    var n = {}, r = [];    for (var i = 0; i < this.length; i++) {        // 如果hash表中没有当前项        if (!n[this[i]]) {            // 存入hash表            n[this[i]] = true;            // 把当前数组的当前项push到临时数组里面            r.push(this[i]);         }    }    return r;}

但从耗时的角度来讲,这是最优的一种解决方式。但是从内存占用角度来说,这并不是最优的,因为多了一个hash表。这就是所谓的空间换时间(世间安得双全法?)。

中庸姿势

Array.prototype.unique = function() {    this.sort();    var re = [this[0]];    for (var i = 1; i < this.length; i++) {        if (this[i] !== re[re.length - 1]) {            re.push(this[i]);        }    }    return re;}

这个方法的思路是先把数组排序,然后比较相邻的两个值。排序的时候用的JS原生的sort()方法,JS引擎内部应该是用的快速排序吧。这种方式比使用indexOf()一般姿势要快,比使用hash表的最快姿势要慢,但是占用内存要少。所以这算是委曲求全的一种中庸姿势。具体要用什么姿势,各位看官视情况而定吧。

改编自刘春龙博客中的文章

转载地址:http://ahnea.baihongyu.com/

你可能感兴趣的文章
生成指定范围的一组随机数并求平均值
查看>>
android语音识别方法
查看>>
File Operations in Android NDK(转)
查看>>
如何将kux格式的视频转换成我们常用的MP4格式
查看>>
[sublime系列文章] sublime text 3插件配置说明
查看>>
学习 PixiJS — 碰撞检测
查看>>
Vue 基础篇
查看>>
JavaScript:函数防抖与函数节流
查看>>
关于区间贪心的补全
查看>>
架构设计步骤
查看>>
自定义元素探秘及构建可复用组件最佳实践
查看>>
区块链是一个公共数据库,要放在一个块内
查看>>
Jenkins 用户文档(目录)
查看>>
系统常见指标
查看>>
使用crond构建linux定时任务及日志查看
查看>>
地图绘制初探——基于maptalks的2.5D地图绘制
查看>>
SpringBoot2.0之七 实现页面和后台代码的热部署
查看>>
Git 仓库大扫除
查看>>
设计模式-单例模式
查看>>
es6基础0x014:WeakMap
查看>>