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 相关文章推荐
js定义对象或数组直接量时各浏览器对多余逗号的处理(json)
Mar 05 Javascript
javascript模块化是什么及其优缺点介绍
Sep 02 Javascript
jQuery实现鼠标移到元素上动态提示消息框效果
Oct 20 Javascript
基于jquery异步传输json数据格式实例代码
Nov 23 Javascript
jQuery搜索子元素的方法
Feb 10 Javascript
js获取字符串字节数方法小结
Jun 09 Javascript
深入理解在JS中通过四种设置事件处理程序的方法
Mar 02 Javascript
基于JavaScript实现百度搜索框效果
Jun 28 Javascript
ES6中数组array新增方法实例总结
Nov 07 Javascript
从setTimeout看js函数执行过程
Dec 19 Javascript
js中split()方法得到的数组长度问题
Jul 19 Javascript
vue项目中企业微信使用js-sdk时config和agentConfig配置方式详解
Dec 15 Vue.js
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
印尼林东PWN黄金曼特宁咖啡豆:怎么冲世界上最醇厚的咖啡冲煮教程
2021/03/03 冲泡冲煮
PHP扩展模块Pecl、Pear以及Perl的区别
2014/04/09 PHP
PHP输出九九乘法表代码实例
2015/03/27 PHP
简单实用的PHP文本缓存类实例
2019/03/22 PHP
Laravel 实现Eloquent模型分组查询并返回每个分组的数量 groupBy()
2019/10/23 PHP
Tab页界面,用jQuery及Ajax技术实现
2009/09/21 Javascript
面向对象的javascript(笔记)
2009/10/06 Javascript
Javascript图片上传前的本地预览实例
2014/06/16 Javascript
JavaScript代码复用模式详解
2014/11/07 Javascript
安装使用Mongoose配合Node.js操作MongoDB的基础教程
2016/03/01 Javascript
JavaScript入门教程之引用类型
2016/05/04 Javascript
Javascript Function.prototype.bind详细分析
2016/12/29 Javascript
Javascript基础回顾之(一) 类型
2017/01/31 Javascript
ES6 系列之 WeakMap的使用示例
2018/08/06 Javascript
Nuxt.js之自动路由原理的实现方法
2018/11/21 Javascript
Quasar Input:type=&quot;number&quot; 去掉上下小箭头 实现加减按钮样式功能
2020/04/09 Javascript
JS表单验证插件之数据与逻辑分离操作实例分析【策略模式】
2020/05/01 Javascript
vue中路由跳转不计入history的操作
2020/09/21 Javascript
jQuery实现放大镜案例
2020/10/19 jQuery
Python常用小技巧总结
2015/06/01 Python
横向对比分析Python解析XML的四种方式
2016/03/30 Python
python求质数的3种方法
2018/09/28 Python
Python中实现单例模式的n种方式和原理
2018/11/14 Python
Python中的 enum 模块源码详析
2019/01/09 Python
利用python numpy+matplotlib绘制股票k线图的方法
2019/06/26 Python
python实现在函数图像上添加文字和标注的方法
2019/07/08 Python
python使用装饰器作日志处理的方法
2019/07/11 Python
django 取消csrf限制的实例
2020/03/13 Python
CSS3 新增选择器的实例
2019/11/13 HTML / CSS
美国一家著名的儿童鞋制造商:Stride Rite
2017/01/02 全球购物
一套Delphi的笔试题一
2016/02/14 面试题
自我评价个人范文
2013/12/16 职场文书
安全检查汇报材料
2014/12/26 职场文书
Redis读写分离搭建的完整步骤
2021/09/14 Redis
如何创建一个创建MySQL数据库中的datetime类型
2022/03/21 MySQL
oracle数据库去除重复数据
2022/05/20 Oracle