基于ECMAScript5提供遍历数组的forEach方法仅能遍历一维数组,没有提供循环遍历多维数组的方法,所以实现如下遍历多维数组的each方法,以此遍历多维数组。

注意:此处新增了遍历空数组与对象的显示方式

//遍历多维数组方法实现
Array.prototype.each = function (fn) {
try {
//定义计数器
const ZERO = 0;
this.i = ZERO;
//判断数组非空且参数的构造器为函数
if (this.length > this.i && fn.constructor === Function) {
while (this.length > this.i) {
var item = this[this.i];
//如果当前元素是数组
if (item && item.constructor === Array) {
if (item.length > ZERO) {
item.each(fn);
} else {
//空数组显示"[]", 而非空白
fn.call(item, "[]");
}
} else {//当前元素非数组,此处扩展遍历对象,以键值对方式显示,而非[object Object]
if (item && typeof item === "object") {
//非空对象
if (Object.keys(item).length > ZERO) {
for (const key in item) {
fn.call(item, key + " : " + item[key]);
}
} else {
//空对象
fn.call(item, "{}");
}
} else {//其余元素,包括对象类型的null
fn.call(item, item);
}
}
this.i++;
}
//销毁计数器,回收内存
delete this.i;
}
} catch (e) {
console.log("error happened in printing multiple-dimension array. error message : " + e);
throw e;
}
return this;
};
var array = ["中国", "Charles", 0, ["A", "B", "C"], ["D", ["E", "F"], "G"], {
name: "ITACHI",
gander: "Male"
}, [], null, undefined, false];
//遍历多维数组
array.each(function (item) {
alert(item);
}); //遍历一维数组
/*array.forEach(function (item, index, arr) {
alert(item);
});*/

JavaScript 遍历多维数组的更多相关文章

  1. JavaScript利用数组原型,添加方法实现遍历多维数组每一个元素

    原型就是提供给我们为了让我们扩展更多功能的. 今天学习了用js模拟底层代码,实现数组多维的遍历.思想是在数组原型上添加一个方法. // js中的数组forEach方法,传入回掉函数 能够帮助我们遍历数 ...

  2. js递归遍历多维数组并在修改数组的key后返回新的多维数组

    我司最近正在用VUE做一个基于用户权限显示不同左侧菜单的后台管理系统,接口会根据用户的权限不同返回不同的菜单名称.URL等,前端要将这些菜单名称及URL动态添加到系统的左侧,这里就用到了vue-rou ...

  3. for里面是采用setInterval遍历二维数组,for循环到最后一个数的时候,才执行setInterval的问题解决

    点击播放看效果 <!doctype html> <html lang="en"> <head> <meta charset="U ...

  4. 同事问如何判断同花顺,我用javascript的二维数组写了个简易demo

    有个前同事在群里问如何判断是否为同花顺我用javascript的二维数组写了个简易demo. <!DOCTYPE html> <html> <body> <s ...

  5. C:指针遍历二维数组

    C 指针遍历二维数组 http://blog.csdn.net/lcxandsfy/article/details/55000033 C++ 字符串指针与字符串数组 https://www.cnblo ...

  6. javaScript遍历对象、数组总结(转载)

    javaScript遍历对象.数组总结  转载来源 https://www.cnblogs.com/chenyablog/p/6477866.html 在日常工作过程中,我们对于javaScript遍 ...

  7. C/C++遍历二维数组,列优先(column-major)比行优先(row-major)慢,why?

    C/C++遍历二维数组,列优先(column-major)比行优先(row-major)慢,why? 简单粗暴的答案:存在Cache机制! 稍微啰嗦一点:CPU访问内存(读/写,遍历数组的话主要是读) ...

  8. JavaScript 遍历对象、数组总结

    在日常工作过程中,我们对于javaScript遍历对象.数组的操作是十分的频繁的,今天抽空把经常用到的方法小结一下,方便今后参考使用!   javaScript遍历对象总结     1.使用Objec ...

  9. php中遍历二维数组并以表格的形式输出

    一.索引数组 <?php //使用array()语句结构将联系人列表中所有数据声明为一个二维数组,默认下标是顺序数字索引 $contact1 = array( //定义外层数组 array(1, ...

随机推荐

  1. node.js之第一天

    一.http模块 //require表示引包,引包就是引用自己的一个特殊功能 var http = require("http"); //创建服务器,参数是一个回调函数,表示如果有 ...

  2. day1-Python入门

    百度云有关文档资料链接 链接:https://pan.baidu.com/s/1pLighnX 密码:j69s

  3. 2.python的文件类型、变量数值和字符串练习

    1.python的文件类型 .源代码 -python 源代码文件以"py"为扩展名,由python程序解释,不需要编译. 2.字节代码(编译的) -python源码文件经编译后生成 ...

  4. spring,springmvc,mybatis基本整合(一)--xml文件配置方式(1)

    **这个整合.仅仅是最主要的整合,而且是xml配置文件的方式之中的一个,即当中的mybatis是採用非mapper接口的方式.(第二遍採用mapper接口方式.第三遍採用注解的方式:第四篇採用注解基于 ...

  5. RPC-client异步收发核心细节?

    通过上篇文章的介绍,知道了要实施微服务,首先要搞定RPC框架,RPC框架分为客户端部分与服务端部分. RPC-client的部分又分为: (1)序列化反序列化的部分(上图中的1.4) (2)发送字节流 ...

  6. 摧枯拉朽,说说ES6的三把火

    阅读目录 我是 Jser 我骄傲 作用域 模块系统 类(Class) 我是 Jser 我骄傲 JavaScript 如今可谓是屌丝逆袭高富帅的代名词哈,从当初闹着玩似的诞生到现在 Github 上力压 ...

  7. Python 项目实践二(生成数据)第一篇

    上面那个小游戏教程写不下去了,以后再写吧,今天学点新东西,了解的越多,发现python越强大啊! 数据可视化指的是通过可视化表示来探索数据,它与数据挖掘紧密相关,而数据挖掘指的是使用代码来探索数据集的 ...

  8. iOS ShareSDK 三方分享/登录使用

    原文 http://www.cnblogs.com/CoderAlex/p/4860352.html 一: 快速集成 1.前言 作为现在App里必不可少的用户分享需要,社交化分享显然是我们开发app里 ...

  9. ROS初探:(一)ROS架构

    一.ROS架构 ROS架构上分为三个层级: 计算图级(Computation Graph level):体现进程与系统的关系,描述系统怎么运行. 文件系统级(Filesystem level):组织构 ...

  10. C++ 头文件系列(list)

    简介 list实现的实际上是双向链表,所以叫它doubly-linked list也许更好. 因为实现的是双向链表,所以它有两个非常重要的性质: 双向 链表 双向 双向意味着----给定一个元素,我们 ...