我悟出权力本来就是不讲理的——蟑螂就是海米;也悟出要造反,内心必须强大到足以承受任何后果才行。

——北岛《城门开》

本文为读 lodash 源码的第十篇,后续文章会更新到这个仓库中,欢迎 star:pocket-lodash

gitbook也会同步仓库的更新,gitbook地址:pocket-lodash

作用与用法

baseFindIndex 是内部方法,其作用类似于ES6的 findIndex,查找符合条件的第一个元素的索引。

baseFindIndex 除了从前向后查找外,还可以从后向前查找。

用法如下:

baseFindIndex([3,1,2], function(val, index, array) {
return val > 1
}, 1) // 从前向后查找,从索引1开始查找,返回2
baseFindIndex([3,1,2], function(val, index, array) {
return val > 1
}, 1, true) // 从后向前查找,从索引1开始查找,返回3

源码分析

function baseFindIndex(array, predicate, fromIndex, fromRight) {
const { length } = array
let index = fromIndex + (fromRight ? 1 : -1) while ((fromRight ? index-- : ++index < length)) {
if (predicate(array[index], index, array)) {
return index
}
}
return -1
}

这段代码再次展示了 lodash 的特点,短小精悍!

这次读源码我们从里往外看。

从代码中很容易看到,predicate 是传递进来的函数,在 baseFindIndex 调用该函数,如果返回的结果为真值,则中止查找,返回索引。

运算符优先级

我们再往外看,看看 while 的循环条件:

fromRight ? index-- : ++index < length

现在问题来了,这个三元表达式有两种可能,一种是:

(fromRight ? index-- : ++index) < length

一种是:

fromRight ? index-- : (++index < length)

究竟是那一种呢?这就要看运算符的优化级了,下面这个表是 MDN 上的截图:

这个表将优化级划分成了20个级别,数字越大,优化级越高。

从表中可以看到,比较运算符的优先级为11,而三元表达式(条件运算符)的优化级为4,因此可以确定比较运算符的优先级要比三元表达式的要高,循环条件其实等价于第二种写法。

增减迷局

再往上看,可以看到这句代码:

let index = fromIndex + (fromRight ? 1 : -1)

在向后查找时, index 减少了1,而向前查找时,index 增加了1,为什么要这样做呢?

再结合循环条件看下:

fromRight ? index-- : ++index < length

在向前查找时,使用的是 index-- 表达式的运算结果,向后查找时,使用的是 ++index < lenth 表达式的运算结果。

从上表中也可以看出前缀自增比比较运算符的优化级要高。

前缀自增返回的是自增后的结果,而在循环条件中就要将索引 index 增加1,这样会忽略掉第一个需要遍历的元素,作为补救,在开始遍历前,需要将 index 减少1。

同理,在向前查找时,需要将索引增加1,因为在遍历开始时就已经将索引减少1。

那又为什么向前查找时用的是后缀自减,而不是用前缀自减呢?

因为在向前查找时,最终要查找到数组索引 0 的位置,后缀自减返回的是自减前的数值,因此当 index1 时,自减后的 index0 ,但是在循环条件中依然拿 1 来进行判断,所以使得索引 0 得以进入循环体。

关于前缀自增/减和后缀自增/减的区别可以看《lodash源码分析之自减的两种形式》。

参考

  1. MDN:运算符优先级

License

署名-非商业性使用-禁止演绎 4.0 国际 (CC BY-NC-ND 4.0)

最后,所有文章都会同步发送到微信公众号上,欢迎关注,欢迎提意见:

作者:对角另一面

