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 值使用专门的查找方法,确保正确性
相关推荐
小小鸭程序员18 分钟前
NPM版本管理终极指南:掌握依赖控制与最佳实践
java·前端·spring·npm·node.js
KL's pig/猪头/爱心/猪头28 分钟前
lws-minimal-ws-server前端分析
前端
TheK29 分钟前
【源码分析】 一文搞清楚React全流程
前端
渔樵江渚上30 分钟前
使用 Web Worker 解析 CSV 文件
前端·javascript·面试
悟空和大王30 分钟前
win11下使用wsl2 + docker 打造前端开发环境
前端
Silence_xl31 分钟前
nvm安装node版本
前端
星光不问赶路人33 分钟前
梳理字节数据(Uint8Array)转换成字符串的4种方法
前端
前端卧龙人34 分钟前
如何通过 Nginx 实现前端与后端的协同部署
前端
simple丶35 分钟前
领域模型 DSL设计与解析引擎
前端
我不是迈巴赫36 分钟前
虚拟列表业务封装思路分享
前端·javascript