常用的一些ES6

1、Array.from()方法用于将两类对象转为真正的数组：类似数组的对象（array-like object）和可遍历（iterable）的对象（包括ES6新增的数据结构Set和Map，任何有length属性的对象）

ES5的写法：var arr1 = [].slice.call(arrayLike); // ['a', 'b', 'c']

ES6写法：let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']

还可以接受第二个参数，作用类似于数组的map方法，用来对每个元素进行处理，将处理后的值放入返回的数组；Array.from(arrLike,x=>x * x) 等同于 Array.from(arrLike).map(x=>x * x)

2、find()方法用于找出第一个符合条件的数组成员。它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一个返回值为true的成员，然后返回该成员。如果没有符合条件的成员，则返回undefined；它的回调函数可以接受三个参数，依次为当前的值、当前的位置和原数组； (其好处是找到之后就返回,不会继续遍历下去)

[1, 5, 10, 15].find(function(value, index, arr) { return value > 9; }) // 10

缩写: [1,23,4,56].find(item=>item>10) 查找大于10的第一个数

3、includes方法是否包含给定的值，返回布尔值；第二个参数百世搜索的位置，默认为0；

另外，Map和Set数据结构有一个has方法:Map结构的has方法是用来查找键名，Set结构的has方法是用来查找值的。

4、扩展运算符

可以用在合并一些数组和对象

const a = [1,2,3] const b = [3,4,5,6] const c = [...a,...b] 这样就是直接合并 有时候需要去重 就需要加用到 new Set, const c = [...new Set([...a,...b])]

对象的合并 const x = {...v,...b}

ES6缩写的let f = v => v 等同于 let f = funtion (v){return v}

5、可选链操作符

经常对接接口时,不知道后端有些数据会不会返回,导致之后的属性参数报错,这个时候就可以用到可选链操作符了;

this.obj = res.data.obj?.userInfo?.userName ?? '不存在'

一个问号就是判断前面的参数是否存在,不存在就直接undefined,后面的参数自然就不会获取到了, 2个问号是空值合并运算符,就相当于给一个默认参数,左侧需要时null或者undefined才行; 所以大家在碰到一些输入框或者值是否存在的时候不需要一堆非空判断,只需要 if((value?? '') != ''){}

尾递归：递归非常耗费内存，因为需要同时保存成千上百个调用帧，很容易发生“栈溢出”错误（stack overflow）。但对于尾递归来说，由于只存在一个调用帧，所以永远不会发生“栈溢出”错误。（尾调用和尾递归都是值最后一步才执行调用或递归）

function factorial(n, total) { if (n === 1) return total; return factorial(n - 1, n * total); } factorial(5, 1) // 120

扁平化数组

指将一个多维数组变为一维数组

const a = { '研发部':[1,2,3,4],'开发部':[5,6,7],'主管部':[8,9,10]} Object.values(a).flat(Infinity) 用的主要就是flat方法,参数Infinity就是不管是几维数组都变成一维,也可以填写具体的数字就是将几维数组改成一维;(flat方法ie不支持)

异步函数的问题

说到异步大部分都是提到Promise,但是写多了Promise,就像这种

这种写法可能会很多,但是某个环节出问题,就很明显了,所以非必要就不要这样写,可以使用async和await, const fn = async ()=>{ const res1 = await fn1(); const res2 = await fn2(); console.log(res1); console.log(res1); }

当然Promise中还有其他的情况,像需要并发请求的时候,Promise.all([fn1(),fn2()]).then(res=>{});还一种就是等其中一个请求完成就调用,Promise.race()