那些让很多程序员看了都头疼的ES6知识点！

Mr侯_爱前端 - 2022-02-28 15:56:35

---

part 0 异步与等待(async和await)1. async

async function say(){
return  "abc"
}
say()
.then(res=>{})

async装饰的函数返回的是一个promise对象

2. await

await只能在async函数里面使用
当函数遇到await 等待await结果，再往下执行

async function doit(){
var m1 = await say("msg",1000)
var m2 = await say("msg2",2000)
return m1+m2;
}
doit()
.then(res=>console.log(res))

part 1 Symbol

符号；不重复；不可修改

var sym = Symbol("标识")

可以是sym作为唯一的key 或者标识符

{sym:"abc"}

part 2 迭代器

可迭代对象都拥有迭代器（可以被for of遍历对象都是可迭代对象），包括String Array Set Map等。
获取迭代对象

var itr = arr[Symbol.iterator]()

通过next方法进行迭代

itr.next()
{value:"xxx",done:false}
.....
{value:undefined,done:true}

part 3 生成器

普通函数前面添加 *
通过yield关键来控制生成
最终函数执行 返回一个可迭代元素

function *range(start,end,step=1){
while(start<step){
yield start;
start+=step;
  }
}

生成一个1-100的可迭代元素

var list = range(1,100);

转换为数组

list = [...list]

当函数执行到yield关键字会等待

part 4 代理prxoy

对原对象操作的劫持

obj = {msg:"你好vue"}
var o = new Proxy(obj,{
get(target,prop){ return target[prop]},
set(target,prop,value){ target[prop] = value}
})

o.msg 会执行get方法
o.msg=“abc” 会执行set方法
我们可以在get和set方法里面做一些判断劫持等其他操作

console.log(o.msg)

获取o的msg值 执行o代理里面的get方法

return obj["msg"]
o.msg = "abc"

设置o的msg值 执行o代理的set方法

obj["msg"] = "abc"

Tags 标签

前端html5Chromejavascriptes6

扩展阅读