锐客网

  1. 首页 > 睿知 > it技术 > >

javascript|比较for、for...in、for...of、forEach的区别

javascript前端开发语言

前言
在比较之前我们先了解两个概念：
迭代（iterate），指的是按照某种顺序反复多次执行一段程序，通常会有明确的终止条件。
遍历（traversal），指的是按照一定的规则访问树形结构中的每个节点，而且每个节点都只访问一次。
一、for循环语句
for循环语句在之前的博客里有较为详细的介绍，简单来说for语句是一种先测试循环语句，（即先检测退出条件，再执行循环体内的代码.)
1、语法：

for（初始化变量; 条件表达式; 操作表达式）{ 循环体语句 }

(1)三个表达式都可以省略,但是表达式之间的分号不能省略。都省略的话就创建了一个无穷循环。
(2)初始化变量：给循环变量、其他变量进行初始化。
(3)条件表达式：控制循环体语句是否执行。如果只包含条件表达式for循环就变成while循环。 (4)操作表达式：使循环趋向结束的语句。
2、使用方法： 2.1、for循环可以用于遍历数组
var arr = [33,22,44,55,66] for (let i = 0; i < arr.length; i++) { console.log(arr[i]); }

2.2、可以使用break，continue语句跳出循环。
var arr = ['a','b','c','d','e'] for (let i = 0; i < 10; i++) { if(i===5){ console.log('跳过索引为1的元素'); continue; } console.log('');

> var n = parseInt(prompt('请输入一个数')) //var flag = true; //标记变量，标记当前n是否位素数 var sum = 0 for(i=2; i=n){ alert(n+'是素数') }else{ alert(n+'不是素数') }

二、for…in语句
for-in类似于增强for循环，我们可以简单理解为它适合遍历对象。应用场景:遍历数组以及遍历对象的属性。
1、语法
for(var 变量in数组名或集合名)//变量中存放的数组或集合的索引 { 数组名[变量] }

2、使用方法：
let arr = { name : '关羽', sex:'男', yrs:'33', sleep:function(){}, eat :function(){} } for(attr in arr){//遍历arr对象的所有属性 console.log(attr) }

三、for…of语句
for…of语句是一种严格的迭代语句，用于遍历可迭代对象的元素。
1、语法
for(var 变量 of 数组名或集合名) //变量中存放的是数组或集合中的元素 { console.log(变量); }

2、使用方法：
let arr1=[12,22,32,42,52] let m= arr1.keys() for(m1 of m){//遍历数组对象中的所有元素 console.log(m1)}

四、forEach语句
foreach 语句是对数组的每个元素执行一次提供的函数。是for语句的特殊简化版本，不能完全取代for语句，但任何foreach语句都可以改写为for语句版本。
1、语法
arr.forEach(function(k){//依次从数组中取出元素放在k中,然后将k作为参数传递给函数 console.log(k); })

2、使用方法：
let arr = [123,456,789,269,258] for(i=0; i

五、比较
1、优缺点 for:
优点：程序简洁，结构清晰，循环初始化，循环变量化和循环条件位置突出。
缺点：结构比while循环复杂，容易出编码错误。
for…in:
优点：避免了for in的所有缺点，可以使用break,continue和return，不仅支持数组的遍历，还可以遍历类似数组的对象，支持字符串的遍历最简洁。
缺点：不适用于处理原有的原生对象。
for…of:
优点：避免了for…in的所有缺点，支持break,continue,return。支持遍历map，object,array,set string等。
缺点：不适用于处理原有的原生对象。
forEach:
优点：便利的时候更加简洁，效率和for循环相同，不用关心集合下标的问题，减少了出错的效率
缺点：不能同时遍历多个集合，在遍历的时候无法修改和删除集合数据，方法不能使用break，continue语句跳出循环，或者使用return从函数体返回，对于空数组不会执行回调函数
2、区别 四个算法语句区别主要体现在响应break, continue, return上和使用的对象上。
for 语句性能最好；能响应break, continue, return控制循环。
forEach 无法响应break, continue, return控制循环。
for in 无法响应break, continue, return控制循环；for in 主要针对对象，它不仅会循环对象本身的属性，还会查找循环原型上的属性；循环的顺序不确定。
【javascript|比较for、for...in、for...of、forEach的区别】for of 能响应break, continue, return控制循环，还能遍历map、set 等类数组，但是不能循环普通的对象

    推荐阅读


    上一篇：java|程序、进程、线程、协程以及单线程、多线程基本概念

    下一篇：ajax|Ajax跨域和同源的问题