ES6之数组循环的方法

3,211 阅读2分钟

ES6新增循环方法

1. for(let i = 0; i < arr.length; i++)

while

2. arr.forEach() -->代替普通for循环

三个参数:

val 当前遍历到的数据,index 当前遍历到的数据的序号,arr 当前遍历的数组

let arr = ['apple', 'banana', 'orange'];
arr.forEach(function(val, index, arr){
    console.log(val,index,arr);
});
-->输出
apple 0 ['apple', 'banana', 'orange']
banana 1 ['apple', 'banana', 'orange']
orange 2 ['apple', 'banana', 'orange']

3. arr.map()-->做数据交互“映射”

(1)返回的是个新的数组,map()方法不会改变原数组,需要配合return,return的值会将原数组中的对应值替换掉 。

image.png (2)平时只要用map,一定要有return

let arr = [
    {title:'aaa', read:100, hot:true},
    {title:'bbb', read:100, hot:true},
    {title:'ccc', read:100, hot:true},
    {title:'ddd', read:100, hot:true}
];
let newArr = arr.map((item,index,arr)=>{
    console.log(item,index,arr);
    return 1;
});
console.log(newArr);
-->返回四个1的数组

image.png

(3)若是没有return,相当于forEach()

let arr = [
    {title:'aaa', read:100, hot:true},
    {title:'bbb', read:100, hot:true},
    {title:'ccc', read:100, hot:true},
    {title:'ddd', read:100, hot:true}
];
arr.map((item,index,arr)=>{
    console.log(item,index,arr);
});

4. arr.filter()-->过滤

(1) filter方法的return只有两种情况,true/false;如果返回true就保留这个数据,如果返回false,就删除这个数据。也是返回新数组,不改变原数组。

  let arr = [
            {name:"张三",age:18, yh:0},
            { name:"李四", age:30,  yh:1} ,
            {  name:"王五", age:28,   yh:0},
            {name:"李丽", age:35,  yh:1}
        ];
            let newArr = arr.filter( r => r.yh==1 );
        console.log(newArr);

image.png

(2)过滤一些不合格“元素”,如果回调函数返回true,就留下来

let arr = [
    {title:'aaa', read:100, hot:true},
    {title:'bbb', read:100, hot:false},
    {title:'ccc', read:100, hot:true},
    {title:'ddd', read:100, hot:false}
];
let newArr = arr.filter((item,index,arr)=>{
    return item.hot == true;
});
console.log(newArr);

5. arr.some()-->类似查找,数组里面某一个元素符合条件,返回true

let arr = ['apple', 'banana', 'orange'];
let b = arr.some((val, index, arr)=>{
    return val == 'banana';
});
console.log(b);
-->输出true 

6. arr.every()-->数组里面所有的元素都要符合条件,才返回true

let arr = [1,3,5,7,10];
let a = arr.every((val, index, arr)=>{
   return val % 2 == 1;
});
console.log(a);
-->false

7. 以上五种循环方法,都可以接收两个参数

arr.forEach/map...(循环回调函数,this指向谁)

let arr = ['apple', 'banana', 'orange'];
arr.forEach(function(val, index, arr){
    console.log(this,val,index,arr);
},window);
###### ```