1、for循环

JS常见的循环,常用于循环数组、字符串之类

let arr = [1, 2, 3];
for (let i = 0; i < arr.length; i++) {console.log(i, arr[i])
}
// 0 1
// 1 2
// 2 3

2、while循环

也是JS常见的循环

arr = ["1", "2", "3", "4"];
var i = 0;
while (arr[i]) {console.log(arr[i] + "<br>")i++;
};

3、do while循环

此循环是while循环的一个变体,它首先执行一次操作,然后再进行条件判断,是true的话就继续执行操作,否则的话,循环结束

let i = 3;
do {console.log(i)i--;
}
while (i > 0)
// 3
// 2
// 1

4、forEach循环:对数组的每个元素执行一次给定的函数

forEach 循环在所有元素调用完毕之前是不能停止的,它没有 break 语句,如果你必须要停止,可以尝试 try catch 语句,就是在要强制退出的时候,抛出一个 error 给 catch 捕捉到,然后在 catch 里面 return,这样就能中止循环了,如果你经常用这个方法,最好自定义一个这样的 forEach 函数在你的库里。

(1)语法:

arr.forEach(callback(currentValue [, index [, array]])[, thisArg])

(2)参数:

callback: 为数组中的每个元素执行的函数,该函数接收1~3个参数

 currentValue :  数组中正在处理的当前元素index(可选) :数组中正在处理的当前元素的索引array(可选):forEach()方法正在操作的数组,即当前正在调用的数组

thisArg(可选): 当执行回调函数callback时,用作this的值

(3)返回值 :undefined

(4)forEach会改变原数组吗?

查看这篇博客

5、for in循环:以任意的顺序遍历一个对象的除Symbol以外的可枚举的属性

(1)语法:

for(variable in object)

(2)参数:

variable:    在每次迭代的时候,variable会被赋值为不同的属性名object:非Symbol类型的可枚举属性被迭代的对象

(3)注意:

for…in…不应该用于迭代于一个关注于索引顺序的Array,它是为遍历对象而构建的

6、for of 循环:for…of语句在可迭代的对象(包括Array,Map,set,String,TypedArray,arguments对象等等)上创建一个迭代循环,调用自定义迭代钩子,并为每个属性的值执行语句

0

(1)语法:

for (variable of iterable) {}

(2)参数:

variable: 在每次迭代中,将不同属性的值分配给变量iterable:被迭代枚举其属性的对象

(3)示例:

// 迭代Array
let iterable = [10,20,30]for(let value of iterable) {value += 1console.log(value);//11   21    31
}console.log(iterable); //[10,20,30]
//并不改变原数组//迭代String
let iterable = 'boo'for(let value of iterable) {console.log(value); // b o o
}console.log(iterable); //boo

(4)for…of 与 for…in的区别

它们之间的主要区别在于它们的迭代方式

for…in语句以任意顺序迭代对象的可枚举属性

for…of语句遍历可迭代对象定义要迭代的数据

7、map():方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值

(1)注意:

map()不会对空数组进行检测

map()不会改变原始数组

(2)语法:array.map(function(currentValue,index,arr), thisValue)

function(currentValue,index,arr):函数,数组中的每个元素都会执行这个函数函数参数:  currentValue:当前元素的值index:当前元素的索引值arr:当前元素属于的数组对象
thisValue:对象作为该回调时使用,传递给函数,用作"this"的值,如果省略了thisValue,或者传入null、undefined,那么回调函数的this为全局对象

(3)返回值

返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值

8、filter():创建一个新数组,其中包含通过所提供函数实现测试的所有元素

(1)语法:var newArray = arr.filter(callback(element[,index[,array]])[,thisArg])

callback:用来测试数组中的每个元素的函数;返回true表示该元素通过测试,保留该元素,false则不保留。他接受三个参数:element:数组中当前正在处理的元素。index:正在处理元素在数组中的索引array:调用了filter的数组本身
thisArg:执行callback时,用于this的值

(2)返回值:

一个新的、由通过测试的元素组成的数组,如果没有任何元素通过测试,则返回空数组

9、some():测试数组中是不是至少有一个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值

(1)注意:

如果用一个空数组进行测试,在任何情况下它返回的都是false

(2)语法:arr.some(callback(element[, index[, array]])[, thisArg])

callback:用来测试每个元素的函数,接受三个参数:element:数组中正在处理的元素index:数组中正在处理的元素的索引值array:some()被调用的数组thisArg:执行callback时使用的this值

(3)返回值:

数组中至少有一个元素通过回调函数的测试就会返回true,所有元素都没有通过回调函数的测试返回值才会为false

10、every():测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值

(1)注意:

若收到一个空数组,此方法在一切情况下都会返回true

(2)语法:arr.every(callback(element[, index[, array]])[, thisArg])

callback:用来测试每个元素的函数,它可以接收三个参数:element:用于测试当前值index:用于测试当前值的索引array:调用every的当前数组
thisArg:执行callback时使用的this值

(3)返回值

如果回调函数的每一次返回都为truthy值,返回true,否则返回false

11、reduce():对数组中的每个元素执行一个由你提供的reducer函数(升序执行),将其结果汇总为单个返回值

(1)语法:arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])

callback:执行数组中的每个值(如果没有提供initaValue)的函数,包含四个参数:accmulator:累计器累计回调的返回值;它是上一次调用回调时返回的累积值currentValue:数组中处理的元素index:数组中正在处理的当前元素的索引。如果提供了initialValue,则起始索引号为0,否则从索引1起始array:调用reduce()的数组

