• for,forEach,for in,for of的使用及區別
• filter,map的使用及區別
• includes,finde的使用及區別
• some,every的使用及區別
• reduce的使用及常見用法

for,forEach,for in,for of的區別：

    var arr = [1,2,3,4,5];
    arr.p = 'private'

for

    for(let i = 0;i<arr.length;i++){
        console.log(arr[i])
    }

1、for循環不到數組的私有屬性
2、可以使用return|break|continue終止|結束循環

3、for屬於編程式寫法

forEach

    arr.forEach((item)=>{
        console.log(item);
    })

1、forEach循環不到數組的私有屬性
2、return|break|continue不起作用
3、forEach屬於聲明式寫法，不關心具體實現

for in

    for(let key in arr){
        console.log(key)
    }

1、可以遍歷到數組私有屬性的值
2、key的類型是string型
3、可以使用return|break|continue終止|結束循環

for of

    for(let val of arr){
        console.log(val);
    }

1、不可以遍歷數組的私有屬性的值
2、val的值就是arr項的值
3、可以使用return|break|continue終止|結束循環

filter,map

filter

    [1,2,3,4].filter((item)=>{
        return item>3
    })
 

map

    var li = [1,2,3,4].map((item)=>{
        return `<li>${item}</li>`
    })
    <!--
        1、li的值為:['<li>1</li>','<li>2</li>','<li>3</li>']
    -->
    var liList = li.join('');//返回結果為：'<li>1</li><li>2</li><li>3</li>'

includes返回的是boolean

    var arr = [1,2,3,4,5];
    arr.inclueds(7);//arr數組裏有7嗎？沒有返回false

find

    var arr = [1,2,3,4];
    var result = arr.find(function(item,index){
        return item.toString().indexOf('5')>-1
    })
    // result:undefined
     var result2 = arr.find(function(item,index){
        return item.toString().indexOf('2')>-1
    })
    //result2:2

1、回調函數中返回true停止循環並返回那一項的值，未找到返回undefined
2、不改變原數組

some&every

    var arr = [1,2,3,4,5];
    var someArr =  arr.some(function(item){
        return item>3
    });
    //someArr : true
    var everyArr = arr.every(function(item){
        return item<0
    });
    //everyArr:false

some:找true,找到true後停止循環，返回true,找不到返回false
every:找false，找到false後停止循環，返回false。找不到返回true
(os：這倆真是一對兒)

reduce:不改變原數組值

    var arr = [1,2,3,4,5];
    arr.reduce(function(prev,next,index,item){
        console.log(arguments)
    })
    <!--
        第一次循環：
            prev:代表數組的第一項
            next:代表數組的第二項
            index:索引
            item：當前數組
        第二次循環：
            prev:前兩項的和
            next:數組的第三項
    -->

求數組的累加和：[1,2,3,4,5,...,100]

    var arr = [1,2,3,4,5,...,100];
    arr.reduce(function(prev,next){
        return prev+next;//本次的返回值會作為下次的prev的值
    })

已知數組：[{price:30,count:1},{price:20,count:2},{price:40,count:3}]
求：price*cout的各項累加和

    var arr = [{price:30,count:1},{price:20,count:2},{price:40,count:3}]
    let sumArr = arr.reduce(function(prev,next){
        return prev+next.price*next.count 
    },0);//默認指定第一次prev的值為0

多維數組轉一維數組
[[1,2,3],[2,3,4],[5,7,8]];

    var arr = [[1,2,3],[2,3,4],[5,7,8]];
    var newArr = arr.reduce(function(prev,next){
        return prev.concat(next)
    });
    console.log(newArr);
    <!--[1,2,3,2,3,4,5,7,8]-->

終於過完年了，新年第一篇總結，數組的常用方法及其區分~
2019常翻看常總結

數組常用遍歷方法用法及其各項區別