lodash源码分析之baseFindIndex中的运算符优先级的更多相关文章

  1. lodash源码分析之compact中的遍历

    小时候, 乡愁是一枚小小的邮票, 我在这头, 母亲在那头. 长大后,乡愁是一张窄窄的船票, 我在这头, 新娘在那头. 后来啊, 乡愁是一方矮矮的坟墓, 我在外头, 母亲在里头. 而现在, 乡愁是一湾浅 ...

  2. lodash源码分析之自减的两种形式

    这个世界需要一个特定的恶人,可以供人们指名道姓,千夫所指:"全都怪你". --村上春树<当我谈跑步时我谈些什么> 本文为读 lodash 源码的第六篇,后续文章会更新到 ...

  3. lodash源码分析之List缓存

    昨日我沿着河岸/漫步到/芦苇弯腰喝水的地方 顺便请烟囱/在天空为我写一封长长的信 潦是潦草了些/而我的心意/则明亮亦如你窗前的烛光/稍有暧昧之处/势所难免/因为风的缘故 --洛夫<因为风的缘故& ...

  4. lodash源码分析之缓存方式的选择

    每个人心里都有一团火,路过的人只看到烟. --<至爱梵高·星空之谜> 本文为读 lodash 源码的第八篇,后续文章会更新到这个仓库中,欢迎 star:pocket-lodash gitb ...

  5. lodash源码分析之缓存使用方式的进一步封装

    在世界上所有的民族之中,支配着他们的喜怒选择的并不是天性,而是他们的观点. --卢梭<社会与契约论> 本文为读 lodash 源码的第九篇,后续文章会更新到这个仓库中,欢迎 star:po ...

  6. lodash源码分析之数组的差集

    外部世界那些破旧与贫困的样子,可以使我内心世界得到平衡. --卡尔维诺<烟云> 本文为读 lodash 源码的第十七篇,后续文章会更新到这个仓库中,欢迎 star:pocket-lodas ...

  7. angular源码分析:angular中脏活累活的承担者之$interpolate

    一.首先抛出两个问题 问题一:在angular中我们绑定数据最基本的方式是用两个大括号将$scope的变量包裹起来,那么如果想将大括号换成其他什么符号,比如换成[{与}],可不可以呢,如果可以在哪里配 ...

  8. angular源码分析:angular中入境检察官$sce

    一.ng-bing-html指令问题 需求:我需要将一个变量$scope.x = '<a href="http://www.cnblogs.com/web2-developer/&qu ...

  9. angular源码分析:angular中各种常用函数,比较省代码的各种小技巧

    angular的工具函数 在angular的API文档中,在最前面就是讲的就是angular的工具函数,下面列出来 angular.bind //用户将函数和对象绑定在一起,返回一个新的函数 angu ...

随机推荐

  1. 使用reqire.js 生成二维码

    最新项目中使用到 reqiure.js  ; 使用了一个月的感觉是: 这个确实是一个利器,如果会使用的话,能轻易理顺js之间的依赖关系,从而可以重复使用js,可以减少代码量,可以提升开发速度,但是  ...

  2. Codeforces 903D Almost Difference

    Codeforces 903D Almost Difference time limit per test 2 seconds memory limit per test 256 megabytes ...

  3. [51nod1206]Picture

    给你一坨矩形,问这些矩形组成的所有多边形的周长之和. 分别求竖着的边和横着的边. 离散化后线段树,维护当前行(或者列)有多少没在多边形里的,添加矩形就变成添加.删除线段. 每次加线段或删线段时累加一下 ...

  4. NEFU_117素数个数的位数

    题目传送门:点击打开链接 Problem : 117 Time Limit : 1000ms Memory Limit : 65536K description 小明是一个聪明的孩子,对数论有着很浓烈 ...

  5. Apache/Tomcat/JBOSS/Nginx区别

    先说Apache和Tomcat的区别: Apache是世界使用排名第一的Web服务器软件.它可以运行在几乎所有广泛使用的计算机平台上,由于其跨平台和安全性被广泛使用,是最流行的Web服务器端软件之一. ...

  6. css样式小记

    溢出文字展现为... .over-hidd { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

  7. jQuery:下拉列表的联动

    <%@ page language="java" import="java.util.*" pageEncoding="utf-8"% ...

  8. win7、win10进程pid4占用80端口的解决办法

    https://jingyan.baidu.com/article/7e4409533ffe092fc1e2ef10.html 今天想用wamp架设服务器,但是程序启动不起来,查看系统端口,80端口被 ...

  9. vue集成百度UEditor富文本编辑器

    在前端开发的项目中.难免会遇到需要在页面上集成一个富文本编辑器.那么.如果你有这个需求.希望可以帮助到你 vue是前端开发者所追捧的框架,简单易上手,但是基于vue的富文本编辑器大多数太过于精简.于是 ...

  10. NSDateFormatter相关整理

    //实例化一个NSDateFormatter对象NSDateFormatter *dateFormatter = [[NSDateFormatter alloc]init]; //设定时间格式,这里可 ...