js中的for循环 写法的效率对比

最新推荐文章于 2022-11-05 11:24:29 发布
最新推荐文章于 2022-11-05 11:24:29 发布
阅读量419 收藏
点赞数
分类专栏： js
一共三种写法 如下：
view sourceprint?
for (var i = 0; i < arr.length; i++)
 
view sourceprint?
for (var i in arr)
 
view sourceprint?
for (var i = 0, len = arr.length; i < len; i++)
 
先看下运行测试的界面：
再看下对应的三个结果，三种写法执行的效率是有很大不同的：
如此看来，执行效率最快的是第三种：
view sourceprint?
for (var i = 0, len = arr.length; i < len; i++)
先声明变量，再进行循环判断，效率远比遍历数组高得多，也比循环取得数组长度的效率快得多！
下面是页面源代码：
view sourceprint?
<html>
<body>
<script type="text/网页特效">
  
function makeArr(num) {
    var arr = [];
    for (var i = 0; i<num; i++){
        arr.push('abc');
    }
    arr.join('');
    return arr;
}
var num = 10000000;
function function1() {
    var arr = makeArr(num);
    var start = (new Date()).valueOf();
    var count = 0;
    for (var i = 0; i < arr.length; i++) {
        count++;
    }
    var end = (new Date()).valueOf();
    console.log('Count: '+count+' times');
    console.log('Time spent: '+(end - start));
}
function function2() {
    var arr = makeArr(num);
    var start = (new Date()).valueOf();
    var count = 0;
    for (var i in arr) {
        count++;
    }
    var end = (new Date()).valueOf();
    console.log('Count: '+count+' times');
    console.log('Time spent: '+(end - start));
}
function function3() {
    var arr = makeArr(num);
    var start = (new Date()).valueOf();
    var count = 0;
    for (var i = 0, len = arr.length; i < len; i++) {
        count++;
    }
    var end = (new Date()).valueOf();
    console.log('Count: '+count+' times');
    console.log('Time spent: '+(end - start));
}
  
  
  
</script>
  
for (var i = 0; i < arr.length; i++) <br />
<button onClick="function1();">loop 1</button><br />
<p id="f1"></p>
  
for (var i in arr)<br />
<button onClick="function2();">loop 2</button><br />
<p id="f2"></p>
  
for (var i = 0, len = arr.length; i < len; i++)<br />
<button onClick="function3();">loop 3</button><br />
<p id="f3"></p>
  
