JavaScript里面的循环方法小结
一,原生JavaScript中的循环:
for 循环代码块一定的次数,它有三个参数,来决定代码块的循环次数,第一个是初始值,第二个是终止值,第三个参数是变化规则:
//for循环
for(var i = 0, len = jsonArr.length; i < len; i++) {
console.log(JSON.stringify(jsonArr[i]));
}
for in循环一般用于遍历对象的属性,它有两个参数,in之前为属性名参数,in之后为要遍历的对象,它会遍历对象中的每一个属性,key即为属性名,对象【属性名】则输出属性值:
for(var key in jsonObj) {
console.log(key + ':' + jsonObj[key]);
}
注意:这里的key是字符串,而不是真正的索引,for in是为普通对象设计的循环,可以遍历得到字符串类型的键,如果用它来遍历数组则不方便。
forEach循环
jsonArr.forEach(function(value,index,array){
console.log('********************');
console.log(value);
console.log(index);
console.log(array);
});
这是输出结果,可以看到,value是数组元素值,index为当前值得索引,array则为当前所遍历的数组对象。

for of循环
var jsonArr = [{
'one': '1'
},
{
'two': '2'
},
{
'three': '3'
}
];
//for of循环
for(var value of jsonArr) {
console.log(value);
}

将输出数组的每一项的值。
for-of循环除了可以遍历数组,也可以遍历其它的集合。比如,大多数类数组对象,例如DOM NodeList对象。
var nodeLis = document.getElementById('ul').childNodes;
//for of循环
for(var value of nodeLis) {
console.log(value);
}

for-of循环也支持字符串遍历,它将字符串视为一系列的Unicode字符来进行遍历:
var str = 'i am little sun';
for(var value of str) {
console.log(value);
}

while和do while循环:
var i=0
while(i<5){
console.log(i);
i++;
}
do{
console.log(i);
i++;
}while(i<5)
二者的区别是,do while无论条件满足与否都会至少执行一次。
二,jQuery中专有的循环:
$.each()用于遍历数组和对象:
遍历数组:
var arr1 = [0, 1, 2, 3, 4];
var arr2 = $('ul li');
$.each(arr1, function(index,value) {
console.log(index)
console.log(value)
});
遍历对象:
$.each(jsonObj, function(key, val) {
alert(jsonObj[key]);
});
$().each()用于遍历jQuery中的节点对象:$(selector).each(function(index,element))
$( $('ul li')).each(function(index,value){
console.log(index)
console.log(value)
});
部分文章中有提到,$.().each()主要用于处理dom,在测试中发现其实两者都可以同样的用于处理dom,似乎没有什么大的区别。
JavaScript里面的循环方法小结的更多相关文章
- JavaScript里的循环方法总结
JavaScript诞生已经有20多年了,我们一直使用的用来循环一个数组的方法是这样的: for (var index = 0; index < myArray.length; index++) ...
- JavaScript里的循环方法之forEach,for-in,for-of
JavaScript一种直译式脚本语言,是一种动态类型.弱类型.基于原型的语言,内置支持类型.它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标 ...
- JavaScript里的循环方法:forEach,for-in,for-of
JavaScript诞生已经有20多年了,我们一直使用的用来循环一个数组的方法是这样的: for (var index = 0; index < myArray.length; index++) ...
- C#后台调用前台javascript的五种方法小结
第一种,OnClientClick (vs2003不支持这个方法) <asp:Button ID="Button1" runat="server" Tex ...
- JavaScript Array对象sort() 方法小结
sort() 方法用于对数组的元素进行排序. 语法arrayObject.sort(sortfunction) 参数sortfunction 可选.规定排序顺序.必须是函数. 返回值对数组的引用.请注 ...
- javaScript 删除确认实现方法小结
第一种: <a href="javascript:if(confirm('确认删除吗?'))window.location='del.php'">删除</a> ...
- Javascript/jQuery关于JSON或数组集合的几种循环方法
JavaScript遍历JSON或数组集合: /** * 根据json数据生成option树形控件 * 如果有children节点则自动生成树形数据 * @param {JSON} data * @p ...
- javascript 终极循环方法for... of ..推荐
js目前有很多的循环方法,如for, forEach, for .. in, for of 等等,而在ES6里面,我们又增加了一些数据结构,比如set,map,Symbol等. 那么我们该选取哪一 ...
- JavaScript基础——实现循环
循环是多次执行同一段代码的一种手段.当你需要在一个数组或对象集上重复执行相同的任务时,这是非常有用的. JavaScript提供执行for和while循环的功能. 1.while循环 JavaScri ...
随机推荐
- SpriteBuilder改变布局后App运行出错代码排查
原来整个关卡场景放在GameScene.ccb中,后来觉得移到专门的Level.ccb比较好. 移动过后编译运行,只要移动Player的胳膊发射子弹时,Xcode报错: g due to Chipmu ...
- jquery跳出当前的each循环的方式
jquery跳出当前的each循环,使用如下方式: return false;--跳出所有循环:相当于 javascript 中的 break 效果. return true;--跳出当前循环,进入下 ...
- Ext JS 5初探(二) ——Bootstrap.js
在Bootstrap.js文件中,总共有1500行(包含注释和空行),使用编辑器的代码折叠功能就如下图可以一窥全貌了. 从代码可以看到,这里主要定义了Ext.Boot.Ext.globalEval.E ...
- Java之美[从菜鸟到高手演变]之设计模式三
本章是关于设计模式的最后一讲,会讲到第三种设计模式--行为型模式,共11种:策略模式.模板方法模式.观察者模式.迭代子模式.责任链模式.命令模式.备忘录模式.状态模式.访问者模式.中介者模式.解释器模 ...
- java缓存系统
第一版 package cache; import java.util.HashMap; import java.util.Map; public class Cache1 { private Map ...
- Oracle Applications DBA 基础(一)
1.引子 2014年9月13日 20:33 <oracle Applications DBA 基础>介绍Oracle Applications R12的系统架构, 数据库后台及应用系统的基 ...
- 【一天一道LeetCode】 #3 Longest Substring Without Repeating Characters
一天一道LeetCode (一)题目 Given a string, find the length of the longest substring without repeating charac ...
- TCP的核心系列 — SACK和DSACK的实现(二)
和18版本相比,37版本的SACK和DSACK的实现做了很多改进,最明显的就是需要遍历的次数少了, 减少了CPU的消耗.37版的性能提升了,代码有大幅度的改动,逻辑也更加复杂了. 本文主要内容:37版 ...
- /etc/fstab文件分析(第二版)
/etc/fstab文件分析 前面说新建的分区在系统重启之后就会失效,要想永久生效,需要将其写入/etc/fstab文件 一./etc/fstab文件格式:6个组成部分 物理分区名/卷标 挂载点 文件 ...
- LeetCode之“动态规划”:Climbing Stairs
题目链接 题目要求 You are climbing a stair case. It takes n steps to reach to the top. Each time you can eit ...