ES6入门---第二单元 模块一：关于数组循环

模块一：关于数组循环

1、arr.forEach()

//用来代替for循环

let arr=[1,2,3]；

arr.forEach(function(val,index,arr){

console.log(val,index,arr);

});

//结果显示: 值 对应位置 整个数组

可以接收两个参数：arr.forEach/map/filter/some/every(循环回调函数，this指向谁)

例：

 let arr=[1,2,3];
          arr.forEach(function(val,index,arr){
          console.log(this,val,index,arr);
          },第二个参数);

*箭头函数板：

  let arr=[1,2,3];
         arr.forEach(val,index,arr => {
           console.log(this,val,index,arr);
         }怎么改始终指向window);

可以把第二参数去掉：this+第二参数去掉

2、arr.map()  也是一个循环 非常有用，做数据交互 ——映射

正常情况下需要配合return，返回一个新数组

没有return时==foreach

用途：重新进行数据整理

<script>
        let arr = [
            {title:'aaaaa', read:100, hot:true},
            {title:'bbbb', read:100, hot:true},
            {title:'cccc', read:100, hot:true},
            {title:'dddd', read:100, hot:true}
        ];
        
        let newArr = arr.map((item, index, arr)=>{
            let json={}
            json.t = `^_^${item.title}-----`;//将title内容增加了符号
            json.r = item.read+200;//变更了read人数
            json.hot = item.hot == true && '真棒!!!';//将true显示为其他内容
            return json;
        });

        console.log(newArr);
        
    </script>

 

3、arr.filter() 过滤不合格 返回true 留下来

  let arr = [
            {title:'aaaaa', read:100, hot:true},
            {title:'bbbb', read:100, hot:false},
            {title:'cccc', read:100, hot:true},
            {title:'dddd', read:100, hot:false}
        ];
        
        let newArr = arr.filter((item, index, arr)=>{
            return item.hot==false;//等于false留下来 若删除==及后面则为true留下
        });

        console.log(newArr);

 

 4、

arr.some() 类似查找  数组里有某元素符合条件返回true

arr.every() 数组里所有元素满足条件返回true

 <script>
        let arr =['apple','banana','orange'];

        let b = arr.some((val, index, arr) =>{
            return val=='banana2';
        });

        console.log(b);
    </script>

例：判断是否为奇数

<script>
        let arr = [1,3,5,7,9,10];

        var b = arr.every((val, index, arr)=>{
            return val%2==1;
        });

        console.log(b);
    </script>

 

 5、

arr.reduce()  求数组的和、阶乘

补充：

1、JavaScript pow() 方法

Math.pow(x,y)         pow() 方法可返回 x 的 y 次幂的值。

2、ES2017新增一个运算符:
             幂
        Math.pow(2,3)
        2 ** 3

<script>
        let arr = [1,2,3,4,5,6,7,8,9,10];
                           //上一个结果 当前值 位置数值 整个数组
        let res = arr.reduce((prev, cur, index, arr) =>{
            return prev+cur;
        });

        console.log(res);

    </script>

arr.reduceRight()

从右往左走

 

6、for of 循环

补充：

1、Object.keys( )  返回值是一个表示给定对象的所有可枚举属性的字符串数组。

2、entries() 方法返回一个数组的迭代对象，该对象包含数组的键值对 (key/value)。

形式：迭代对象中数组的索引值作为 key， 数组元素作为 value。

[0, "Banana"]
[1, "Orange"]
[2, "Apple"]
[3, "Mango"]

 

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

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

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

        for(let [key, val] of arr.entries()){
            console.log(key,val);
        }

---