关于异步的问题,一直很受关注,es7中的async...await也是针对异步问题的。

需求:我想使用promise,和async这两种方法,在一定时间之后输出一个‘hellow world’

使用promise:

function outWorld(v,ms){
return new Promise(resolve=>{
    setTimeout(()=>{resolve(v)},ms);
});
}
outWorld("hellow world ",5000).then(val=>{
  console.log(val)
})

使用async进行操作

值得说一句的是await后面通常是一个Promise对象

function pre(ms){
return new Promise(resolve=>{
setTimeout(resolve,ms);
});
};
async function outWorld (v,ms){
await pre(ms);
console.log(v);
}
outWorld("hellow world",5000);

另一个例子进一步理解async....await

function timeout(ms,va) {
return new Promise((resolve) => {
   console.log(va);
setTimeout(()=>{resolve(va);}, ms);
//setTimeout(reject, ms);
});
} async function asyncPrint(value, ms) {
let a= await timeout(ms,value);
console.log(a); //可以看出是自动执行了then方法(,await命令后面是一个 Promise 对象。如果不是,
//会被转成一个立即resolve的 Promise 对象。) console.log(value,);//await类似地与一个暂停函数位于其后面的函数都得暂停待其执行完
return value;//返回一条数据,(以Promis.resolove(value)的形式) }
//可以看出async最终也是返回一个promise,(只能return 了)
asyncPrint('hello world', ).then((data)=>{console.log(`我是async 的promise的回调函数"+${data}`);});

率先输出第一个hello world, 在五秒之后几乎同时输出其他的结果,【希望你能明白这句话的意义】

假如我有两个函数,a,b 还有一个c函数,c函数的执行必须依赖于a,b,,这就要求先执行a(),b(),你该怎么办???

聪明的孩子说,那就按顺序执行呀,,,a();b(),c();

如果所有的情况都是这么简单,我在这里瞎掰什么玩意???

一种情况:假如我的a();b()函数的执行是十分缓慢呢????例如你在使用echars的时候会遇到,,可能a,b还没执行完,程序就执行完了c();然后抱一堆的错,让人看着就烦............

现在有了prmoise,async,一切就是那么美丽了。。。。。。

准备好了,一大波知识点来袭

1)await:后面只能是一个Promise对象,即使不是,它会自动使用Promise.resolve(".....")进行转换成一个promise对象。。。

DEMO01
async function f(){
return await ; // 正常情况下,awit后面是一个promise对象,如果不是就会自动转化成一个promise
} f().then(v=>console.log(v));
DEMO02 
async function f2(){
return await Promise.resolve("出错le");
}
var v= f2();
console.log(v);
f2().then(data=>console.log(data))

2)一个async中可能会有多个await,,,,(只要一个await语句后面的 Promise 变为reject,那么整个async函数都会中断执行。)

 async function f(){
await Promise.reject("出错01");
await Promise.reject("出错了02");//不会执行
}

但是我还是想要执行怎么办????

async function f(){
await Promise.reject().catch(error=>{
console.log(error);
});
return await Promise.resolve("我要被打印出来,前面的错不是我的错")
}
f().then(r=>console.log(r););

3)async中的多个await是按顺序执行,只有前面的awit执行完之后,才执行下个await,当然在没有reject的情况下

l例如:

function n1(){
return new Promise(resolve=>{
setTimeout(()=>{
resolve();
console.log("n1");
},); });
} function n2(){
return new Promise(resolve=>{
setTimeout(()=>{
resolve();
console.log("n2");
},); });
}
function n3(){
return new Promise(resolve=>{
setTimeout(()=>{
resolve();
console.log("n3");
},);
});
}
async function nn (){
try{
let m1= await n1();
let m2= await n2();
let m3= await n3();
return m1+m2+m3;
}catch(e){
console.error(e);
}
}
nn().then((n)=>{console.log(n);});

他会在五秒之后输出n1,六秒之后输出n2,九秒之后输出n3,和结果3

很明显这几个await并没有相互依赖,这样的执行方式是很浪费的,现在想让他们同时执行

在解决问题之前,先说说我当时做这个demo的时候遇到的几个问题:

我忘记在每个promise中使用resolve(1);结果她就不能执行了,【希望你明白我在说什么】

我的意思是每个Promise最好给他一个状态

好了砸门解决问题办吧

使用Promise.all()方法

function n1(){
return new Promise(resolve=>{
setTimeout(()=>{
resolve();
console.log("n1");
},);
});
} function n2(){
return new Promise(resolve=>{
setTimeout(()=>{
resolve();
console.log("n2");
},); });
}
function n3(){
return new Promise(resolve=>{
setTimeout(()=>{
resolve();
console.log("n3");
},);
});
}
async function nn (){
try{
//let m1= await n1();
// let m2= await n2(); // let m3= await n3();
let [m1,m2,m3]=await Promise.all([n1(),n2(),n3()]);
return m1+m2+m3;
}catch(e){
console.error(e);
}
}
nn().then((n)=>{console.log(n);});

3)await命令只能用在async函数之中,如果用在普通函数,就会报错。

async function dbFuc(db) {
let docs = [{}, {}, {}]; // 报错
docs.forEach(function (doc) {
await db.post(doc);
});
}

正确做法:

