今天在偶然间查看到了一段代码,代码使用了很短的篇幅完成了字符串统计相同字符次数这个经典面试题,其中用到了reduce这个方法,网上查了查,没有查到什么有价值的东西,导致浪费了我一些时间才看懂,现将我的思路整理如下:

原代码:

var arr="qweqrq"
var info= arr.split('').reduce((a,b)=>
(a[b]++ || (a[b]=1),a)
,{})
console.log(info)

代码思路是这样的,先将字符串arr通过split方法切割成数组,然后使用reduce,这个方法干了什么呢,分为这几步:

1.首先reduce会接收一个callback来对数组里的每一个元素执行,如果有第二个参数如上例:{}。,那么callback将会使用这个{}作为参数来和数组中的第一个元素一同传入callback;

2.传入参数之后,会进行一个与门短路操作,也可以叫默认值操作,当a[b]++成真,则返回a[b]。而这里的a为{},b为"q",很明显a中并没有b,执行a[b]=1,那么就会给a[b]赋值为1,后面是一个逗号表达式,所以会返回有了a[b]:1这样属性的a对象;

与门短路操作:如果第一个操作数的值为true,进行短路操作,直接产生第一个操作数的值。如果为false,则产生第二个操作数的值。

逗号表达式:逗号表达式的一般形式是:表达式1,表达式2,表达式3……表达式n。逗号表达式的求解过程是:先计算表达式1的值,再计算表达式2的值,……一直计算到表达式n的值。最后整个逗号表达式的值是表达式n的值。

3.之后要说下reduce函数,它可以将之前一次执行后返回的结果作为参数继续和之后的元素一同传入callback执行,相当于fn(fn(fn(fn(a,b),c),d),e) ,fn即为callback;

4.在本例中,因为有第二个参数{}传入,所以callback执行了6次。相当于对数组中每一个元素都进行了录入和查重操作,比如当callback运行到第四次,这时的a是{q:1,w:1,e:1},执行callback,a[b]即a['q']存在,执行a['q']++,a['q']值为2,以此类推,最后得到的就是一个以数组每个元素为属性名,出现次数为属性值的对象。

需要注意的是,reduce是es5推出的方法,ie8及以下都不兼容。

Javascript:面试经典套路-查重(reduce)的更多相关文章

  1. 5个经典的JavaScript面试基础问题

    JavaScript程序员在IT领域中的需求量非常巨大.如果你非常精通JavaScript,你会有很多换工作.涨薪水的机会.但是在一家公司录用你之前,你必须顺利通过面试,证明你的技能.在本文中,我将向 ...

  2. Javascript中数组查重的方法总结大全

    数组查重:简单点说,就是找出数组中重复的元素然后去除,最后得到一个没有重复元素的数组. // 方法一思路:     1.构建一个新的数组,用于存放结果.       2.for循环中每次从数组取出一个 ...

  3. 论文 查重 知网 万方 paperpass

    相信各个即将毕业的学生或在岗需要评职称.发论文的职场人士,论文检测都是必不可少的一道程序.面对市场上五花八门的检测软件,到底该如何选择?选择查重后到底该如何修改?现在就做一个知识的普及.其中对于中国的 ...

  4. 面试经典算法题集锦——《剑指 offer》小结

    从今年 3 月份开始准备找实习,到现在校招结束,申请的工作均为机器学习/数据挖掘算法相关职位,也拿到了几个 sp offer.经历这半年的洗礼,自己的综合能力和素质都得到了一个质的提升. 实话说对于未 ...

  5. JavaScript面试的完美指南(开发者视角)

    为了说明 JS 面试的复杂性,首先,请尝试给出以下结果: onsole.log(2.0 == "2" == new Boolean(true) == "1") ...

  6. js查重去重性能优化心得

    概述 今天产品反映有个5000条数据的页面的保存按钮很慢,查看代码看到是因为点击保存按钮之后,进行了查重操作,而查重操作是用2个for循环完成了,时间复杂度是O(n^2).没办法,只能想办法优化一下了 ...

  7. 快速掌握JavaScript面试基础知识(三)

    译者按: 总结了大量JavaScript基本知识点,很有用! 原文: The Definitive JavaScript Handbook for your next developer interv ...

  8. 26个精选的JavaScript面试问题

    译者按: 从各个平台精选整理出26道由浅入深的题目助你面试 原文: Top 26 JavaScript Interview Questions I Wish I Knew 译者: Fundebug 为 ...

  9. 攻破javascript面试的完美指南【译】

    攻破javascript面试的完美指南(开发者视角) 0. 前言 本文适合有一定js基础的前端开发人员阅读.原文是我google时无意发现的, 被一些知识点清晰的解析所打动, 决定翻译并记录下来.这个 ...

随机推荐

  1. Mysql数据库连接查询

                                    Mysql数据库连接查询 连接是关系数据库模型的主要特点.连接查询是关系数据库中最主要的查询,主要包括内连接.外连接等.通过连接运算可以 ...

  2. C++编程练习(9)----“图的存储结构以及图的遍历“(邻接矩阵、深度优先遍历、广度优先遍历)

    图的存储结构 1)邻接矩阵 用两个数组来表示图,一个一维数组存储图中顶点信息,一个二维数组(邻接矩阵)存储图中边或弧的信息. 2)邻接表 3)十字链表 4)邻接多重表 5)边集数组 本文只用代码实现用 ...

  3. css3 3d小demo

    css3 3d案例总结 最近入坑 Web 动画,所以把自己的学习过程记录一下分享给大家.就把最近做的比较好的给大家分享下 1.旋转拼图 首先看下效果 代码主要由HTML和CSS3组成,应该说还是比较简 ...

  4. 不要在Android的Application对象中缓存数据!

    前言   在你的App中的很多地方都需要使用到数据信息,它可能是一个session token,一次费时计算的结果等等,通常为了避免Activity之间传递数据的开销,会将这些数据通过持久化来存储. ...

  5. 初识XMLHttpRequeset

    XMLHttpRequeset是什么 XmlHttpRequest,可扩展的超文本传输歇息.从字面上理解:xml,可扩展的标记语言:http,超文本传送协议:request,请求.XmlHttpReq ...

  6. java socket初步学习一 ( tcp)

    Java socket通信程序: 第一版本: 实现功能: 服务器地址:127.0.0.1  端口:5050 客户机:端口5050 客户端发送字符:“t” 服务器接收到该字符并回复:“r” 流程: 建立 ...

  7. Glusterfs下读写请求的处理流程

    Glusterfs基于内核的fuse模块,fuse模块除了创建fuse文件系统外,还提供了一个字符设备(/dev/fuse),通过这个字符设备,Glusterfs可以读取请求,并发送响应,并且可以发送 ...

  8. My97DatePicker.js 之无效日期设置

    1.下载并引用My97DatePicker.js 2.将工作日休假的和周末上班的维护到数据库中 3.取出某段时间内的不上班日期集合 /// <summary> ///获取 无效日期集合 1 ...

  9. ubuntu ssh-keygen Permission denied

    ubuntu下生成github上的ssh keys,执行: ssh-keygen 直接执行: sudo chown user1:user1 /home/user1/.ssh -R 成功生成.

  10. Giraph入门

    概要 这是一个Giraph的入门教程,主要用来运行少量输入的Giraph程序,并不能用于生产环境. 在这个教程中,我们将会在一个物理机器行部署一个单节点,伪分布的Hadoop集群.这个节点既是mast ...