还在为React语法而纠结吗？快来看看

  ···从2016年开始，阮一峰博客的ES6第二版的发布，已经过去两个年头
在这两年中ES6已经应用在前端的各个语法当中。

  作为React框架的基本语言便是ES6，所以掌握ES6的基本语法,对程序员而言已经迫在眉睫，毕竟影响着各位的饭碗。

下面我们看下ES6的新数组操作方法：

1. forEach 是Array新方法中最基本的一个，就是遍历，循环。

var arr = ["aa","ddd","sada"]

arr.forEach(function(item,index){
    console.log(item+"--"+index)
})
//(打印结果) aa--0 ddd--1 sada--2

2. Map对象就是简单的键值对映射。其中的键和值可以使任意值。

var arry2 = [1,2,3,4,5,11,22,345,3321]

var arr2 = arry2.map(item=>{
    return item*2
})
console.log(arr2)
//(打印结果) [ 2, 4, 6, 8, 10, 22, 44, 690, 6642 ]

3. filter为“过滤”、“筛选”之意。指数组filter后，返回过滤后的新数组。用法跟map极为相似：

var arry2 = [1,2,3,4,5,11,22,345,3321]
var arr3 = arry2.filter(item=>{
    return item%2==0
})
//(打印结果) [ 2, 4, 22 ]

4. reduce是JavaScript 1.8中才引入的，中文意思为“减少”、“约简”。不过，从功能来看，我个人是无法与“减少”这种含义联系起来的，反而更接近于“迭代”、“递归(recursion)”

var arry2 = [1,2,3,4,5,11,22,345,3321]
var list = arry2.reduce((previous, current, index, array)=>{
       return previous + current;
}) 
//previous 计算结果的值  默认第返回第一个值  
//current  当前值
// index 下标
// array 整个数组
1--2
2--3
3--4
.....
最终返回一个结果（一般用于计算总和，和排除对象中的值

下面做一下练习：

var liy = [
    {"name":"小孔","sore":"60"},
    {"name":"li","sore":"80"},
    {"name":"ll","sore":"160"}
]
var cc = liy.filter(item=>{
  return item.sore>60
})
console.log(cc)   //返回大于60的分数
// [ { name: 'li', sore: '80' }, { name: 'll', sore: '160' } ]

改变对象里面的数值

//把小李的年龄改为99  面试经常问到
var xiaoming = {
    "name":"小明",
    "age" : 12,
    "friends" :[
        {   
            "id":1,
            "name":"小红",
            "age":13
        },
        {   
            "id":2,
            "name":"小里",
            "age":14
        },
        {   
            "id":3,
            "name":"小吃",
            "age":19
        }
    ]
}
var ol = {
    ...xiaoming, //展开数组
    "friends":xiaoming.friends.map(item=>{
        //如果是小里返回
        if(item.name=="小里"){
            return{
                ...item,
                "age":99
            }
        }
    //否则返回
        return item 
    })
}

//筛选>13的返回一个新的对象
var superold = {
    ...xiaoming,
   "friends":xiaoming.friends.filter(item=>{
       return item.age>13
   })
}

//得到新数组类似于push  往里面添加新的对象
var xiaoming2 = {
    ...xiaoming ,
    "friends":[{
        "name": "张开",
        "age":90
    },...xiaoming.friends]
 }

 //让张王ID自增加+1
 var xiaoming3= {
    ...xiaoming,
    "friends":[
        ...xiaoming.friends,{
            id:xiaoming.friends.reduce((a,b)=>{
                console.log(a,b,"222")
                return a.id > b.id ? a : b
            }).id+1,
            "name": "张王",
            "age":77
        }
    ]
 }

喜欢的小伙伴动动手指点个赞！~ ❤❤❤