JS遍历数组和对象的区别及递归遍历对象、数组、属性的方法详解


Posted in Javascript onJune 14, 2016

废话不多说了,直奔主题,你,具体代码如下所示:

<script>
 //----------------for用来遍历数组对象--
 var i,myArr = [1,2,3];
 for (var i = 0; i < myArr.length; i++) {
  console.log(i+":"+myArr[i]);
 };
 //---------for-in 用来遍历非数组对象
 var man ={hands:2,legs:2,heads:1};
 //为所有的对象添加clone方法,即给内置原型(object,Array,function)增加原型属性,该方法很强大,也很危险
 if(typeof Object.prototype.clone ==="undefined"){
  Object.prototype.clone = function(){}; 
 }
 //
 for(var i in man){
  if (man.hasOwnProperty(i)) { //filter,只输出man的私有属性
   console.log(i,":",man[i]);
  };
 }
 //输出结果为print hands:2,legs:2,heads:1
 for(var i in man) {//不使用过滤
  console.log(i,":",man[i]);
 } 
 //输出结果为
 //hands : 2 index.html:20
 //legs : 2 index.html:20
 //heads : 1 index.html:20
 //clone : function (){} 
 for(var i in man) {
  if(Object.prototype.hasOwnProperty.call(man,i)) { //过滤
   console.log(i,":",man[i]);
  }
 } //输出结果为print hands:2,legs:2,heads:1 </script>

接下来给大家介绍js 递归遍历对象、数组、属性

在前端工作时,有时我们需要遍历一些未知类型的对象。代码如下:

//js遍历对象
function TraversalObject(obj)
{
    for (var a in obj) {
        if (typeof (obj[a]) == "object") {
            TraversalObject(obj[a]); //递归遍历
        }
        else {
            alert(a + "=" + obj[a]);//值就显示
        }
    }
}

//遍历对象中所有Ur的值
function TraversalObject(obj)
{
    for (var a in obj) {

        if(a=="Url")    alert(obj[a]);/ /显示URL的值
        if (typeof (obj[a]) == "object") {
            TraversalObject(obj[a]); //递归遍历
        }
    }
}

这种遍历方法在对象不规则但需要获取相同属性时起到非常好的作用。

Javascript 相关文章推荐
如何让DIV可编辑、可拖动示例代码
Sep 18 Javascript
jQuery ui 利用 datepicker插件实现开始日期(minDate)和结束日期(maxDate)
May 22 Javascript
一个简单的全屏图片上下打开显示网页效果示例
Jul 08 Javascript
Jquery简单分页实现方法
Jul 24 Javascript
通用无限极下拉菜单的实现代码
May 31 Javascript
利用Vue.js指令实现全选功能
Sep 08 Javascript
JS数组返回去重后数据的方法解析
Jan 03 Javascript
JavaScript与JQUERY获取元素的宽、高和位置
Feb 26 Javascript
基于Vue的ajax公共方法(详解)
Jan 20 Javascript
vue结合Echarts实现点击高亮效果的示例
Mar 17 Javascript
浅谈vue父子组件怎么传值
Jul 21 Javascript
微信小程序使用npm支持踩坑
Nov 07 Javascript
JS递归遍历对象获得Value值方法技巧
Jun 14 #Javascript
全面解析JavaScript中的valueOf与toString方法(推荐)
Jun 14 #Javascript
JavaScript函数中关于valueOf和toString的理解
Jun 14 #Javascript
Jquery基础之事件操作详解
Jun 14 #Javascript
好好了解一下Cookie(强烈推荐)
Jun 14 #Javascript
巧方法 JavaScript获取超链接的绝对URL地址
Jun 14 #Javascript
使用js获取地址栏参数的方法推荐(超级简单)
Jun 14 #Javascript
You might like
php实现多张图片上传加水印技巧
2013/04/18 PHP
PHP图片库imagemagick安装方法
2014/09/23 PHP
简单谈谈PHP中strlen 函数
2016/02/27 PHP
php while循环控制的简单实例
2016/05/30 PHP
php获取远程图片并下载保存到本地的方法分析
2016/10/08 PHP
php strftime函数的详细用法
2018/06/21 PHP
实现laravel 插入操作日志到数据库的方法
2019/10/11 PHP
下载网站打开页面后间隔多少时间才显示下载链接地址的代码
2010/04/25 Javascript
浅谈javascript六种数据类型以及特殊注意点
2013/12/20 Javascript
关于js里的this关键字的理解
2015/08/17 Javascript
Javascript操作表单实例讲解(下)
2016/06/20 Javascript
Vue Transition实现类原生组件跳转过渡动画的示例
2017/08/19 Javascript
layer弹出层扩展主题的方法
2019/09/11 Javascript
package.json中homepage属性的作用详解
2020/03/11 Javascript
python刷投票的脚本实现代码
2014/11/08 Python
python实现带验证码网站的自动登陆实现代码
2015/01/12 Python
详解使用 pyenv 管理多个版本 python 环境
2017/10/19 Python
Linux下安装python3.6和第三方库的教程详解
2018/11/09 Python
使用coverage统计python web项目代码覆盖率的方法详解
2019/08/05 Python
opencv-python 读取图像并转换颜色空间实例
2019/12/09 Python
python 列表、字典和集合的添加和删除操作
2019/12/16 Python
Tensorflow的梯度异步更新示例
2020/01/23 Python
Django实现后台上传并显示图片功能
2020/05/29 Python
从Pytorch模型pth文件中读取参数成numpy矩阵的操作
2021/03/04 Python
Dr. Martens马汀博士德国官网:马丁靴鼻祖
2019/12/26 全球购物
哥伦比亚加拿大官网:Columbia Sportswear Canada
2020/09/07 全球购物
船舶工程技术专业求职信
2014/08/07 职场文书
工伤事故证明
2014/10/20 职场文书
大学生国家助学金感谢信
2015/01/23 职场文书
大学生求职自荐信
2015/03/24 职场文书
2019奶茶店创业计划书范本,值得你借鉴
2019/08/14 职场文书
《狼牙山五壮士》读后感:宁死不屈,视死如归
2019/08/16 职场文书
nginx配置ssl实现https的方法示例
2021/03/31 Servers
PHP 技巧 * SVG 保存为图片(分享图生成)
2021/04/02 PHP
雄兵连:第三季先行图公开,天使恶魔联合,银河之力的新力量
2021/06/11 国漫
java解析XML详解
2021/07/09 Java/Android