Lodash 的 includes 还是 Array.prototype.includes

Lodash 的 _.includes 和 JavaScript 原生的 Array.prototype.includes 虽然功能相似(判断是否包含某个值),但在使用场景、参数设计和底层实现上有显著区别。以下是两者的对比:


一、核心区别

特性 Lodash _.includes 原生 Array.includes
适用范围 支持数组、对象、字符串 仅限数组
参数顺序 _.includes(collection, value, fromIndex=0) array.includes(value, fromIndex=0)
对象处理 可以检查对象中是否包含某个键值对(需自定义逻辑) 不支持对象
字符串处理 支持直接检查子字符串(如 _.includes('abc','b') 只能用于数组,字符串需先转为数组
兼容性 兼容所有浏览器(包括旧版 IE) ES6+ 环境支持(IE11+ 部分支持)

二、具体场景示例

1. ​数组检查

markdown 复制代码
javascript复制// Lodash
_.includes([1, 2, 3], 2); // true

// 原生
[1, 2, 3].includes(2); // true

结论:两者行为一致,但 Lodash 更适用于需要兼容旧浏览器的场景。


2. ​从指定索引开始检查

markdown 复制代码
javascript复制// Lodash(第三个参数为起始索引)
_.includes([1, 2, 3, 2], 2, 2); // true(从索引2开始检查)

// 原生
[1, 2, 3, 2].includes(2, 2); // true

结论:参数设计不同,但功能一致。


3. ​对象检查(Lodash 独有)​

markdown 复制代码
javascript复制const obj = { a: 1, b: 2 };

// 检查对象是否包含某个键
_.includes(obj, 1); // true(检查值是否存在)
_.includes({ 'a': 1 }, 1); // true

// 检查对象是否包含某个键值对(需结合其他方法)
_.includes(_.toPairs(obj), ['a', 1]); // true(先将对象转为键值对数组)

原生方法无法直接处理对象


4. ​字符串检查(Lodash 更简洁)​

markdown 复制代码
javascript复制// Lodash
_.includes('hello', 'e'); // true

// 原生(需操作字符串或转为数组)
'hello'.indexOf('e') !== -1; // true
Array.from('hello').includes('e'); // true(复杂且低效)

三、性能与推荐场景

场景 推荐方法 原因
仅需检查数组元素 Array.includes 原生方法性能更优(无需引入库)
兼容旧浏览器 _.includes 弥补原生兼容性不足
处理对象或字符串 _.includes 原生无法直接支持
需要链式调用(Lodash链) _.includes 与 Lodash 其他方法组合更流畅

四、总结

  • 优先使用原生 Array.includes
    若项目环境支持 ES6+,且仅需处理数组,原生方法更高效简洁。
  • 选择 Lodash _.includes
    需要兼容旧浏览器、处理对象/字符串,或结合 Lodash 链式操作时更灵活。
相关推荐
海兰5 小时前
【应用】基于 Next.js 16 + Python mplfinance的金融K线图与技术指标可视化平台(三)
javascript·python·金融
小磊哥er6 小时前
深入解构Claude Code - 第 7 篇 · 连接外面的世界
javascript·ai编程
小磊哥er7 小时前
深入解构Claude Code - 第 6 篇 · 终端里的图形界面
javascript·ai编程
海兰7 小时前
【应用】基于 Next.js 16 + Python mplfinance的金融K线图与技术指标可视化平台(一)
javascript·python·金融
可乐鸡翅yeah_8 小时前
hls.js 内存泄漏实战排查,直播 M3U8 长时间播放异常定位方案
开发语言·javascript·python·django·ecmascript·m3u8·m3u8在线
可乐鸡翅yeah_8 小时前
第三方接口对接 M3U8 流媒体排坑实战,解决外部服务商流兼容难题
前端·javascript·python·django·html·m3u8·m3u8在线
默_笙9 小时前
🏠 「LLM Notes」:我用 Next.js + Redis 给自己造了个笔记博客
前端·javascript
ruanCat10 小时前
Prettier 明明执行成功,Markdown 为什么还是没变?一次插件误诊复盘
前端·javascript·node.js
软件开发技术深度爱好者10 小时前
在线学习实践 TypeScript 的官方Playground(演练场)使用介绍
javascript·学习·typescript
小磊哥er13 小时前
深入解构Claude Code - 第 5 篇 · 每次提问都给 AI 塞了什么资料
javascript·ai编程