js数组常用方法QIan锋逆战

数组的方法


arr.slice(start,end)

按指定位置截取复制数组的内容,返回新数组,不会改变原数组

从下标start开始,截取到end,包括start但不包括end

第二个参数不写,默认截取到尾部,只能从前向后截取

var arr1=arr.slice(1,4);         // 从第1位开始截取到第4位之前

var arr1=arr.slice(); // 复制数组arr

var arr1=arr.slice(0);  // 复制数组

var arr1=arr.slice(3); //从第三位截取到尾部复制

var arr1=arr.slice(-2); //从倒数第二位开始截取到尾部

var arr1=arr.slice(-3,-1); //从倒数第三位到倒数第一位




arr.indexOf(要查询得元素,从什么位置开始查询)  位置就是下标

在数组中查找元素,找到返回元素下边,找不到返回-1,查询到第一个后,就返回下标不再继续查询

var  index=arr.indexOf(4);  // 在数组中查找元素4,如果查找到,返回该元素所在的下标,如果没有查找到,则返回-1


var arr=[

      {a:1},

      {a:2},

      {a:3},

      {a:4}

];

var index=arr.indexOf({a:1});     // 这是错误得,查找不到,因为查找得是新对象  地址不同




Array.from(类似于数组的列表)  转为数组

// 根据标签名获取到标签列表 (获取到的是列表,不是数组,不能直接使用数组的方法)

var divs=document.getElementsByTagName("div");

divs.pop(); //错误,不是数组不能直接使用数组的方法

var arr=Array.from(divs); //ES6 的写法  把divs这个列表 转为数组

       //ES5   =>    var arr=Array.prototype.slice.call(divs);



        var divs=document.getElementsByTagName("div");

        var arr=Array.from(divs);

        for(var i=0;i<arr.length;i++){

            arr[i].onclick=clickHandler;

        }

        function clickHandler(){

            console.log(this); // 在点击事件调用得函数中,this就是被点击得元素(不精准得)

            var index=arr.indexOf(this);

            console.log(index);  // 这样就可以判断点击得是列表中得第几个元素  

        }






------------使用 indexOf 查询到数组中所有的为3的元素

       var arr=[1,3,1,2,3,5,2,3,4,6];

       var index=arr.indexOf(3); // 这样 只能查询到第一个3 (下标为1)

       console.log(index);

       var index=arr.indexOf(3,2); // 这样 只能查询到第二个3 (下标为4)

       console.log(index);


        var index=0; // 使用循环,查询到数组中所有为3的元素,并打印下标

        while(true){

            index=arr.indexOf(3,index);

            console.log(index);

            if(index===-1) break; // 查询到最后,查不到时返回-1  如果为-1 跳出循环,不再查询

            index++;

        }




lastIndexOf(查找得元素,从什么位置开始查找)   从后向前查找

var arr=[1,3,1,2,3,5,2,3,4,6];

var index=arr.lastIndexOf(3);

console.log(index); // 打印下标 7



——————————   第三种 去重??方法  ———————————

        var arr=[1,3,1,2,3,5,2,3,4,6];

        var arr1=[];

        for(var i=0;i<arr.length;i++){

            if(arr1.indexOf(arr[i])===-1){ // 如果再arr1 数组中 查询不到 arr [ i ] , 表示这个元素不在arr1 数组中

                arr1.push(arr[i]); // 那么将这个元素插入到arr1 数组中

            }

        }

        console.log(arr1); 





遍历数组(forEach 和 map)

 arr.forEach(function(数组中的元素,每个元素对应的下标,数组自身){ })

   var arr=[1,2,3,5,6,7,8,9];

   arr.forEach(function(a,b,c){

         console.log(a,b,c);

        })



 // 求数组中所有元素的和

//??———使用for循环遍历数组

        var sum=0;

        for(var i=0;i<arr.length;i++){

            sum+=arr[i];

        }

        console.log(sum); 



        //??——— forEach 遍历数组

        var sum=0;

        arr.forEach(function(item){

            sum+=item;

        })

        console.log(sum); 




var arr=[1,2,3,5,,6,7,8,9];

 arr.forEach(function(item,index){  // 使用forEach可以跳过空元素

       console.log(item,index);

        })



        var arr1=[];

        arr.forEach(function(item,index){ // 保留空元素

            arr1[index]=item;

        })

        console.log(arr1); 




arr.map(function(item,index,arr){ })

map会返回一个与原数组长度相等的新数组


        var arr=[3,5,7,9,1,2,4];

        var arr2=arr.map(function(item,index,arr){

            // console.log(item,index,arr);

            // return "a";

            return item+10;  // 在map中使用return 就是在对应的下标中添加对应的数据

        });

        console.log(arr2);