async function dbFuc(db) {
let docs = [{}, {}, {}]; for (let doc of docs) {
await db.post(doc);
}
}
 继发执行。正确的写法是采用for循环。

如果确实希望多个请求并发执行,可以使用Promise.all方法配合数组的api  map()

async function dbFuc(db) {
let docs = [{}, {}, {}];
let promises = docs.map((doc) => db.post(doc)); let results = await Promise.all(promises);
console.log(results);
}

async远不止与此,这里我只将我学到的,

async的异步使用es7的更多相关文章

  1. Promise,Generator(生成器),async(异步)函数

    Promise 是什么 Promise是异步编程的一种解决方案.Promise对象表示了异步操作的最终状态(完成或失败)和返回的结果. 其实我们在jQuery的ajax中已经见识了部分Promise的 ...

  2. ASP.NET sync over async(异步中同步,什么鬼?)

    async/await 是我们在 ASP.NET 应用程序中,写异步代码最常用的两个关键字,使用它俩,我们不需要考虑太多背后的东西,比如异步的原理等等,如果你的 ASP.NET 应用程序是异步到底的, ...

  3. HTML5中script的async属性异步加载JS

    HTML5中script的async属性异步加载JS     HTML4.01为script标签定义了5个属性: charset 可选.指定src引入代码的字符集,大多数浏览器忽略该值.defer 可 ...

  4. spring boot中使用@Async实现异步调用任务

    本篇文章主要介绍了spring boot中使用@Async实现异步调用任务,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧 什么是“异步调用”? “异步调用”对应的是“同步 ...

  5. async/await异步处理demo

    async/await异步处理demo 下载地址: async/await异步处理demo

  6. spring boot 学习(十一)使用@Async实现异步调用

    使用@Async实现异步调用 什么是”异步调用”与”同步调用” “同步调用”就是程序按照一定的顺序依次执行,,每一行程序代码必须等上一行代码执行完毕才能执行:”异步调用”则是只要上一行代码执行,无需等 ...

  7. 【转】C# Async/Await 异步编程中的最佳做法

    Async/Await 异步编程中的最佳做法 Stephen Cleary 近日来,涌现了许多关于 Microsoft .NET Framework 4.5 中新增了对 async 和 await 支 ...

  8. 将 async/await 异步代码转换为安全的不会死锁的同步代码

    在 async/await 异步模型(即 TAP Task-based Asynchronous Pattern)出现以前,有大量的同步代码存在于代码库中,以至于这些代码全部迁移到 async/awa ...

  9. Spring @Async开启异步任务

    1. 开启异步 @SpringBootApplication @EnableAsync //开启异步任务 public class Application { @Bean(name="pro ...

随机推荐

  1. SQLServer中的执行计划缓存由于长时间缓存对性能造成的干扰

    本文出处:http://www.cnblogs.com/wy123/p/7190785.html (保留出处并非什么原创作品权利,本人拙作还远远达不到,仅仅是为了链接到原文,因为后续对可能存在的一些错 ...

  2. Spark的误解-不仅spark是内存计算,hadoop也是内存计算

    市面上有一些初学者的误解,他们拿spark和hadoop比较时就会说,Spark是内存计算,内存计算是spark的特性.请问在计算机领域,mysql,redis,ssh框架等等他们不是内存计算吗?依据 ...

  3. Maven基础

    Maven基础 maven核心内容:依赖管理. Maven是Apache组织的开源项目,是项目构建工具.用来管理jar包之间的相互依赖关系 Maven是一个项目构建和管理的工具,提供了帮助管理,构建, ...

  4. C++第二篇--访问控制

    C++第二篇--访问控制 1. 引入 上一篇博文中从结构体引到了类,类当中不仅有数据成员还有一些函数,这些函数被称为成员函数.今天介绍新的内容,类当中的访问控制. 2. 访问控制 当你不添加任何声明, ...

  5. 解决IE8下不支持document.getElementsByClassName的方法

    在代码前面加如下代码: if (!document.getElementsByClassName) { document.getElementsByClassName = function (clas ...

  6. hihocoder_1014: Trie树(Trie树模板题)

    题目链接 #include<bits/stdc++.h> using namespace std; ; struct T { int num; T* next[]; T() { num=; ...

  7. pc端的企业网站(IT修真院test9)详解一个响应式完成的pc端项目

    一:引入bootstrap框架 昨天一直被bootstrap栅格系统折磨. why? 我本来想一边码字,一边学习栅格布局的.but不成功.这时我头脑已经昏了. 下午,我查看了bootstrap的官网, ...

  8. Selenium对浏览器支持的版本

    最新的selenium与几种常用浏览器的版本兼容情况: selenium 3.4.0 : Mozilla GeckoDriver 0.18  --  Firefox 53 - 56 Google Ch ...

  9. 强连通分量tarjan缩点——POJ2186 Popular Cows

    这里的Tarjan是基于DFS,用于求有向图的强联通分量. 运用了一个点dfn时间戳和low的关系巧妙地判断出一个强联通分量,从而实现一次DFS即可求出所有的强联通分量. §有向图中, u可达v不一定 ...

  10. ICMP--ping--Traceroute

    ICMP经常被认为是IP层的一个组成部分.它传递差错报文以及其他需要注意的信息. ICMP报文通常被IP层或更高层协议TCP或UDP使用. 一些ICMP报文把差错报文返回给用户进程   ICMP报文是 ...