1.for循环

 var
arr = [];
for (var i = 0; i < arr.length; i++) {
if (条件1)
return;
if (条件2)
break;
if (条件3)
continue;
};

js最常用的循环必然是for循环,最基础的用法,用于数组遍历,但是代码书写过多。

 var
arr = [];
Array.prototype.customFunc = function () { };
for (var item in arr) {
if (!arr.hasOwnProperty(item)) {
if (条件1)
return;
if (条件2)
break;
if (条件3)
continue;
}
};

var in的形式遍历用于遍历数组并不理想,这个遍历方式是遍历属性的,特殊情况下是可以使用,使用这种遍历方式会将数组本身的属性也遍历出来,比如我们在Array上扩展一个方法customFunc,此时遍遍历数组会将customFunc也遍历出来达不到预期效果,非要用怎么办,加一层判断利用hasOwnProperty方法将数组原型中的属性扣出去,这样遍历就不用担心前面的问题了。

2.ES5遍历方式

var
arr = [];
arr.forEach((item, index) => {
if (条件)
return;
})

forEach是ES5定义的一种遍历方式,这个方法用起来很方便,但是弊端是无法使用break,continue,也就是无法跳出一次循环,只能用return结束整个函数执行,这点就比较尴尬了,如果有跳出循环的逻辑还是用for循环吧。效率上for循环也高于forEach。

3.ES6遍历方式

 var
arr = [];
for (var item of arr) {
if (条件1)
return;
if (条件2)
break;
if (条件3)
continue;
}

ES6的for循环写法。这种方式非常好,弥补了for(var in)的弊端,也弥补了forEach的弊端。而且这种遍历方式还可以对String、Object等等进行遍历。

以上列举了一下常用的遍历方式,在这里mark一下。

关于js中遍历总结的更多相关文章

  1. JS中遍历EL表达式中后台传过来的Java集合

    前言:在我的项目里有这么一个情况,后台直接model.addAttribute()存储了一个对象,此对象内部有一个集合,前端JSP处理的方法正常情况下就是直接使用EL表达式即可.但是如果在JS中需要使 ...

  2. 【微信小程序】--小程序中循环遍历(包括js中遍历和wxml中的遍历)

    文章为博主原创,纯属个人见解,如有错误欢迎指出. 如需转载,请注明出处. 在js中遍历 for (var index in res.data.infos) { res.data.infos[index ...

  3. JS中遍历数组、对象的方式

    1.标准的for循环遍历数组 //不打印自定义属性和继承属性 var array = [1,2,3]; for (var i = 0; i < array.length; i++) { cons ...

  4. js中遍历对象的属性和值的方法

    鉴于循环目标是个对象,length是为undefined,用map等对数组的循环方法不行,对象就用此下方法 for(var key in _this.lists.medicines){ medicin ...

  5. js中遍历对象的属性和值

    今天想看一下js的数组遍历的内容,搜索到了一个关于对象遍历写好的函数,保留一下.以后好用. function allPrpos ( obj ) {   // 用来保存所有的属性名称和值   var p ...

  6. js中遍历出查询后的listmodel(下拉框系列)

    function selectclassname(){ $.ajax({ url:"queryschoolclasslists.action", async:false, data ...

  7. JS中遍历语法的比较

    for循环 JavaScript 提供多种遍历语法.最原始的写法就是for循环.(假设myArray是数组,下面同理) let arr = [1,2,3,4,5]; for (var index = ...

  8. JS中遍历对象属性的四种方法

    Object.keys().Object.values().Object.entries().for...in.Map (1)Object.keys(): let ex1 = {c1: 'white' ...

  9. js中遍历对象(5种)和遍历数组(6种)的方法总结(转载)

    一.遍历对象方法 1.for...in遍历输出的是对象自身的属性以及原型链上可枚举的属性(不含Symbol属性),原型链上的属性最后输出说明先遍历的是自身的可枚举属性,后遍历原型链上的 eg: var ...

随机推荐

  1. PHP开发学习门户第三版UI正式上线

    官网:http://www.phpthinking.com/ 论坛:http://bbs.phpthinking.com/ 迭代.迭代,似魔鬼的步伐.似魔鬼的步伐-- PHP开发学习门户第二版UI用了 ...

  2. mysql-5.7.12-winx64安装版配置、使用

    一.下载 http://dev.mysql.com/downloads/mysql/ 下载版本:Windows (x86,64-bit), ZIP Archive(mysql-5.7.12-winx6 ...

  3. JSP页面输出的几种方式:

    1. 内置九大对象之out         下载图片 2. <%= %> JSP输出表达式      JSP中出现大量脚本 3. response.getWriter()        n ...

  4. 【LeetCode】85. Maximal Rectangle

    Maximal Rectangle Given a 2D binary matrix filled with 0's and 1's, find the largest rectangle conta ...

  5. EMQ 学习---MQTT消息QoS

    MQTT发布消息QoS保证不是端到端的,是客户端与服务器之间的.订阅者收到MQTT消息的QoS级别,最终取决于发布消息的QoS和主题订阅的QoS. 客户端连接: 客户端完成TCP三次握手之后,还需要发 ...

  6. python--标准库 时间与日期 (time, datetime包)

    Python具有良好的时间和日期管理功能.实际上,计算机只会维护一个挂钟时间(wall clock time),这个时间是从某个固定时间起点到现在的时间间隔.时间起点的选择与计算机相关,但一台计算机的 ...

  7. 移动touch事件之一

    触摸事件分类: touchstart:当手指触摸屏幕时触发:即使已经有一个手指放在了屏幕上也会触发. touchmove:当手指在屏幕上滑动时连续的触发.在这个事件发生期间,调用preventDefa ...

  8. jQuery 效果 - slideToggle() 方法

    实例 通过使用滑动效果,在显示和隐藏状态之间切换 <p> 元素: $(".btn1").click(function(){ $("p").slide ...

  9. spring boot热部署pom.xml配置

    <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/20 ...

  10. 在windows中使用Navicat连接Linux虚拟机中的mysql数据库

    今天想用navicat远程连接虚拟机中的MySQL数据库,一直连不上,在网上搜索了一下,发现原因是MySQL对远程用户登陆的授权问题.这里说一下我的解决方法.(本人小白) 首先,我用navicat去远 ...