• javascript中数组进阶---数组方法的重构


           关于数组方法的重构,我认为最重要的是会用这些方法,只有知道要实现什么功能,才能开始去写。而且,这些方法的功能知道的

    越是详细,重构的也就越标准,考虑到的问题就越多,最后趋于完美。

          数组方法的使用,我前面几篇关于数组的讲得很清楚,想了解的同学可以看看。

       下面代码中,我认为比较难理解的地方,基本都添加了注释,不甚理解的可以看看。

          好了,不多说,看下面代码。

    1.concat的重构

            var arr=[1,2,3,4,5,6,7,8,9];
       
            function concat1(array){
                var arr1=[];
                if(!array || !Array.isArray(array)) return arr1;  //判断传参数组存在或者不是数组
                for(var i=0;i<array.length;i++){
                    arr1.push(array[i]);
                }               //遍历传参数组,复制到新数组中,由于形参只有一个,所以这里不涉及后面的实参
                if(arguments.length===1) return arr1;   //判断实参的个数
                for(var j=1;j<arguments.length;j++){    //遍历通过形参传入参数的后面的实参
                    if(Array.isArray(arguments[j])){      //如果岑仔数组,遍历,复制,同上面
                        for(var l=0;l<arguments[j].length;l++){
                            arr1.push(arguments[j][l]);
                        }
                    }else{
                        arr1.push(arguments[j]);   //如果没有数组,直接复制。
                    }                                               
                }
                return arr1;   //最后要返回新数组
            }
            var s=concat1(arr,4,1,6,[7,89,95]);  
            console.log(s);       //  [1, 2, 3, 4, 5, 6, 7, 8, 9, 4, 1, 6, 7, 89, 95]

    2.join的重构

            function join1(array,seprator){
                   var str="";
                   if(!array || !Array.isArray(array)) return str;
                   if(seprator===undefined)  seprator=",";   //没有输入分隔符,默认为逗号
                   seprator=String(seprator);     //分隔符转换为字符串
                   for(var i=0;i<array.length;i++){      //遍历数组
                       if(i===array.length-1){       //判断是否是最后一个元素
                           str+=array[i];       //最后一个元素后面没有分隔符
                       }else{
                        str+=array[i]+seprator;
                       } 
                   }
                   return str;   //返回字符串
               }
    
               var s=join1(arr,"+");
               console.log(s);

    3.forEach 的重构

     function forEach1(array,fn){
                if(!array || !Array.isArray(array))  console.error("forEach1 is not  function");
                for(var i=0;i<array.length;i++){
                    fn(array[i],i,array);      //  遍历传入的数组,把数组的元素、下标、数组传入回调函数
                }            //不返回任何东西
             }
            var s=forEach1(arr,function(item,index,array){
                console.log(item)
            })

    4.map 的重构

            function map1(array,fn){
                if(!array || !Array.isArray(array))  console.error("forEach1 is not  function");
                var arr1=[];
                for(var i=0;i<array.length;i++){
                    if(array[i]===undefined)   continue;   //遍历过程中遇到undefined,跳出去这一次循环,后面继续,所以用continue;
                    arr1[i]=fn(array[i],i,array);//新数组的元素是回调函数中返回的结果
                }
                for(var j=0;j<arr1.length;j++){
                    return   arr1[j]===undefined? undefined : arr1;   
                }  //如果新数组元素之undefined,返回undefined,如果不是,返回新数组   
            }
            var s=map1(arr,function(item,index,array){
                return item*2;
            })
            console.log(s)

    5.some 的重构

    function some1(array,fn){
                if(!array || !Array.isArray(array)) console.error("some1 is not function");
                for(var i=0;i<array.length-1;i++){
                    if(array[i]===undefined)  continue;
                    if(fn(array[i],i,array)) return true;   //如果回调函数返回的是true,则最后返回true  
                }
                return false;    //如果回调函数返回的是false,则最后返回false  
    }
    var s=some1(arr,function(item,index,array){
    return (item%2===0);
    })
    console.log(s)

    6.filter的重构

            function filter1(array,fn){
                var arr1=[];
                for (var i=0;i<array.length;i++){
                    if(array[i]===undefined)   continue;
                    if(fn(array[i],i,array))  arr1.push(array[i]);  //如果这里用arr1[i]=array[i];  结果是[empty,2,empty,4......]
                }            //这是因为回调函数返回的是false true  false  true...,这样arr1的奇数位就是empty,但是用push,arr的奇数位就不会被复制。
                return arr1;     //这个注释可以用来区分map和filter的区别,map返回的是运算结果,所以用  arr1=
            }
    
            var s=filter1(arr,function(item,index,array){
                return item%2===0;
            })
            console.log(s)

    7.reduce 的重构

    function reduce1(array,fn,initValue){
                var i=0;
                if(initValue===undefined){
                    i=1;
                    initValue=array[0];
                }
                for(;i<array.length;i++){
                    initValue=fn(initValue,array[i],i,array);
                }
                return initValue;
            }
    
            var s=reduce1(arr,function(value,item,index,array){
                return value+item;
            })
            console.log(s)

    8.slice 的重构

    function slice1(array,start,end){
                var arr1=[];
                if(!array || !Array.isArray(array)) return arr1;
                if(start===undefined)  start=0;
                if(end===undefined)    end=array.length;
                start=Number(start);
                end=Number(end);
                if(isNaN(start))  start=0;
                if(isNaN(end))    end=array.length;
                if(start<0)      start=array.length+start;
                if(end<0)       end=array.length+end;
                for(var i=start;i<end;i++){
                    arr1.push(array[i]);
                }
                return arr1;   //返回新数组
            }
    
            var s=slice1(arr,0,2);     
            console.log(s);  //0  1  截取的是长度,从开始到结尾的前一个   这是和splice的区别
  • 相关阅读:
    [PyTorch]PyTorch中反卷积的用法
    [Pytorch]PyTorch Dataloader自定义数据读取
    [ACM]51nod 贪心专题
    上采样和PixelShuffle(转)
    反卷积(转置卷积)的理解
    [PyTorch]PyTorch中模型的参数初始化的几种方法(转)
    [OpenCV]OpenCV常用语法函数与坑点
    [PyTorch]PyTorch/python常用语法/常见坑点
    [Pytorch]PyTorch使用tensorboardX(转
    [Pytorch]Pytorch 保存模型与加载模型(转)
  • 原文地址:https://www.cnblogs.com/94-Lucky/p/13276239.html
Copyright © 2020-2023  润新知