(2)返回值:

函数累计处理的结果

12、reduceRight():方法接受一个函数作为累加器和数组的每个值(从右到左)将其减少为单个值

(1)语法:arr.reduceRight(callback(accumulator, currentValue[, index[, array]])[, initialValue])

callback:一个回调函数,用于操作数组中的每个元素,它可接受四个参数:accumulator:累加器,上一次调用回调函数时,回调函数返回的值。首次调用回调函数时,如果initiaValue存在,累加器即为initiaValue,否则须为数组中的最后一个元素currentValue:当前元素,当前被处理的元素index:数组中当前被处理的元素的索引array:调用reduceRight()的数组
initialValue:首次调用 callback 函数时,累加器 accumulator 的值。如果未提供该初始值,则将使用数组中的最后一个元素,并跳过该元素。如果不给出初始值,则需保证数组不为空

(2)返回值:执行之后的返回值

JS中的12种循环遍历的方法相关推荐

  1. javascript中的12种循环遍历方法1

    1:for循环 let arr = [1,2,3]; for(let i =0;i<arr.length;i++){ console.log(i,arr[i]) } //for循环是js中最常用 ...

  2. JavaScript 中的常用12种循环遍历(数组或对象)的方法

    1.for 循环 1 2 3 4 5 6 7 let arr = [1,2,3]; for (let i=0; i<arr.length; i++){  console.log(i,arr[i] ...

  3. 在JS中利用for...in循环遍历对象

    for...in循环可以在js中遍历对象或者数组,比如当我们想要输出内容中的所有对象,就可以使用for...in循环 <script> //使用方法 for(键 in 对象)var obj ...

  4. JS中的几种循环和跳出方式

    JS中的循环是大家很常用的,这里总结一下几种常用循环的跳出方式. 1.for循环 var arr = ['q','w','e','r','t']; for(var i=0, len = arr.len ...

  5. js中的4种循环方式

    循环 for循环 双重for循环 while循环 do-while循环 for循环 语法结构 for(初始化变量; 条件表达式; 操作表达式 ){//循环体 } 名称 作用 初始化 变量 通常被用于初 ...

  6. jquery 遍历java对象_jquery中object对象循环遍历的方法

    一个朋友问对象如何转为数组,当我问他为啥要转得时候,他告诉我,数组可以用js循环遍历,而对象则不可以.其实呢,对象同样可以循环遍历的啊.不用转换也可以循环!说明你对js或者jquery的某些操作不是很 ...

  7. java 遍历对象_java中some(),every()循环遍历,Object.getOwnPropertyNames()遍历对象的属性...

    由于java知识的应用具有一定的广泛性,所以它经常会应用到我们的日常使用当中.那么今天就为大家介绍一下java中some(),every()循环遍历,Object.getOwnPropertyName ...

  8. MySQL存储过程中的3种循环

    MySQL存储过程中的3种循环 在MySQL存储过程的语句中有三个标准的循环方式:WHILE循环,LOOP循环以及REPEAT循环.还有一种非标准的循环方式:GOTO,不过这种循环方式最好别用,很容易 ...

  9. js中的4种函数调用模式:函数调用、方法调用、构造器调用、间接调用

    全栈工程师开发手册 (作者:栾鹏) js系列教程4-函数.函数参数教程全解 js中的4种函数调用模式 javascript一共有4种调用模式:函数调用模式.方法调用模式.构造器调用模式和间接调用模式. ...

最新文章

  1. jQuery 事件用法详解
  2. 53.连续分区分配vs分连续分区分配
  3. vtbl 什么时候被改写
  4. 单元测试01:nunit 安装与代码测试
  5. mysql数据库赋予权限 版本语法差异
  6. 条款6:明确拒绝编译器自动生成的函数
  7. ViT (Vision Transformer) ---- Transformer Model(1)
  8. LeetCode每日一题——只出现一次的数字 III
  9. eXtremeComponents 中文参考文档
  10. 【书摘】批判性思维工具
  11. Spring中的ref和depends-on区别
  12. 使用jQuery调色器farbtastic--触发change事件
  13. 19、网络配线架打线工艺
  14. 免费个人网站制作离不开参考
  15. 共词网络(共现网络)学习
  16. Nimbus 社区AMA-第6期
  17. 基于OpenGL的冰川与火鸟(光照计算模型、视景体、粒子系统)
  18. 微信开发者工具C盘占用大的问题
  19. 用Python分析许嵩的歌,带你追忆青春时的懵懂
  20. 这一次,Google 誓要扎根中国了!

热门文章

  1. 英文原著书籍下载和英语歌曲下载
  2. CUDA编程时遇到无法解析外部符号threadIdx或blockIdx问题的解决办法
  3. 微信客户端打开链接后显示已停止访问该网页怎么办
  4. Ie6 Ie7 常见 兼容问题解决方案
  5. OpenCV与OpenNSFW模型实现色情照片及视频检测
  6. NeurIPS2021-DualNet: Continual Learning, Fast and Slow
  7. 双极性SPWM、单极性SPWM和单极倍频SPWM的仿真结果对比
  8. 判断一个IP是否CN2线路的最简单方法
  9. 计算机专业中专自我鉴定范文,计算机专业中专生自我鉴定
  10. NVIDIA驱动安装教程