js展开循环
当要对一个大数组进行循环时,通常会通过局部变量缓存数组长度来提高性能,例:
for(var i=0,len=arr.len;i<len;i++){}
光是缓存数组长度或使用倒序遍历来减少判断外,另一个优化手段就是减少循环次数,减少循环次数使用的是duff's device算法,算法原理如下:
通过将 values 数组中元素个数除以 8 来计算出循环需要进行多少次迭代。然后使用取整的上限函数确保结果是整数。如果完全根据除 8 来进行迭代,可能会有一些不能被处理到的元素,这个数量保存在 startAt 变量中。首次执行该循环时,会检查 StartAt 变量看有需要多少额外调用。例如,如果数组中有 10 个值,startAt 则等于 2,那么最开始的时候 processer()则只会被调用 2 次。在接下来的循环中,每次循环都会调用 8 次 process()。展开循环可以提升大数据集的处理速度。
以下是优化版的duff's算法
const arr=Array.from({length:20},(value,key)=>key+1) //从1开始,生成length个元素
const len=arr.length,startAt=len%8,loopCount = Math.floor(len/8),i = 0
//不够8个的,独立循环
while(startAt--){
processer(arr[i++])
}
//8个一组,执行一次循环
while(loopCount--){
processer(arr[i++])
processer(arr[i++])
processer(arr[i++])
processer(arr[i++])
processer(arr[i++])
processer(arr[i++])
processer(arr[i++])
processer(arr[i++])
}
function processer(value){
console.log(value)
}
js展开循环的更多相关文章
- Node.js 事件循环(Event Loop)介绍
Node.js 事件循环(Event Loop)介绍 JavaScript是一种单线程运行但又绝不会阻塞的语言,其实现非阻塞的关键是“事件循环”和“回调机制”.Node.js在JavaScript的基 ...
- Node.js事件循环
Node JS是单线程应用程序,但它通过事件和回调概念,支持并发. 由于Node JS每一个API是异步的,作为一个单独的线程,它使用异步函数调用,以保持并发性.Node JS使用观察者模式.Node ...
- JS基础——循环很重要
介绍循环之前,首先要说一下同样很重要的if-else结构,switch-case结构 ①if-else结构 if(判断条件) { 条件为true时执行 } else{ 条件为false时执行 } ②i ...
- 【JS中循环嵌套常见的六大经典例题+六大图形题,你知道哪几个?】
首先,了解一下循环嵌套的特点:外层循环转一次,内层循环转一圈. 在上一篇随笔中详细介绍了JS中的分支结构和循环结构,我们来简单的回顾一下For循环结构: 1.for循环有三个表达式,分别为: ①定义循 ...
- js事件循环机制辨析
对于新接触js语言的人来说,最令人困惑的大概就是事件循环机制了.最开始这也困惑了我好久,花了我几个月时间通过书本,打代码,查阅资料不停地渐进地理解他.接下来我想要和大家分享一下,虽然可能有些许错误的 ...
- js 各种循环遍历
js 各种循环遍历(表格比较) 遍历方法 能否遍历数组 能否遍历对象 备注 for 能 不能 for in 能(有诸多缺点) 能 为遍历对象而设计的,不适用于遍历数组 forEach 能 不能 bre ...
- 6、Node.js 事件循环
#########################################################################################Node.js 事件循 ...
- js for循环的陷阱
☞问题概述 一页面有三个按钮,点击提示相应内容.相应内容已从后台获取,并转化成json数组. var content = ["提示1", "提示2", &quo ...
- Vue.js:循环语句
ylbtech-Vue.js:循环语句 1.返回顶部 1. 循环语句 循环使用 v-for 指令. v-for 指令需要以 site in sites 形式的特殊语法, sites 是源数据数组并且 ...
随机推荐
- flutter drawer 自定义图标 icon 手动打开drawer
方法1:GlobalKey import "package:flutter/material.dart"; class Test extends StatefulWidget { ...
- 六、postman做ui测试
一.思路 发请求去拿到网站的响应——>html 解析html标签,判断一些元素是否显示 二.目的 快速检查ui是否正确 三.用到的库 Cheerio https://cheerios.js.or ...
- ubuntu2 setting
luo@luo-ThinkPad-W540:research$ conda create -n tf2019 python=3.6Solving environment: done ==> WA ...
- 【源码解析】Flink 是如何基于事件时间生成Timestamp和Watermark
生成Timestamp和Watermark 的三个重载方法介绍可参见上一篇博客: Flink assignAscendingTimestamps 生成水印的三个重载方法 之前想研究下Flink是怎么处 ...
- LeetCode_350. Intersection of Two Arrays II
350. Intersection of Two Arrays II Easy Given two arrays, write a function to compute their intersec ...
- LeetCode_231. Power of Two
231. Power of Two Easy Given an integer, write a function to determine if it is a power of two. Exam ...
- Vue学习笔记十一:按键修饰符和自定义指令(钩子函数)
目录 padStart:补位 按键修饰符 Vue提供的按键修饰符 自定义按键修饰符 自定义指令 自定义指令的使用 钩子函数 钩子函数参数 使用钩子函数的bingding参数 私有自定义指令 钩子函数的 ...
- jenkins编译时文件存放的位置
1.首先随便打包编译一下 2.查看编译执行的目录 [root@bogon ~]# ls /root/.jenkins/workspace/pipline-test/ CHANGE_LOGS.html ...
- 修改ecshop的70种技巧
1.如何修改网站”欢迎惠临本店”答复(dafu):languages\zh_cn\common.php文件中,$_LANG['welcome']=’欢迎惠临本店’:将他修改成你需要的字样. 2.如何修 ...
- nodejs应用转换png,jpg,gif为webp图片格式
本博客列表缩略图在支持webp格式的浏览器下,使用的是webp格式图片,不支持webp图片下使用的是原图片(如png,gif,jpg等) webp使用指南,请参考 https://www.imqian ...