ES6
Promiss
定义
执行异步任务,避免回调地狱
.then和.catch方法
p.then(res=>console.log(res))
.catch(err=>console.log(err))
其他
Promise.race([...]).then()异步列表中最resolve的值
封装Promise
say("msg",500)
.then(res=>{
console.log(res)
return say("abc",123)
})
.then(res=>console.log(res))
实例
<script>
function say((msg,time)=>{
setTimeout(()=>resolve(msg),time)
})
say("你好",2000)
.then(res=>{
console.log(res);
return say("你踩着我尾巴了",3000)
})
.then(res=>console.log(res))
</script>
异步与等待
async
- async装饰的函数返回的是一个promise对象
async function say(){
return "hello ES6"
}
say()
.then(res => console.log(res))
typeof(async)
await
- await只能在async函数中使用
- 当函数遇到await等待await结果，再往下执行
// await只能在async函数中使用
function say(msg,time){
return new Promise((resolve,reject) => {
setTimeout(() => resolve(msg),time)
})
}
// 2秒后 你好呀
// 2秒后 我很中意你
// 定义async函数
async function doit(){
// await会等待say函数执行完才会执行
var s1 = await say ("你好呀",2000);
console.log(s1);
var s2 = await say("我很中意你",2000);
console.log(s2);
return s1+s2;
}
doit()
.then(res => console.log(res))
Symbol
- 符号;不重复;不可修改
- var sym = Symbol("标识")
- 可以是sym作为唯一的key或者标识符{sym:"abc"}
迭代器
- 可迭代对象都拥有迭代器（可以被for of 遍历对象都是可迭代对象） String Array Set Map
- 获取迭代对象
var itr = arr[Symbol.iterator]()
- 通过next方法进行迭代
//itr.next()
{value:"xxx",done:false}
{value:undefined,done:true}>
生成器
- 普通函数前面添加 *,通过yield关键来控制生成,最终函数执行,返回一个可迭代元素
function *range(start,end,step=1){
while(start<step){
yield start;
start+=step;
}
}
- 当函数执行到yield关键字会等待
代理 prxoy
- 对原对象操作的劫持
- o.msg 会执行get方法,o.msg=“abc” 会执行set方法,我们可以在get和set方法里面做一些判断劫持等其他操作
- console.log(o.msg),获取o的msg值,执行o代理里面的get方法,return obj["msg"]
- 实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>代理</title>
</head>
<body>
<script>
var obj = {"name":"chen",age:16};
// 用a来代理obj
var a = new Proxy(obj,{
// 对o进行get方法
get:function(target,prop){
// 如果属性名在对象里面
if(prop in target){
// 返回原对象数组
return target[prop]
}
// 否则返回"没有"
else{
return "没有";
}
// return target[prop]
},
set:function(target,prop,value){
if(prop == "age"){
if(value > 200 || value < 0){
throw RangeError("年龄范围为0~200")
}
else{
target[prop] = value;
}
}
else{
target[prop] = value;
}
}
})
</script>
</body>
</html>
