lodash中foreach踩坑

2023-11-29 22:52
文章标签 foreach lodash

本文主要是介绍lodash中foreach踩坑,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

什么是lodash

Lodash 是一个 JavaScript 实用工具库,提供了很多用于处理数据、简化开发等方面的功能。它提供了一组常用的工具函数,用于处理数组、对象、字符串等常见数据结构,同时也包含了一些函数式编程的工具。对于前端开发来说,是个很好用的工具,甚至看过​有人说面试不会lodash被嘲讽了。

我所在的公司项目中也用了这个库,今天就听同事吐槽,他循环两万条数据,进入卡住了溢出了,找了半天问题,最后没想到是foreach的过,换成for循环就没问题了​。

那么为什么呢,lodash是怎么实现foreach的呢​?源码如下:

import arrayEach from './.internal/arrayEach.js';
import baseEach from './.internal/baseEach.js';/*** Iterates over elements of `collection` and invokes `iteratee` for each element.* The iteratee is invoked with three arguments: (value, index|key, collection).* Iteratee functions may exit iteration early by explicitly returning `false`.** **Note:** As with other "Collections" methods, objects with a "length"* property are iterated like arrays. To avoid this behavior use `forIn`* or `forOwn` for object iteration.** @since 0.1.0* @alias each* @category Collection* @param {Array|Object} collection The collection to iterate over.* @param {Function} iteratee The function invoked per iteration.* @returns {Array|Object} Returns `collection`.* @see forEachRight, forIn, forInRight, forOwn, forOwnRight* @example** forEach([1, 2], value => console.log(value))* // => Logs `1` then `2`.** forEach({ 'a': 1, 'b': 2 }, (value, key) => console.log(key))* // => Logs 'a' then 'b' (iteration order is not guaranteed).*/
function forEach(collection, iteratee) {const func = Array.isArray(collection) ? arrayEach : baseEach;return func(collection, iteratee);
}export default forEach;

源码感兴趣可以去github上看

以下是一个对 Lodash forEach 源码的简要分析:

function forEach(collection, iteratee) {const func = Array.isArray(collection) ? arrayEach : baseEach;return func(collection, iteratee);
}function arrayEach(array, iteratee) {let index = -1;const length = array == null ? 0 : array.length;while (++index < length) {if (iteratee(array[index], index, array) === false) {break;}}return array;
}function baseEach(collection, iteratee) {let index = -1;const iterable = Object(collection);const length = iterable.length;while (++index < length) {if (iteratee(iterable[index], index, iterable) === false) {break;}}return collection;
}

这里对 Lodash 的 forEach 进行了两个版本的优化:arrayEach 用于数组,baseEach 用于通用集合。它们都使用了一个 while 循环来迭代集合中的元素,调用传入的 iteratee 函数。

主要要点:

  1. 类型检测:forEach 函数中,通过 Array.isArray 来判断集合的类型。如果是数组,则使用 arrayEach 进行迭代;否则,使用 baseEach
  2. 迭代逻辑: arrayEachbaseEach 都使用了一个 while 循环来遍历集合。在每次迭代中,调用传入的 iteratee 函数,并检查其返回值。如果返回值为 false,则中断循环。
  3. 性能优化: Lodash 的实现对性能进行了一些优化,比如使用了 length 变量缓存集合的长度,减少了重复计算。
  4. 处理对象:baseEach 中,通过 Object(collection) 将集合转换为一个可迭代的对象。这样可以确保 baseEach 对于对象的处理更加一致,无论是否为数组。

那么为什么在特别大数据下会出现问题呢

使用 forEach 处理几万条数据量可能会导致栈溢出的问题,这通常是因为递归调用造成的。Lodash 的 forEach 实现是基于递归的,而不是基于循环的,因此对于大型数据集,递归深度可能会导致栈溢出。

为了解决这个问题,可以考虑使用其他方法,比如使用普通的 for 循环等。

这篇关于lodash中foreach踩坑的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/434636

相关文章

使用 Lodash 提供的 isNil 和 omitBy 实现对象空属性的过滤

