es-toolkit valuesIn 兼容 API 详解:遍历对象自身与原型链上所有属性值

发布时间:2026/9/16 13:31:40
es-toolkit valuesIn 兼容 API 详解:遍历对象自身与原型链上所有属性值 es-toolkit valuesIn 兼容 API 详解遍历对象自身与原型链上所有属性值【免费下载链接】es-toolkitA modern JavaScript utility library thats 2-3 times faster and up to 97% smaller, a major upgrade to lodash.项目地址: https://gitcode.com/GitHub_Trending/es/es-toolkit导读valuesIn是 es-toolkit 为兼容 lodash 而提供的对象工具函数它返回对象所有可枚举字符串键属性的值包括从原型链上继承的属性值。本篇文章围绕 docs/compat/reference/object/valuesIn.md 展开结合 src/compat/object/valuesIn.ts 与 src/compat/object/keysIn.ts 的源码实现说明其与原生Object.values的差异、适用场景与底层原理帮助你在迁移 lodash 代码时正确选型。使用警告valuesIn因需要遍历原型链属性内部逻辑复杂、运行较慢。官方文档明确建议优先使用更快的原生Object.values。只有在确实需要包含继承属性时才应使用本函数。函数签名与基本行为valuesIn返回对象所有属性值组成的数组包括继承的原型属性。const values valuesIn(obj);从 valuesIn.ts 可以看到该函数提供了两组 TypeScript 重载签名兼顾了泛型对象与数组/类数组对象两种调用场景export function valuesInT(object: Recordstring, T | Recordnumber, T | ArrayLikeT | null | undefined): T[]; export function valuesInT extends object(object: T | null | undefined): ArrayT[keyof T];参数objectany要查询属性值的对象。返回值any[]包含对象所有属性值的数组包含继承的原型属性值。基本用法普通对象与数组与Object.values最直观的区别在于valuesIn能识别并处理数组与类数组对象并且会包含原型链上的属性值。import { valuesIn } from es-toolkit/compat; const obj { a: 1, b: 2, c: 3 }; valuesIn(obj); // [1, 2, 3] // 同样支持数组 valuesIn([1, 2, 3]); // [1, 2, 3]这一点在源码中得到了印证valuesIn先调用keysIn(object)取得全部键名再逐个取值valuesIn.tsexport function valuesIn(object: any): any[] { const keys keysIn(object); const result: any[] new Array(keys.length); for (let i 0; i keys.length; i) { const key keys[i]; result[i] object[key]; } return result; }也就是说valuesIn的输出键序完全由keysIn决定二者是配套实现valuesIn与keysIn的对应关系可参照 compat 入口 compat.ts 中相邻的导出声明。包含原型链继承的属性值这是valuesIn区别于Object.values的核心能力import { valuesIn } from es-toolkit/compat; function Parent() { this.a 1; } Parent.prototype.inherited fromParent; function Child() { Parent.call(this); this.b 2; } Child.prototype Object.create(Parent.prototype); Child.prototype.childProp childValue; const obj new Child(); valuesIn(obj); // [1, 2, childValue, fromParent]constructor 被排除上述结果中的childValue与fromParent分别来自Child.prototype与Parent.prototype这正是In后缀的含义——遍历范围覆盖整个原型链。对应测试见 valuesIn.spec.tsit(should include inherited string keyed property values, () { function Foo(this: any) { this.a 1; } Foo.prototype.b 2; const expected [1, 2]; const actual valuesIn(new Foo()).sort(); expect(actual).toEqual(expected); });null 与 undefined 的处理对null或undefinedvaluesIn返回空数组不会抛错import { valuesIn } from es-toolkit/compat; valuesIn(null); // [] valuesIn(undefined); // []该行为由keysIn的入口守卫保证keysIn.tsexport function keysIn(object?: any): string[] { if (object null) { return []; } ... }底层实现与关键分支keysIn是valuesIn的键名来源其内部针对不同输入类型做了分支处理keysIn.ts理解这些分支有助于预测valuesIn的输出对象或函数进一步区分是否为类数组、是否为原型对象isPrototype分别走不同路径非对象原始值先通过Object(object)装箱后再收集键null / undefined直接返回空数组。值得注意的三个细节分支类数组对象按数组处理arrayLikeKeysIn会先按length生成索引键再补充继承的额外键keysIn.ts。因此对{ 0: a, 1: b, length: 2 }这类带length的对象valuesIn会返回[a, b, 2]键序中包含length的值对应测试 valuesIn.spec.ts。稀疏数组按稠密数组处理缺失的索引会被补齐用times生成全部索引保证与 lodash 行为一致。排除constructor当遍历到原型对象本身如Object.prototype时会过滤掉constructor键keysIn.ts这就是文档示例中constructor excluded注释的由来。另外arrayLikeKeysIn还为特殊宿主对象做了兼容Node.js 的 Buffer 会补充offset、parent键TypedArray 会补充buffer、byteLength、byteOffset键keysIn.ts避免遗漏这些运行环境特有的可枚举属性。与原生 Object.values、values 的对比选型场景推荐 API说明只取自身可枚举属性值Object.values原生方法性能最佳需包含原型链继承属性值valuesIn本兼容函数性能较慢与 lodashvalues对齐valuescompat只取自身属性参考values文档es-toolkit 官方在文档开头给出了明确的性能警告valuesIn因处理原型属性的复杂逻辑而运行缓慢应优先使用更快的Object.values。因此建议新代码一律使用原生Object.values迁移 lodash 遗留代码且确实依赖原型链属性时才用es-toolkit/compat下的valuesIn若只是需要与 lodashvalues语义对齐不含继承属性应改用values。小结valuesIn返回对象所有可枚举字符串键属性的值包含原型链继承的属性值对null/undefined返回[]对数组、类数组、稀疏数组均有 lodash 一致的兼容处理实现上委托给keysIn获取键名再取值constructor会被排除官方明确提示性能较慢能用Object.values时请优先使用原生方法。相关参考实现源码 valuesIn.ts、键名实现 keysIn.ts、测试用例 valuesIn.spec.ts、兼容入口导出 compat.ts。【免费下载链接】es-toolkitA modern JavaScript utility library thats 2-3 times faster and up to 97% smaller, a major upgrade to lodash.项目地址: https://gitcode.com/GitHub_Trending/es/es-toolkit创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

关于本文作者

来自尧图内容编辑团队

尧图内容编辑团队 内容团队

尧图内容编辑团队

本文由尧图网络内容编辑团队执笔。团队由资深项目经理、前端工程师与设计师组成,所有内容均来自亲手交付的真实项目,先讲清问题、再给出可落地的解法。尧图深耕北京网站建设十年,服务过京华建材集团、智造科技等各行业客户,把一线经验沉淀为可复用的行业观察。

  • 十年建站经验,覆盖建材、制造、服务、文创等
  • 项目经理把关选题与事实准确性
  • 工程师与设计师联合撰写专业细节
  • 统一编辑规范,保证文风与排版一致
  • 每月复盘转化数据,迭代选题方向

延伸阅读

相关资讯与近期热门内容

深度阅读推荐

建站决策前值得细读的三篇

网站改版的5个关键决策
2024-08-12

网站改版的5个关键决策

什么时候该改版、改到什么程度、如何避免流量掉光,京华建材集团改版复盘给出答案。

获取专属建站方案

看完文章,把您的行业与预算告诉我们,免费获取一份量身定制的官网建设方案与报价。

立即免费咨询