ES6、ES7、ES8

原链接：https://juejin.cn/post/6995334897065787422

 

1、var、et、const

变量提升、暂时性死区

2、函数参数默认值

3、扩展运算符

let   arr1=[1,2,3],

　　arr2=[3,4,5],

　　arr3=[6,7,8];

let arr=[...arr1,...arr2,...arr3]

4、剩余参数

当函数的参数个数不确定时

function(name,...params){

　　console.log(name);

　　console.log(params)

}

5、模板字符串

let name='Amelia'
console.log(`我的名字叫${name}`)

6、Object.keys()

7、箭头函数

普通函数和箭头函数的区别：

   1）、箭头函数不能作为构造函数，不能使用new;

   2）、箭头函数没有自己的this；

   3）、箭头函数没有arguments对象；

   4）、箭头函数没有原型对象

 

8、Array.forEach

array.forEach((item,index,arr)=>{})

9、Array.map 返回处理过后的新数组

array.map((item,index,arr)=>{})

10、Array.filter

array.filter((item,index,arr)=>{})

11、Array.some

只要有一项为真，则返回true

12、Array.every

全部为真返回真，否则返回false

13、Array.reduce

第一个参数callback函数，pre为上次return的值,next为本次遍历的项

第二个参数为初始值，也就是第一个pre

eg:

//求和

const arr=[1,2,3,4]

const total=arr.reduce((pre,next)=>pre+next,0)

// 统计元素出现个数

const str='ahdjfhdjfhdjfhdjf';

const arr=str.split('');

const totalObj=arr.reduce((pre,next)=>{

    if(pre[next]){

        pre[next]++

    }else{

        pre[next]=1

    }

    return pre

},{})

console.log(totalObj)   //{ a: 1, h: 4, d: 4, j: 4, f: 4 }

14、对象属性同名简写

　　let name="Amelia"
　　let age=25

　　es5写法：

　　let obj={

　　　　name:name,

　　　　age:age
　　}

　　let obj={name,age}

15、promise

16、class 类

17、结构赋值

18、find、findIndex

19、for in 和for of

　　for in 可遍历数组和对象

　　for of只能遍历数组

20、Set、Map

ES7

21、includes

22、Math.pow()

ES8

23、Objeck.values

24、async wait

function fn (time) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(`${time}毫秒后我成功啦！！！`)
    }, time)
  })
}

async function asyncFn () {
  // 排队
  const data1 = await fn(3000)
  console.log(data1) // 3秒后 3000毫秒后我成功啦！！！
  const data2 = await fn(1000)
  console.log(data2) // 再过1秒 1000毫秒后我成功啦！！！
  const data3 = await fn(2000)
  console.log(data3) // 再过2秒 2000毫秒后我成功啦！！！
}

function fn (time) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(`${time}毫秒后我成功啦！！！`)
    }, time)
  })
}

async function asyncFn () {
  const arr = [fn(3000), fn(1000), fn(1000), fn(2000), fn(500)]
  for await (let x of arr) {
    console.log(x)
  }
}

asyncFn()
3000毫秒后我成功啦！！！
1000毫秒后我成功啦！！！
1000毫秒后我成功啦！！！
2000毫秒后我成功啦！！！
500毫秒后我成功啦！！！

25、?.和??

const list = null
// do something
if (list && list.length) {
  // do something
}

// 使用可选链
const list = null
// do something
if (list?.length) {
  // do something
}

const obj = {
  cat: {
    name: '哈哈'
  }
}
const dog = obj && obj.dog && obj.dog.name // undefined

// 可选链
const obj = {
  cat: {
    name: '哈哈'
  }
}
const dog = obj?.dog?.name // undefined



const arr = null
// do something
const item = arr && arr[1]

// 可选链
const arr = null
// do something
const item = arr?.[1]

const fn = null
// do something
const res = fn && fn()

// 可选链
const fn = null
// do something
const res = fn?.()