Lodash源码阅读-baseIndexOf

Lodash 源码阅读-baseIndexOf

功能概述

baseIndexOf 是 Lodash 中的一个基础工具函数,它的主要作用是在数组中查找一个值的位置。这个函数特别之处在于它能够处理普通值和 NaN 值两种情况,是 Lodash 中 indexOf 方法的核心实现。

前置学习

在深入理解 baseIndexOf 函数之前,建议先了解以下相关概念:

  • strictIndexOf

  • baseFindIndex

二、源码实现

js 复制代码
function baseIndexOf(array, value, fromIndex) {
  return value === value
    ? strictIndexOf(array, value, fromIndex)
    : baseFindIndex(array, baseIsNaN, fromIndex);
}

相关依赖函数:

js 复制代码
// 判断是否为 NaN
function baseIsNaN(value) {
  return value !== value;
}

三、实现原理

1. 整体思路

说人话就是:这个函数主要解决了两个问题:

  1. 普通值的查找:就是简单地用 === 严格相等来比较,通过调用 strictIndexOf 实现
  2. NaN 值的查找:因为 NaN === NaNfalse,所以需要特殊处理,通过调用 baseFindIndex 实现

具体实现思路:

  1. 先判断要查找的值是不是 NaN(用 value === value 判断)
  2. 如果不是 NaN,就用 strictIndexOf 函数进行查找
  3. 如果是 NaN,就用 baseFindIndex 配合 baseIsNaN 进行查找

2. 参数说明

  • array:要搜索的数组
  • value:要查找的值
  • fromIndex:从哪个位置开始找

3. 逐行解析

js 复制代码
return value === value;
  • 这行代码是在判断要查找的值是不是 NaN
  • 因为只有 NaN 跟自己比较会返回 false
  • 所以 value === value 为 true 时表示是普通值,为 false 时表示是 NaN
js 复制代码
? strictIndexOf(array, value, fromIndex)
  • 如果是普通值,就用 strictIndexOf 函数查找
js 复制代码
: baseFindIndex(array, baseIsNaN, fromIndex)
  • 如果是 NaN 值,就用 baseFindIndex 配合 baseIsNaN 来查找

四、使用示例

js 复制代码
// 1. 查找普通数值
const arr1 = [1, 2, 3, 4, 5];
baseIndexOf(arr1, 3, 0); // => 2

// 2. 从指定位置开始查找
const arr2 = [1, 2, 3, 2, 1];
baseIndexOf(arr2, 2, 3); // => 3 (从索引3开始找2)

// 3. 查找 NaN 值
const arr3 = [1, NaN, 2, NaN, 3];
baseIndexOf(arr3, NaN, 0); // => 1 (找到第一个 NaN)
baseIndexOf(arr3, NaN, 2); // => 3 (从索引2开始找 NaN)

// 4. 找不到的情况
baseIndexOf(arr1, 10, 0); // => -1 (数组中没有10)
baseIndexOf(arr1, 2, 5); // => -1 (从索引5开始找,但数组长度只有5)

// 5. 查找字符串
const arr4 = ["a", "b", "c", "b", "a"];
baseIndexOf(arr4, "b", 0); // => 1

五、总结

  1. 巧妙的 NaN 检测

    js 复制代码
    value === value;

    用一个简单的相等比较就能判断值是否为 NaN,代码简洁优雅

  2. 函数职责分离

    js 复制代码
    ? strictIndexOf(array, value, fromIndex)
    : baseFindIndex(array, baseIsNaN, fromIndex)

    根据不同情况使用不同的查找函数,每个函数职责单一

  3. 性能优化

    • 普通值使用 strictIndexOf,避免了不必要的函数调用
    • NaN 值使用专门的查找方法,确保正确性
相关推荐
加班是不可能的,除非双倍日工资2 小时前
css预编译器实现星空背景图
前端·css·vue3
wyiyiyi3 小时前
【Web后端】Django、flask及其场景——以构建系统原型为例
前端·数据库·后端·python·django·flask
gnip3 小时前
vite和webpack打包结构控制
前端·javascript
excel4 小时前
在二维 Canvas 中模拟三角形绕 X、Y 轴旋转
前端
阿华的代码王国4 小时前
【Android】RecyclerView复用CheckBox的异常状态
android·xml·java·前端·后端
一条上岸小咸鱼4 小时前
Kotlin 基本数据类型(三):Booleans、Characters
android·前端·kotlin
Jimmy4 小时前
AI 代理是什么,其有助于我们实现更智能编程
前端·后端·ai编程
ZXT4 小时前
promise & async await总结
前端
Jerry说前后端4 小时前
RecyclerView 性能优化:从原理到实践的深度优化方案
android·前端·性能优化
画个太阳作晴天4 小时前
A12预装app
linux·服务器·前端