forEach没有返回值,使用return无效

map 有返回值,与原数组等长的新数组,元素内容由return确定,不写return返回undefined

forEach 和 map 都不会遍历空元素  




// 遍历数组arr,将大于4的元素生成一个新的数组(新数组中会有undefined)

        var arr=[1,3,5,7,2,4,6,8];

        var arr1=arr.map(function(item){

            if(item>4){

                return item;

            }

        });

        console.log(arr1); 



        var arr=[ // 元素是对象的数组

            {id:1001,name:"电视",price:4500},

            {id:1002,name:"电脑",price:6500},

            {id:1003,name:"冰箱",price:2000},

            {id:1004,name:"洗衣机",price:1000},

            {id:1005,name:"手机",price:5500}

        ];

// 使用 forEach 实现给数组添加 数量和总价属性及值

            arr.forEach(function(item){ // 遍历 arr 数组,给元素添加 num 属性

            item.num=parseInt(Math.random()*9+1); // 给num属性赋值 随机数 1-10

            item.total=item.price*item.num; // 给元素添加 total属性  属性值为 单价*数量

        })

        console.log(arr);

// 使用 map 实现给数组添加 数量和总价属性及值

            var arr1=arr.map(function(item){ // 创建一个遍历 arr1 承接map遍历后 返回的数组

            item.num=parseInt(Math.random()*9+1);

            item.total=item.price*item.num;

            return item; // 给每个map遍历的元素添加内容,item

        })

        console.log(arr1,arr);  // 每个元素都是对象  有引用关系,会改变原数组



   // 不改变原数组,完成一个新数组,里面有num和总价

        var arr1=arr.map(function(item){

            var o={};

            for(var prop in item){ // 把对象元素 复制出来 给到o    

                o[prop]=item[prop]; // 在将o对象当作arr1数组中的元素  切断通过遍历过来的元素对象的引用关系

            }

            o.num=parseInt(Math.random()*9+1);

            o.total=o.price*o.num;

            return o;

        })


        console.log(arr1,arr);





时间复杂度算法计算花费时间  花时间越少时间复杂度越小

空间复杂度算法计算需要花费堆栈空间(内存)越多代表空间复杂度越高



冒泡排序      

            var arr=[4,2,7,2,5,8,0,4,5,7,3,8,9];

            function sorts(arr){

            var len=arr.length-1;

            for(var i=0;i<len;i++){   // i 的目是控制循环次数  

                for(var j=0;j<len-i;j++){ //  j和j+1是前后数据比较

                    if(arr[j]>arr[j+1]){

                        var temp=arr[j+1]; // j 和 j+1 比较 满足条件 进行交换

                        arr[j+1]=arr[j];

                        arr[j]=temp;

                    }

                }

            }

        }

        sorts(arr);

        console.log(arr); 



arr.sort();      排序,仅能10以内数字  缺点:按字符排序

arr.sort(function(后一项,前一项){})  仅适用于数值


arr.sort(function(a,b){      

        return  a-b; //  从小到大   

        return  b-a; //  从大到小    


arr.sort(function(a,b){ // 将字符排序

         console.log(a.charCodeAt(0),b.charCodeAt(0)); // str.charCodeAt(0) => 将str字符串的第0项转换为Unicode编码

         return a.charCodeAt(0)-b.charCodeAt(0); // a-z

         return b.charCodeAt(0)-a.charCodeAt(0); // z-a

        })



arr.sort(function(){ // 数组元素随机乱序

       return Math.random()-0.5;

 });





arr.some(function(item,index,arr){  });

判断数组中是否存在满足条件的元素,如果有就返回true,如果没有就返回false

遍历数组,如果有一个满足条件的元素,都会直接返回true,不继续向后遍历


var arr=[1,4,6,2,7,9,0];

var bool=arr.some(function(item,index,arr){ // 遍历数组,是否存在大于5的元素

       return item>5;

});

console.log(bool);




        //  重构some桥接模式

            function somes(arr,fn){  // fn就是回调函数

            for(var i=0;i<arr.length;i++){

               var bool=fn(arr[i],i,arr); // 通过循环遍历传入的数组,并回调条件函数 将回调函数的返回值赋值给bool 并最终返回出去

               if(bool) return true;

            }

            return false;

        }


       var b=somes(arr,abc);

       function abc(item,index,arr){

            return item>5;

        }

        console.log(b); 


var bool=arr.every(function(item,index,arr){  });

判断数组中是否每一个都满足条件,如果有一个不满足条件,直接跳出,所有都满足时返回为ture


var bool=arr.every(function(item,index,arr){ // 判断数组中 是否所有的元素都大于2

        return item>2;

});

console.log(bool); 

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容