基于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. json数据导出excel

    最近做的一个项目涉及到把数据导出到excel里面,网上找来找去,最终找到两种办法,废话不多说了 第一种: 拿到表格的id就可以抓取表格的数据,导出到excel,这种方式简单粗暴,引入这两个插件即可. ...

  2. java 之 职责链模式(大话设计模式)

    目前很多OA办公自动化软件,加快了办公效率,简化流程.相信很多小伙伴都用过.笔者了解到的大多数办公软件底层实现流程大多数采用的都是Activity或者是JBPM框架. 今天笔者要说的也是类似于流程的一 ...

  3. js图片懒加载(滚动加载)是否生效

    一.什么是懒加载? 对未出现在视野范围内的图片先不进行加载,等到出现在视野范围才去加载. 二.为什么使用懒加载? 懒加载的主要目的是作为服务器前端的优化,减少请求数或延迟请求数. 理论性知识大家都有自 ...

  4. python用户管理系统

    学Python这么久了,第一次写一个这么多的代码(我承认只有300多行,重复的代码挺多的,我承认我确实垃圾),但是也挺不容易的 自定义函数+装饰器,每一个模块写的一个函数 很多地方能用装饰器(逻辑跟不 ...

  5. Oracle之PLSQL

    PL/SQL Developer是一个集成开发环境,专门开发面向Oracle数据库的应用.PL/SQL也是一种程序语言,叫做过程化SQL语言(Procedural Language/SQL)它是Ora ...

  6. XML文档读取-DOM

    DOM(Document Object Model),“文档对象模型”早期是为了解决不用浏览器间数据兼容问题提出的解决方案,现在已经是W3C组织推荐的处理可扩展标志语言的标准编程接口. W3C DOM ...

  7. 入门vue----(介绍)

    声明式渲染 Vue.js 的核心是一个允许采用简洁的模板语法来声明式的将数据渲染进 DOM 的系统: <div id="app"> {{ message }} < ...

  8. IEEE Trans 2007 Signal Recovery From Random Measurements via OMP

    看了一篇IEEE Trans上的关于CS图像重构的OMP算法的文章,大部分..看不懂,之前在看博客的时候对流程中的一些标号看不太懂,看完论文之后对流程有了一定的了解,所以在这里解释一下流程,其余的如果 ...

  9. 利用jquery.chained.remote实现多级级联

    多级级联一直是前端比较烦人的一个功能,本次用jquery的插件,chained.remote实现多级级联. 应用场景:至少有二个下拉框,下拉框的个数不定. 应用步骤: 1.引入js文件,当然这个插件需 ...

  10. 自学Python2.7-collections系列

    Python collections系列 Python拥有一些内置的数据类型,比如str, int, list, tuple, dict等, collections模块在这些内置数据类型的基础上,提供 ...