zoukankan      html  css  js  c++  java
  • JavaScript利用数组原型,添加方法实现遍历多维数组每一个元素

    原型就是提供给我们为了让我们扩展更多功能的。

    今天学习了用js模拟底层代码,实现数组多维的遍历。思想是在数组原型上添加一个方法。

     1 //  js中的数组forEach方法,传入回掉函数 能够帮助我们遍历数组
     2 var arr =[1,2,3,4,[1,2,[1,4]]];
     3 arr.forEach(
     4     function(item , index , arr){
     5         alert(item);    //1 2 3 4 1214
     6     }
     7 );
     8 //我们发现 这个方法只提供给我们遍历一维数组的功能
     9 
    10 //我们想自己实现一个能遍历多维数组的方法 那么就在原型里面添加方法
    11 // 原型的一个作用就是留给我们扩展对象的属性和方法的
    12 //我们为数组添加一个each方法能遍历多维数组 传入一个回掉函数
    13 Array.prototype.each = function( fn ){
    14     try{  //核心业务逻辑
    15         this.i||(this.i = 0); //定义一个计数器,如果存在就是原来 如果不存在初始化成0
    16         //当数组有长度并且传过来的是一个函数的时候我们就对数组执行回调
    17         if(this.length>0 && fn.constructor == Function){
    18             while(this.i < this.length){    //进行遍历
    19                 var e = this[this.i]; //取到当前元素
    20                 //如果取到的e元素是个数组,那就递归 一直到是一个元素的时候再执行回调
    21                 if(e && e.constructor == Array){
    22                     e.each(fn);
    23                 }else{
    24                     //进入这里说明 e元素是单个元素
    25                     //我们为e元素绑定方法,相当于e调用了fn方法
    26                     //fn.apply(e,[e]); 或者
    27                     fn.call(e,e);
    28                 }
    29                 this.i++;
    30             }
    31         }
    32         this.i = null;    //进行垃圾回收 删除引用标记
    33     }catch(ex){
    34         //do something
    35     }            
    36 };
    37 
    38 //调用我们自己的方法
    39 arr.each(
    40     function(item){
    41         alert(item);    
    42     }
    43 );    //1 2 3 4 1 2 1 4  这里实现了遍历多维数组
  • 相关阅读:
    Android 按键消息处理Android 按键消息处理
    objcopy
    SQLite多线程读写实践及常见问题总结
    android动画坐标定义
    Android动画效果translate、scale、alpha、rotate
    Android公共库(缓存 下拉ListView 下载管理Pro 静默安装 root运行 Java公共类)
    Flatten Binary Tree to Linked List
    Distinct Subsequences
    Populating Next Right Pointers in Each Node II
    Populating Next Right Pointers in Each Node
  • 原文地址:https://www.cnblogs.com/Lin-Yi/p/7439783.html
Copyright © 2011-2022 走看看