import { isNil, omitBy } from 'lodash-es'; 是一行 JavaScript 代码,用于从 lodash-es 库中导入两个函数:isNil 和 omitBy。以下是它们的作用: 1、isNil: 检查传入的值是否为 null 或 undefined。 isNil(null); // trueisNil(undefined); // trueis

MyBatis - 使用foreach迭代List/Array的说明

在 MyBatis 中的 foreach 元素,主要用于迭代 集合数据 以动态生成执行语句;主要有 item、index、collection、open、separator、close 等属性 属性说明         collection:要迭代的数据集对象,必填项         item:迭代出的元素的别名,必填项         index:元素的序号(map时为k

ArrayList集合为什么不能使用foreach增删改

点击上方“朱小厮的博客”,选择“设为星标” 后台回复”加群“加入公众号专属技术群 来源:http://suo.im/4XaI8Q 编程过程中常常需要使用到集合,而ArrayList也是我们常常使用的,但是最近在一次删除和增加中出现了一些问题,分享记录下。 请看下面两段代码,哪段代码会报错呢,或者都成功呢。 List<String> arrayList1 = new ArrayList<Stri

c#中foreach的使用

循环语句是编程的基本语句,在C#中除了沿用C语言的循环语句外,还提供了foreach语句来实现循环。那么我要说的就是,在循环操作中尽量使用foreach语句来实现。 为了来更好地说明为什么要提倡使用foreach,用如下三种不同方式来编写循环语句。 int[] nArray = new int[100]; // Use "foreach" to loop arrayforeach(

Jstl表达式out、set、if、choose、forEach

JSP标准标签库(JSTL)是一个JSP标签集合,它封装了JSP应用的通用核心功能。 JSTL 库安装 Apache Tomcat安装JSTL 库步骤如下: 从Apache的标准标签库中下载的二进包(jakarta-taglibs-standard-current.zip)。 官方下载地址:http://archive.apache.org/dist/jakarta/taglibs/sta

angularjs中的工具方法(forEach等)

angular.bind(self, fn, args) 作用:返回一个新的函数,绑定这个函数的this指向self参数:  self:新函数的上下文对象fn:需要绑定的函数args:传递给函数的参数 返回值:this指向self的新函数 var obj = { name: 'xxx', print: function (country) { console.log(thi

forEach 无法跳出循环必须使用for

foreach不能使用break和continue这两个关键字。使用return 作用只能跳出当前循环,并不能阻止整个循环,达到效果 因为 forEach 本身无法跳出循环,必须遍历所有的数据才能结束,它传入的是一个回调函数,因此形成了一个作用域,它内部所定义的变量不会像for循环一样污染全局变量。 解决办法:try catch forEach方法跳出循环 —— 通过 try catch 抛

Lodash——JavaScript中的工具库

Lodash 是一个实用的 JavaScript 工具库,它提供了许多方便的函数,用于处理数组、对象、字符串等常见的数据结构。以下是关于 Lodash 的一些主要特点和用途: 一、函数式编程风格 简洁的代码:Lodash 的函数通常采用简洁的链式调用方式,使得代码更加易读和易于维护。例如,使用 Lodash 可以这样处理数组: const numbers = [1, 2, 3,

C# foreach集合遍历循环语句

foreach语句用于枚举一个集合的元素,并对该集合中的每个元素执行一次相关的嵌入语句。 首先先了解,什么样的集合可以被遍历 Array这个类中有很多接口(一般都是大写I开头),在c# 语言当中所有实现了IEnumerable这个接口的类就是可以被遍历的集合。 对集合进行遍历: int[] intArray = new int[] { 1, 2, 3, 4, 5, 6, 7,

forEach和map遍历大数据,到底谁更快?实践出真知

你好同学,我是沐爸,欢迎点赞、收藏、评论和关注。 针对大量数据进行遍历时,forEach和map相比,谁的的性能更高,执行的更快?你觉得呢?先百度一下 但是,今天我没选择相信搜索结果,我决定测试一下。我不仅仅测试了forEach和map,还带上了for,结果出乎意料! 我创建一个包含一亿个元素的数组,对三个方法分别执行相同的求和操作: forEach const largeArray =