谈谈Javascript中那些For循环的事
let arr = [1, 2, 3, 4, 5];
One
从初学编程就开始用的最基础的一种循环:
for (let i = 0; i < arr.length; i++) {console.log(arr[i]);}
输出结果:1,2,3,4,5
Two
数组原型方法:Array.prototype.forEach()。forEach()
方法对数组的每个元素执行一次提供的函数。
语法
arr.forEach(callback[, thisArg]);
参数
callback
为数组中每个元素执行的函数,该函数接收三个参数:
currentValue
数组中正在处理的当前元素。
index
可选数组中正在处理的当前元素的索引。
array
可选
forEach()
方法正在操作的数组。
thisArg
可选可选参数。当执行回调函数时用作
this
的值(参考对象)。
详细信息可看:Array.prototype.forEach()
arr.forEach(function (element) {console.log(element);});
输出为:1,2,3,4,5
改变为箭头函数:
arr.forEach(element => {console.log(element);
})
不过对于forEach循环来说:在循环体中不能进行判断,不能跳过或者终止循环:
arr.forEach(element => {if (element == 2) {//不能跳过或者终止break;// continue;}console.log(element);
})
continue同样的报错,违法使用方法。
Three
for...in 语句用于遍历数组或者对象的属性(对数组或者对象的属性进行循环操作)。
JavaScript for...in 语句
for...in 语句用于对数组或者对象的属性进行循环操作。
for ... in 循环中的代码每执行一次,就会对数组的元素或者对象的属性进行一次操作。
语法:
for (变量 in 对象) {在此执行代码 } “变量”用来指定变量,指定的变量可以是数组元素,也可以是对象的属性。
for (let index in arr) {//属性 输出console.log(index);
}
输出:0,1,2,3,4
如果想输出数组值:
for (let index in arr) {console.log(arr[index]);
}
输出:1,2,3,4,5
注意:
1. 对于for...in函数:会遍历数组上的可枚举属性,加上属性:
arr.source = 0;
再次使用上面代码进行遍历,输出:
对于第一段代码(输出index)的输出值:0,1,2,3,4,source
对于第二段代码(输出arr[index])的输出值:1,2,3,4,5,0
2.同样会输出自己设置的数组上的原型方法:
Array.prototype.first = function(){return this[0];
}
对于第一段代码(输出index)的输出值:
对于第二段代码(输出arr[index])的输出值:
Four
for...of
语句在可迭代对象(包括 Array
,Map
,Set
,String
,TypedArray
,arguments 对象等等)上创建一个迭代循环,调用自定义迭代钩子,并为每个不同属性的值执行语句。
详细信息可看:for...of
与forEach()方法不同的是,可以进行跳过或者终止。其循环的值是属性值,不会遍历非数字属性:
for (const element of arr) {if (element == 2) {//可以跳过或者终止break;// continue;}console.log(element);
}
由于条件判断,输出为:
Other -- Array.prototype.reduce()
最近刷题一直用,但是一直没怎么好好学习这个方法。reduce()
方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。
语法:
arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])
接收四个参数:
accumulator 累计器
currentValue 当前值
currentIndex 当前索引
array 数组
[0, 1, 2, 3, 4].reduce(function(accumulator, currentValue, currentIndex, array){return accumulator + currentValue;
});
更多信息:Array.reduce()
谈谈Javascript中那些For循环的事相关推荐
- 也谈谈Javascript中的几个怪异特性(上)
2019独角兽企业重金招聘Python工程师标准>>> Andy Croxall在Ten Oddities And Secrets About JavaScript罗列了他认为的10 ...
- JavaScript中利用for循环遍历数组
这篇文章主要为大家详细介绍了JavaScript中利用for循环遍历数组,最好不要使用for in遍历,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 先看一段代码 1 2 3 4 5 6 7 8 ...
- django中的for循环_深入了解 JavaScript 中的 for 循环
在ECMAScript5(简称 ES5)中,有三种 for 循环,分别是: 简单for循环 for-in forEach 在2015年6月份发布的ECMAScript6(简称 ES6)中,新增了一种循 ...
- javascript中的for循环
使用方法1: for(i=0;i<10;i++) { } 使用方法2:(可以对数据.对象成员等进行遍历) var y = [2, 3, 5]; for (i in y) docu ...
- JavaScript中for..in循环陷阱介绍
for...in循环中的循环计数器是字符串,而不是数字它包含当前属性的名称或当前数组元素的索引,下面有个不错的示例大家可以参考下 大家都知道在JavaScript中提供了两种方式迭代对象: (1)f ...
- this调用语句必须是构造函数中的第一个可执行语句_谈谈JavaScript中的函数构造式和new关键字...
您是否曾困惑于 Javascript 中的new关键字呢?是否曾想理解关于 function 和 constructor 的区别是什么呢? 大多数 Javascript 的新开发者不太想要使用new关 ...
- php for循环in的用法,JavaScript中for in循环是如何使用的?需要注意些什么?
大家都知道在JavaScript中提供了两种方式迭代对象: (1)for 循环: (2)for..in循环: 使用for循环进行迭代数组对象,想必大家都已经司空见惯了.但是,使用for.. in循环时 ...
- php event loop,理解javascript中的事件循环(Event Loop)
背景 在研究js的异步的实现方式的时候,发现了JavaScript 中的 macrotask 和 microtask 的概念.在查阅了一番资料之后,对其中的执行机制有所了解,下面整理出来,希望可以帮助 ...
- 谈谈JavaScript中的function constructor和new关键字
您是否曾困惑于 Javascript 中的new关键字呢?是否曾想理解关于 function 和 constructor 的区别是什么呢? 大多数 Javascript 的新开发者不太想要使用new关 ...
最新文章
- String创建方式及其区别(快速了解)
- 人工智能:决胜未来之道培训课程大纲
- anaconda安装tensorflow gpu_安装Tensorflow-gpu的来龙去脉
- 2021计算机基础知识题库,2021~2021计算机基础知识练习题
- 操作系统之文件管理:5、文件物理结构(连续分配、链式(显式、隐式)分配、索引分配(链接、多层索引、混合索引))
- 工作笔记-增加swap分区空间
- Gentoo Framebuffer, Bootsplash Grubsplash 指南(修改版)
- MJRefresh的使用
- 论学习的重要性之 -- 影院售票系统
- 100亿+数据量,每天50W+查询,携程酒店数据智能平台实践
- EDIUS 8中的快捷键该如何自定义
- windows命令行下ftp连接超时的可能原因
- Java中关于二叉树详解
- 陶大程招收博士计算机视觉,回顾优必选AI首席科学家陶大程博士获IEEE ICDM研究贡献奖的相关事件...
- 戴尔_从偶像派到实力派【我身边的戴尔企业级解决方案】
- CSS3box-shadow属性详解
- 交叉报表制作--Smartbi报表工具一步完成
- 双十一过后,你的钱包还好嘛?快速回血攻略来了
- 瑞萨单片机iap串口升级boot程序与app程序合并的工程构建-学习记录
- Wireles Tools移植
热门文章
- VALSE 2020 公开征集 Workshop 候选讲者
- CVPR 2019 论文大盘点—文本图像相关篇
- 字节跳动 2022 校园招聘研发提前批正式启动!
- 【资源下载】 UC 伯克利 Chelsea Finn 博士论文(新起之秀——MAML)《Learning to Learn with Gradients》下载--2018ACM最佳博士论文下载
- Python中的operator.itemgetter函数
- source insight 4.0 无法同步文件问题
- 两种方式带你爬点你想要的东西
- c语言流感,维生素C能防流感?专家:或减轻普通感冒引起不适症状
- 插件安装失败_贴片保险丝额定电流应用电路为什么会安装失败?
- 待支付取件费用是什么意思_1元保管费与直接取件,你赞赏丰巢快递柜了吗?...