一次性掌握ES6/ES7异步处理

假定一个场景，等女朋友睡起来出去逛街，超过5s就不等了，自己打游戏了 ...

ES6 Promise 处理方式

promise 写法
promise链式调用方法，只有当异步处理成功后回到用.then(data => {}) 拿到异步处理成功后的数据
异步处理出错时，会调用.then(err => {}) 获取到异常
也就是说.then( data => {}, err => {}) 方法里有两个回调函数作为参数
或者还有第二种写法.then(data => {}).catch(err => {})


function waiting (ms) {return new Promise ( (resolve, reject) => {if(ms > 5000) {reject('long time')} else {setTimeout(() => {resolve(ms);}, ms)}})
}function main () {waiting(3000).then( success => {console.log(success);}, err => {console.log(err)})
}// 或者
function main() {waiting(3000).then(data => {console.log(data)}).catch(err => {console.log(err);})
}

ES7 Async/Await 处理方式

async 表明这个函数里面有异步操作，await总是写在async声明的函数中的
遇到awit，函数就会停止执行，等待异步操作结束，再执行后面的语句
异步操作获取的结果即为resolve回调函数的参数返回
异常即通过reject回调函数参数获取
注意，捕获异常时，我们往往需要在async函数体中使用 try catch 方式获取异常


let sleep = ms => {return new Promise ( (resolve, reject) => {if(ms > 5000) {reject('long time')} else {setTimeout(function() {resolve(ms)} ,ms)}})
}let play = (ms) => {console.log(`I wait you ${ms} s`)
}let main = async () => {try{let result = await sleep(3000);play(result)} catch (err) {throw err}
}

注意：await等的是什么?是promise是承诺返回的是resolve回调函数里面的数据

更多用法可以参考：Promise && Async/Await

一次性掌握ES6/ES7异步处理相关推荐

ES6/7 异步编程学习笔记
前言在ES6的异步函数出现之前,Js实现异步编程只有settimeout.事件监听.回调函数等几种方法 settTmeout 这种方法常用于定时器与动画的功能,因为其本质上其实是浏览器的WebAPI ...
es6 对象中是否有键值_干货| ES6/ES7好玩实用的特性介绍
本文介绍一些ES6/ES7好玩实用又简单的特性,或许对写代码的效率也有一定帮助噢. ES6/ES7的出现已经有一段时间了,里面的一些新特性你们是否了解呢?本骚年将结合自身的一些使用经历介绍一些简单实用 ...
es6,es7,webpack 和 babel（爱前端）
npm install -g cnpm --registry=https://registry.npm.taobao.org 默认安装位置: 一 ES6, ES7 简介和调试方法 1.1 简介 ECM ...
Sencha Cmd 6/7 让你的 ExtJS6/7 项目使用 ES6/ES7/ES8 语法规范
原文链接:https://blog.csdn.net/lovelyelfpop/article/details/78528107 Sencha Cmd 6.5 最大的变化: 支持动态加载包(dynam ...
ES6/ES7常用语法记录
记录比较常用的ES6/ES7语法一.检测是否为数组 1.instanceof 方法 const arr = new Array() // const arr = [] arr instanceod ...
【复习资料】ES6/ES7/ES8/ES9资料整理(个人整理)
一.介绍现在的网络上已经有各样关于 ECMAScript 规范介绍和分析的文章,而我自己重新学习一遍这些规范,整理出这么一份笔记,比较精简,主要内容涵盖ES6.ES7.ES8.ES9,后续会增加面试 ...
es6,es7,es8语法总结
ES6 1. var let const let,const具有块级作用域,不具有变量提升 const 用于不能被重新赋值的变量 2. 箭头函数我们经常要给回调函数给一个父级的this 常用办法就是 ...
ES6, ES7, ES8, ES9 以及 ES10 新特征
目录 1. ES6 新特征 (2015) 1.1 module 1.1.1 export 1.1.2 import 1.2 Arrow function (箭头函数) 1.2.1 箭头函数结构 1. ...
ES6/ES7/ES8新特性汇总
ES6起各个版本的新特性汇总 ES全称ECMAScript,ECMAScript是ECMA制定的标准化脚本语言.目前JavaScript使用的ECMAScript版本为ECMA-417.关于ECMA的 ...

一次性掌握ES6/ES7异步处理

一次性掌握ES6/ES7异步处理

ES6 Promise 处理方式

ES7 Async/Await 处理方式

注意：await等的是什么?是promise是承诺返回的是resolve回调函数里面的数据

一次性掌握ES6/ES7异步处理相关推荐

最新文章

热门文章

一次性掌握ES6/ES7异步处理

一次性掌握ES6/ES7异步处理

ES6 Promise 处理方式

ES7 Async/Await 处理方式

注意：await等的是什么?是promise是承诺 返回的是resolve回调函数里面的数据

一次性掌握ES6/ES7异步处理相关推荐

最新文章

热门文章

注意：await等的是什么?是promise是承诺返回的是resolve回调函数里面的数据