js---15,模拟数组的ecah方法

更新时间：2022-09-21 18:48:55

原型的另外一个作用就是扩展对象中的属性和方法的

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Untitled Document</title>
        <script type=text/javascript charset=utf-8>
        //原型的另外一个作用就是扩展对象中的属性和方法的

        // Array each方法
        // ECMA5 forEach 循环遍历数组的每一项(只适合遍历一维数组)
        var arr = [1,2,3,4,5];
        arr.forEach(function(item , index , array){
            alert(item);
        });
        // 自己实现一个Array each方法 能遍历多维数组 
        var arr = [1,2,3,[4,[5,[6]]]]; // arr.length
        
        Array.prototype.each = function(fn){//给数组的prototype增加一个静态方法，原型和数组对象可以用。prototype用来扩充所有对象的方法。
            try{
                //遍历数组的每一项 ，记录当前遍历的元素位置
                this.i || (this.i=0);  //局部临时变量***加在对象上，不要写var i = 0;给数组加一个属性，this.i存在就用i不存在就是0，加一个属性并赋值，
                //数组长度大于0  && 传递的参数必须为函数
                if(this.length >0 && fn.constructor == Function){
                    while(this.i < this.length){    //不要for in循环，底层循环很多用for循环和while循环，索引不能到长度
                        var e = this[this.i];
                        //如果当前元素是一个数组（多维数组）
                        if(e && e.constructor == Array){//是一个数组的时候，通过constructor判断变量的类型，
                            //递归
                            e.each(fn);
                        } else {
                            //如果不是数组 （那就是一个单个元素）
                            //fn.apply(e,[e]);
                            fn.call(e,e);//fn(e)也可以，也可以fn.call(null,e);回调函数就是函数去执行数组的每一个元素。
                        }
                        this.i++ ;
                    }
                    this.i = null ; // while循环完了i就没用了，释放内存，垃圾回收机制回收变量
                }
                
            } catch(ex){
                // do something 
            }
            return this ;//谁将要调用这个方法，this就指向谁，现在是arr调用这个方法。
        }
        
        arr.each(function(item){//先去对象中找方法，然后去原型中找方法，
            alert(item);
        });
        </script>
    </head>
    <body>
    </body>
</html>

本文转自农夫山泉别墅博客园博客，原文链接：http://www.cnblogs.com/yaowen/p/6868090.html，如需转载请自行联系原作者

上一篇 : ：flutter - 如何在Dart/Flutter中将某些元素从一个Map复制到新Map中？下一篇 : Android LruCache 压缩图片有效避免程序OOM

js---15,模拟数组的ecah方法

相关阅读

推荐文章