JS实现遍历不规则多维数组的方法


Posted in Javascript onMarch 21, 2018

本文实例讲述了JS实现遍历不规则多维数组的方法。分享给大家供大家参考,具体如下:

直接进入正文:

我们有时候处理数据,可能会遇到一些不规则(无法预料的数据结构),那么拿到这种数据我们如何进行遍历操作呢?举个例子:

var data= {
    a: { one: 1, two: 2, three: {four:'2',five:'4'} },
    b: { six: 4, seven: 5, eight: 6 },
    c: { nine: 7, ten: 8}
}

比如上边的数据(实际情况是这个数据会有各种不可预料的变化),如果想遍历这种数据,用单纯的for in就无法遍历了。

其实这种数据遍历也简单,使用递归的方法,就可以完美的解决这个问题

代码如下:

function traverse(obj) {
    for (var a in obj) {
      if (typeof(obj[a]) == "object") {
        traverse(obj[a]); //递归遍历
      } else {
        console.log(a + "=" + obj[a]); //如果是值就显示
      }
    }
}
traverse(data)

最后我们只要调用这个方法,把obj传入,就成功的遍历了整个data

本例运行结果如下:

JS实现遍历不规则多维数组的方法

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
做网页的一些技巧
Feb 01 Javascript
Node.js入门教程:在windows和Linux上安装配置Node.js图文教程
Aug 14 Javascript
jQuery实现炫酷的鼠标轨迹特效
Feb 01 Javascript
网页收藏夹显示ICO图标(代码少)
Aug 04 Javascript
jQuery实现hover合成事件的方法
Aug 06 Javascript
JavaScript脚本判断蜘蛛来源的方法
Sep 22 Javascript
Node.js利用Net模块实现多人命令行聊天室的方法
Dec 23 Javascript
Bootstrap布局之栅格系统学习笔记
May 04 Javascript
Vue 过滤器filters及基本用法
Dec 26 Javascript
vue打包的时候自动将px转成rem的操作方法
Jun 20 Javascript
微信小程序-可移动菜单的实现过程详解
Jun 24 Javascript
vue实现简单图片上传
Jun 30 Javascript
vue项目关闭eslint校验
Mar 21 #Javascript
去掉vue 中的代码规范检测两种方法(Eslint验证)
Mar 21 #Javascript
使用Vue.js和Flask来构建一个单页的App的示例
Mar 21 #Javascript
JS代码实现电脑配置检测功能
Mar 21 #Javascript
vue2 mint-ui loadmore实现下拉刷新,上拉更多功能
Mar 21 #Javascript
javascript与PHP动态往类中添加方法对比
Mar 21 #Javascript
详解PHP后期静态绑定分析与应用
Mar 21 #Javascript
You might like
PHP排序之二维数组的按照字母排序实现代码
2011/08/13 PHP
php.ini save_handler 修改不生效的解决办法
2014/07/22 PHP
mysql_escape_string()函数用法分析
2016/04/25 PHP
laravel-admin 后台表格筛选设置默认的查询日期方法
2019/10/03 PHP
php 输出缓冲 Output Control用法实例详解
2020/03/03 PHP
JavaScript 事件记录使用说明
2009/10/20 Javascript
js 判断一个元素是否在页面中存在
2012/12/27 Javascript
JavaScript版TAB选项卡效果实例
2013/08/16 Javascript
jQuery.holdReady()使用方法
2014/05/20 Javascript
js 中将多个逗号替换为一个逗号的代码
2014/06/07 Javascript
JavaScript中统计Textarea字数并提示还能输入的字符
2014/06/10 Javascript
Javascript添加监听与删除监听用法详解
2014/12/19 Javascript
JavaScript事件类型中UI事件详解
2016/01/14 Javascript
全面解析JavaScript的Backbone.js框架中的Router路由
2016/05/05 Javascript
解决微信内置浏览器返回上一页强制刷新问题方法
2017/02/05 Javascript
Vue表单验证插件Vue Validator使用方法详解
2017/04/07 Javascript
JavaScript实现各种排序的代码详解
2017/08/28 Javascript
Vue2.0基于vue-cli+webpack同级组件之间的通信教程(推荐)
2017/09/14 Javascript
jQueryMobile之窗体长内容的缺陷与解决方法实例分析
2017/09/20 jQuery
Angular自定义组件实现数据双向数据绑定的实例
2017/12/11 Javascript
pace.js和NProgress.js两个加载进度插件的一点小总结
2018/01/31 Javascript
基于ts的动态接口数据配置的详解
2019/12/18 Javascript
js实现视图和数据双向绑定的方法分析
2020/02/05 Javascript
vue element 关闭当前tab 跳转到上一路由操作
2020/07/22 Javascript
python实现发送邮件功能代码
2017/12/14 Python
Python3爬虫学习之将爬取的信息保存到本地的方法详解
2018/12/12 Python
Django restframework 源码分析之认证详解
2019/02/22 Python
基于python及pytorch中乘法的使用详解
2019/12/27 Python
Python sklearn库实现PCA教程(以鸢尾花分类为例)
2020/02/24 Python
HTML5中的进度条progress元素简介及兼容性处理
2016/06/02 HTML / CSS
Unix里面如何在后台运行程序
2016/10/14 面试题
毕业生的自我鉴定
2013/10/29 职场文书
教育学专业实习生的自我鉴定
2013/11/26 职场文书
《李广射虎》教学反思
2014/04/27 职场文书
上党课的心得体会
2014/09/02 职场文书
HashMap实现保存两个key相同的数据
2021/06/30 Java/Android