Javascript 数组笔记总结

map 映射对于数组中的每一项,都有返回值

 

 

map定义和方法 
map()方法返回一个新数组,数组中的元素为原始数组元素调用函数处理的后值。 
map()方法按照原始数组元素顺序依次处理元素。 
注意: 
map不会对空数组进行检测 
map不会改变原始数组 
arr.map(function(currentValue,index,arr),thisValue) 
参数说明 
function(currentValue,index,arr) 
必须,函数,数组中的每个元素都会执行这个函数函数参数 
函数参数 
currentValue 必须 当前元素值 
index 可选 当前元素的索引值 
arr 可选 当前元素属于的数组对象。 

let score=[19,58,80,97];
 let result=score.map(function(){
     return item>=60?'及格':'不及格';
 })
 -> result=[不及格,不及格,及格,及格];
let arr=[1,2,3,4];
 let result=arr.map(function(item){
     //item是数组中的每一项
     return item*2;
 });
 -> result=[1,4,9,16]

forEach 和for循环一样滴,没有返回值,就是for循环换了种写的方式

let arr=[12,12,33,45];
 arr.forEach(function(item,index){
     console.log(item);
     -> 12,12,33,45
 })

filter 过滤器(留一部分,消失一部分)

//通过返回的是true还是false来决定是否返回出去
 //例子:返回能被3整除的数        
 let arr=[12,5,8,9];
 let result=arr.filter(function(item){
     if(item%3==0){
         return true;
     }else{
         return false
     }
     //简写  return item%3==0;
})

reduce 汇总(一堆出来一个)计算总数,计算平均值 比较费劲

//求和
 let arr=[11,122,333,344];
 let result=arr.reduce(function(tmp,item,index){
     return tmp+item;
 })
  • 过程是这样滴:假如我们要计算一个加法运算,11+122+333+344;第一步我们要计算11+122,得到一个中间结果133,然后用中间结果去加333,,然后又会得到一个中间结果466,然后用466去加344得到最终结果810
  • reduce的工作原理也是这样,首先因为刚开始没有中间结果,所以tmp被赋值为数组中的第一项 item是数组中第二项,index是1,然后计算11+122,把得到的结果133 return出去,第二次计算时tmp就是12+122的结果133,item是数组中的第三项333,index是2,把tmp+item的结果466返回出去;第三次计算时的tmp就是466,item是344,index是3,把结果返回出去,因为这是数组中最后一项,所以把结果返回给result.
计算次数 tmp item index
第0次 11 122 1
第1次 11+122 333 2
第2次 (11+122)+333


  //计算平均数 最后一次要求平均数
        //求和
        let arr=[11,122,333,344];
        let result=arr.reduce(function(temp,item,index){
            if(index!=arr.length){//不是最后一次,求和
                return temp+item;
            }else{//最后一次
                return (temp+item)/arr.length;
            }
        })
* 应用:计算购物车的总价格

String.split() 执行的操作与 Array.join 执行的操作是相反的。

 <!-- 例: 假如有一个购物车中的商品列表-->
 let shoppingCart=[
     {id:1,name:'袜子',price:56,imgs:'1.jpg,2.jpg'},
     {id:2,name:'内裤',price:156,imgs:'3.jpg,4.jpg'},
     {id:3,name:'上衣',price:1156,imgs:'5.jpg,6.jpg'},
     {id:4,name:'裤子',price:4156,imgs:'7.jpg,8.jpg'},
     {id:5,name:'胸罩',price:14156,imgs:'9.jpg,10.jpg'},
 ]
 //1. 过滤掉价格小于1000的衣服
 let result=shoppingCart.filter(item=>item.price>=1000);
 -> result=[
     {id:3,name:'上衣',price:1156,imgs:'5.jpg,6.jpg'},
     {id:4,name:'裤子',price:4156,imgs:'7.jpg,8.jpg'},
     {id:5,name:'胸罩',price:14156,imgs:'9.jpg,10.jpg'},
 ] 
 //2. 把图片转化为数组格式
 let result=shoppingCart.map(item=>{
     item.imgs=item.imgs.split(',');
     return item;
 })
 ->result=[ { id: 1, name: '袜子', price: 56, imgs: [ '1.jpg', '2.jpg' ] },
     { id: 2, name: '内裤', price: 156, imgs: [ '3.jpg', '4.jpg' ] },
     { id: 3, name: '上衣', price: 1156, imgs: [ '5.jpg', '6.jpg' ] },
     { id: 4, name: '裤子', price: 4156, imgs: [ '7.jpg', '8.jpg' ] },
     { id: 5, name: '胸罩', price: 14156, imgs: [ '9.jpg', '10.jpg' ] } ]
 //3. 计算总价格 首先使用map把价格映射出来,然后使用reduce计算和

 let total_price=shoppingCart.map(item=>item.price)
                             .reduce((temp,item)=>temp+item);

 打乱数组顺序(本质思路就是数组换位置)

            var shuffle = function(arr) {
                var len, t, rand;
                for (var i = 0; len = arr.length, i < len; i++) {
                    rand = parseInt(Math.random() * len); 
                    //parseInt(Math.random()*(len-1-0)+1);或者rand = Math.floor(Math.random()*(len-1-0)+1);即Math.random()*(Max-Min)+1
                    t = arr[rand];
                    arr[rand] = arr[i];
                    arr[i] = t;
                }
                console.log(arr);
             
            }
            shuffle([1,2,3,4,5,6]);

 

上一篇:jquery简单的上传图片预览


下一篇:案例:百度换肤