</body>
</html>
louislam0620
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JavaScript中for循环的几种写法与效率总结
10-20
每个接触JS的开发人员都不可避免的与for循环打交道，毕竟这是遍历必不可少的工具之一。然而当循环次数比较大时，效率问题必须重视。下面这篇文章就主要介绍了JavaScript中几种for循环的写法与效率,需要的朋友可以参考借鉴，下面来一起看看吧。
Javascript中for循环的三种写法的效率对比
yupr2011的专栏
09-02 567
一共三种写法 如下： view sourceprint? for (var i = 0; i view sourceprint? for (var i in
js各种数组循环方法和效率等对比
sinat_33263516的博客
09-18 628
<script> function op(item) { item.name = item.name + 'W' } function normalFor(arr) { let start = new Date().getTime() for (let j = 0; j < arr.length; j++) { op(arr[j]) .
JavaScript中for循环的效率对比
qq_27361945的博客
01-04 2810
http://www.jb51.net/article/80854.htm Underscore.js库 你一天（一周）内写了多少个循环了？ ? 1 2 3 4 5 var i; for(i = 0; i  var someThing = someArray[i];  doSomeWorkOn(someThing)
JavaScript 中哪一种循环最快呢？
程序员成长指北
04-13 1118
究竟哪一种循环更快？答案其实是：for（倒序）最让我感到惊讶的事情是，当我在本地计算机上进行测试之后，我不得不接受 for（倒序）是所有 for 循环中最快的这一事实。下面我会举个对一个包...
Javascript中for循环语句的几种写法总结对比
10-20
如果您希望一遍又一遍地运行相同的代码，并且每次的值都不同，那么使用循环是很方便的,javascript中for循环也是非常常用的,下面这篇文章主要介绍了Javascript中for循环的几种写法,需要的朋友可以参考借鉴，一起来看...
for 循环性能比较 提高for循环的效率
09-06
在本文中，我们将讨论for 循环性能比较和提高for 循环的效率。 首先，让我们看一下两个不同的for 循环写法： ```csharp for(int i=1,n=tempUser.length;i ;i++) ``` 和 ```csharp for(int i=1;i ;i++) ``` 乍看...
深入探究JavaScript中for循环的效率问题及相关优化
01-21
Underscore.js库 你一天（一周）内写了多少个循环了？ var i; for(i = 0; i < someArray.length; i++) { var someThing = someArray[i]; doSomeWorkOn(someThing); } 这当然无害，但这种写法非常丑而且奇怪，...
JavaScript的for循环写法及效率
yc123h的博客
05-18 5110
欢迎访文我的博客YangChen’s Blogfor循环，再常用不过了。但是这回说下for循环是因为看代码时我居然没有看明白一个for循环的意思，真是不应该啊。这个for循环是这么写的：for (var i = 0, rule; rule = rules[i++];) { //do something }这个写法是什么意思呢？后面再说，现卖个关子，这个写法我感觉还是挺好的。for循环写法对效
JS循环性能对比
TrumanGao的博客
06-21 1268
最近在做的在线商城项目，因为数据量大，循环操作较多，所以项目性能优化先从循环开始；以下是JS几种常见遍历方式用例和性能对比： // 模拟数据 let arr = [{ name: 'zs', age: '11'}, { name: 'zs', age: '11'}, { name: 'zs', age: '11'}, { name: 'zs', age: '11'}, { nam...
Javascript循环性能比较
u013017173的博客
08-10 264
Javascript循环性能比较 javascript传统的数组遍历有for循环，while循环，以及for-in。 比较的是以下几种循环遍历方法： 循环方式 备注 正向for循环 逆向for 循环 减少一次控制条件比较，性能理论上比正向for循环稍好 while 循环 for-in循环 理论上性能最差 for-each循环 duff device 循环 利用并发，理论性能最好 具体参考链接： 点击跳转 ...
js 循环对比
qq_36020836的博客
12-19 572
最近在一家培训机构做了前端讲师了，自己以前根本不需要过脑的代码，得备课到很晚。主要是怕学生学不会，虽然说东西很简单 我今天说一下js 各种循环的差别 循环是在满足条件的情况下，去不断重复的执行一种操作； for(初始部分；循环次数；条件迭代){     javascript:;代码 } for循环的一个执行顺序是     1:、先是初始部分。2、条件判断 ；当条件为true时，3、进...
javascript中for循环的几种写法与总结
chengzhang_jian的博客
08-05 5075
如果您希望一遍又一遍地运行相同的代码，并且每次的值都不同，那么使用循环是很方便的。迭代语句又叫循环语句。 JavaScript 支持不同类型的循环： for - 循环代码块一定的次数 for/in - 循环遍历对象的属性 while - 当指定的条件为 true 时循环指定的代码块 while -do 当指定的条件为 true 时循环指定的代码块 1.for循环的一般写法为:
js中三种for循环（含案例分析）
热门推荐
Cuichenyang158的博客
11-05 1万+
vue三种for循环，区别，作用
javascript 三种for循环方式:
LiHaoDong_JAVA的博客
06-13 386
三种for循环方式: var array = [1,2,3,4,5,6]; // 优势:1)可读性好 2)性能好 // 劣势:1)结构复杂 2)i变量的作用域不严谨 for(var i=0;i<array.length;i++){ console.log(array[i]); } // 优势:结构简单 // 劣势:1)可读性差,性能相对也不太好 2)i的作用域不严谨 for(var i in array){ console.log(array[i]); } 以上使用var定义的变量i,
JavaScript 中的 3 种 for 循环语句
←か淡定☆ ヾ 的博客
07-06 552
1. for 应用较广，简单实用。 const array = [4, 7, 9, 2, 6]; for (let index = 0; index < array.length; index++) { const element = array[index]; console.log(element); } // 4, 7, 9, 2, 6 2. for … in for...in 语句可以以任意顺序遍历一个对象的除 Symbol 以外的可枚举属性。 const temp =..
js中几种循环方式和性能分析
wangshang1320的博客
02-20 1417
1.普通for循环 for (let i = 0; i < arr.length; i++) { let obj = arr[i]; } 优化： for (let i = 0,len = arr.length-1; i < len; i++) { let obj = arr[i]; } 2.foreach 数组方法 arr.forEach(f...
js的四种for循环的区别和优化写法，与性能区别
HDdgut的博客
04-21 537
orEach和map,await不生效；使用break或continue会报错 for循环、for…in,for…of，支持await，for和for…of中可以使用break和continue；for…in会忽略continue和break
JavaScript中for循环的使用
编程界明世隐的博客
12-02 2535
For 循环 for 循环的语法如下： for (语句 1; 语句 2; 语句 3) { 要执行的代码 } 语句1在循环开始之前执行。 语句2判断循环的条件。 语句3在循环每执行一次后执行。 实例： for(var i=0;i<7;i++){ console.log(i) } 输出： 0 1 2 3 4 5 6 每次循环执行的时候会去判断 i<7 成立就会执行循环一次，否则循环不在执行； 每次循环后会执行：i++ 进行递增。 注意: break语句可以中...
js中for循环的写法
最新发布
10-14
在JavaScript中，for循环有以下几种写法： 1. 基本写法： ``` for (初始化表达式; 条件表达式; 递增表达式) { // 循环体 } ``` 2. for...in循环（用于遍历对象属性）： ``` for (variable in object) { // ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值