本教程操作环境：windows7系统、javascript1.8.5版、Dell G3电脑。 项目开发中，不管是建立在哪个框架基础上，对数据的处理都是必须的，而处理数据离不开各种遍历循环。javascript中循环遍历有很多种方式，记录下几种常见的js循环遍历。 一、for循环 for 语句主要用于执行确定执行次数的循环。 for 语句的基本语法如下： for([初始值表达式]；[条件表达式]；[增量表达式]){
循环体语句；
}说明：
上述 3 个表达式中的任意一个都可以省略，但需要注意的是，for() 中的;不可以省略。所以如果 3 个表达式都省略时，for 语句变为：for(;;){循环体语句}。此时需要注意的是，如果循环体内没有退出循环的语句，将会进入死循环。 示例： var sum = 0;
for(var i = 1; i <= 100;i++){ //在for语句中使用var声明循环变量，使代码更简洁
sum += i;
}
alert("1～100的累加和sum=" + sum);二、for...in for...in循环主要针对于对象的遍历，当想要获取对象的对应键值时，使用for...in还是比较方便的 var a = [1, 2, ,,,,,,true,,,,,,, "a",,,,,,,,,,,,,,,4,,,,,56,,,,,,"b"]; //定义数组
var b = [], num = 0;
for (var i = 0; i < a.length; i ++) { //遍历数组
if (typeof a[i] == "number") //如果为数字，则返回该元素的值
b.push(a[i]);
num ++; //计数器
}
console.log(num); //返回42，说明循环了42次
console.log(b); //返回[1,2,4,56]三、while循环 while 语句是最常用的一种循环语句，在程序中常用于只需根据条件执行循环而不需关心循环次数的情况。 while 语句的基本语法如下：
while(条件表达式){
循环体;
}说明：
while 语句在执行时，首先判断条件表达式的值，如果为真，则执行循环体语句，然后再对条件表达式进行判断，如果值还是为真，则继续执行循环体语句；否则执行 while 语句后面的语句。如果表达式的值在第一次判断就为假（为 false 或 0 或为 null 等值），则一次也不会执行循环体。 需要注意的是，为了使 while 循环能正常结束，循环体内应该有修改循环条件的语句或其他终止循环的语句，否则 while 循环将进入死循环，即会一直循环不断地执行循环体。 例如，下面的循环语句就会造成死循环。 var i=1,s=0;
whiel(i<=5){
s+=i;
}上述代码中 i 的初始值为 1，由于循环体内没有修改 i 变量的值，所以表达式 i<=5 永远为真，因而循环体会一直执行。 死循环会极大地占用系统资源，最终有可能导致系统崩溃，所以我们编程时一定要注意避免死循环。 var sum = 1, i = 1;
var ex = 1;
while(sum <= 1.5){
sum += 1/((i + 1)*(i + 1));
if(sum > 1.5)
break;
i++;
ex +=" + 1/(" + i + "*" + i + ")";
}
alert("表达式的值小于等于1.5时的i=" + i + "，对应的表达式为：" + ex);四、do…while循环 do…while 语句是 while 语句的变形。两者的区别在于，while 语句把循环条件判断放在循环体语句执行的前面，而 do…while 语句则把循环条件判断放在循环体语句执行的后面。 do…while 语句的基本语法如下： do{
循环体;
}while (条件表达式);“条件表达式”和“循环体”的含义与 while 语句的相同。在此需要注意的是，do…while 语句最后需要使用;结束，如果代码中没有加上;，则 JavaScript 会自动补上。 do…while 语句在执行时，首先执行循环体语句，然后再判断条件表达式的值，如果值为真（值为 true 或非 0 值），则再次执行循环体语句。do…while 语句至少会执行一次循环体，这一点和 while 语句有显著的不同。 var sum = 1, i = 1;
var ex = 1;
do{
sum += 1/((i + 1)*(i + 1));
if(sum > 1.5)
break;
i++;
ex +=" + 1/(" + i + "*" + i + ")";
}while(sum <= 1.5);
alert("表达式的值小于等于1.5时的i=" + i + "，对应的表达式为：" + ex);五、forEach forEach的使用方法和map使用方法差不多,只是forEach方法不返回值，只用来操作数据，且循环中途是无法停止的，总是会将所有成员遍历完 let arrObj = [{
id: 1,
name: 'xiaohua'
},{
id:2,
name: 'xiaomin'
},{
id:3,
name: 'xiaobai'
}]
arrObj.forEach((item,index,arr)=>{
console.log(arr) // arrObj
console.log(index) // 0 1 2
console.log(item.name) // xiaohua xiaomin xiaobai
})六、map map方法将数组的所有成员依次传入参数函数，然后把每一次的执行结果组成一个新数组返回。循环中途是无法停止的，总是会将所有成员遍历完 let arr = [1,2,3,4,5]
let arr2 = arr.map((n)=>{
return n+1
})
console.log(arr2) // [2,3,4,5,6]
console.log(arr) // [1,2,3,4,5]map方法接受一个函数作为参数。该函数调用时，map方法向它传入三个参数：当前成员、当前位置和数组本身。 let arrObj = [{
id: 1,
name: 'xiaohua'
},{
id:2,
name: 'xiaomin'
},{
id:3,
name: 'xiaobai'
}]
arrObj.map((item,index,arr)=>{
console.log(arr) // arrObj
console.log(index) // 0 1 2
console.log(item.name) // xiaohua xiaomin xiaobai
})七、filter过滤循环 filter方法用于过滤数组成员，满足条件的成员组成一个新数组返回。它的参数是一个函数，所有数组成员依次执行该函数，返回结果为true的成员组成一个新数组返回。该方法不会改变原数组。 let arrObj = [{
id: 1,
name: 'xiaohua'
},{
id:2,
name: 'xiaomin'
},{
id:3,
name: 'xiaobai'
}]
let arr2 = arrObj.filter((item,index,arr)=>{
return (item.name === 'xiaohua')
})
console.log(arr2) // [{id:1,name:'xiaohua}] ECMAScirpt5 中 Array 类中的 filter 方法使用目的是移除所有的 ”false“ 类型元素 ( let arr = [3, 4, 5, 2, 3, undefined, null, 0, ""]; let arrNew = arr.filter(Boolean); console.log(arrNew) // [3, 4, 5, 2, 3] Boolean 是一个函数，它会对遍历数组中的元素，并根据元素的真假类型，对应返回 true 或 false. 八、Object.keys遍历对象的属性
let obj = {name: 'xiaohua', sex: 'male', age: '28'}
console.log(Object.keys(obj))
// ["name", "sex", "age"]判断一个对象是否是空对象，可以用Object.keys(obj).length>0 【推荐学习：javascript高级教程】 |
javascript循环语句哪几种
推荐阅读
