ES6常用语法

at函数：通过负索引的方式获取最后n个元素

let last = array.at(-1) // -1表示最后1个，-2表示最后第二个，以此类推

循环函数

            //1.高阶回调函数filter
            filterFun(){
                const firstNums = [10, 20, 30, 40, 50];
                // filter的回调函数有一个要求，必须返回一个布尔值
                // 当返回true时，函数内部会自动将这次回调的n加入到新的数组中，新的数组指的是内部自动创建的
                // 当返回false时，函数内部会过滤掉这次的n
                //使用filter时只要接收就好了:获取数组中小于30的值
                let newNums = firstNums.filter(function(n){
                    return n < 30;
                })
            },

            //2.想让数组产生变化使用map
            mapFun(){
                const secondNums = [10, 20, 30, 40, 50];
                let newSecondNums = secondNums.map(function(n){
                    return n * 2;
                });
                console.log(newSecondNums)
            },

            // reduce函数的使用
            // reduce作用对数组中所有的内容进行汇总
            reduceFun(){
                const threeNums = [20, 40, 80, 100];
                // xxx.reduce(fn,x)
                let toatl = threeNums.reduce(function(preValue,n){
                    return preValue + n;
                },0);
                // 第一次preValue = 0 , n = 20
                // 第二次preValue = 20 , n = 40
                // 第三次preValue  = 60 , n = 80
                // console.log(toatl)
            },


            //高阶函数混合应用,过滤出数组中小于一百的值，并且让每个值乘2后计算出总和
            remixFun(){
                const numberAry = [10, 40, 80, 90, 120, 150];
                // let totalNumber = numberAry.filter(function(n){
                //     return n<100;
                // }).map(function(n){
                //     return n * 2;
                // }).reduce(function(preValue, n){
                //     return preValue + n;
                // },0);

                //以上写法的更简洁写法,箭头函数：es6语法
                let totalNumber =numberAry.filter(n => n<100).map(n => n * 2).reduce((pre,n) => pre + n);
                console.log('高阶函数混合使用计算出的总和是'+totalNumber);
            }

findIndex (查找数组中是否有某一项的属性值等于xxx，result 等于 -1 的时候表示没有找到)

let result = state.tabList.findIndex(item => item.name === val.name);

数组push另外一个数组对象中数据到自身，使用...

    let a = [];
    let b = [
      {
        name: "1"
      },
      {
        name: "2"
      }
    ];

    a.push(...b);

async和await，await只有放在async函数中才有用

// 统一处理axios请求
    async getHistoryData (data) {
      try {
        let res = await axios.get('/api/survey/list/', {
          params: data
        })
        this.tableData = res.data.result
        this.totalData = res.data.count
      } catch (err) {
        console.log(err)
        alert('请求出错！')
      }
    }
  }

模板字符串

ES5的字符串与变量的结合，比较不方便，需要大量的双引号和+号拼接

 $("#result").append(
        "He is <b>"+person.name+"</b>"+"and we wish to know his"+person.age+".That is all" 
 );

ES6新推出的模板字符串，使用反引号标识，用${ }将变量括号起来

 $("#result").append(
        `He is <b>${person.name}</b>and we wish to know his${person.age}.that is all`
 );

通过map函数将对象数组中的值赋予一个新的数组

let a = [
    {
        name: '张三'
    },
    {
        name: '李四'
    }
]
// 注意这里是没有花括号了
const test = a.map((item)=> 
    item.name
  
)
console.log(test)

对象解构语法：

const obj = {
name: 'why',
age: 18,
height: 1.88
}

const {name, age, height} = obj;
console.log(name)