JavaScript的网络请求是异步的,即网络请求不会阻塞当前 js 代码的继续执行,而是通过回调的方式,在网络请求的代码块中注入回调函数,当网络请求完成,会触发相应的事件,通过触发事件来执行注册的回调函数。回调的执行时间是不确定的,因此会影响程序的执行逻辑,另一方面,如果回调依赖过多,或导致很深的回调嵌套,使代码的可读性和可维护性降低。

  async await 是 es7 中的新语法,基于 promise,使异步调用扁平化。

  async 用于申明一个 function 是异步的,而 await 用于等待一个异步方法异步执行完成。

 async function asyncFunctionName(){

     const response =await fetch(url,options);

     const result =await response.text();

     return JSON.parse( result );
}

  asyncFunction 返回的返回值会通过 Promise.resolve()封装成 Promise 对象,通过 Promise.then()来获取return 的返回值。

  await 等待的是一个实际返回值,同时await 不仅仅用于等待 Promise对象,它可以用于等待任何表达式的返回,因此await后面实际是可以接普通函数的调用或者直接量的。如果await 等到的不是一个promise对象,那await 表达式后面的运算结果就是它等到的值;如果await 等到的是一个promise对象,await 就会阻塞当前 js 的继续执行,等着 promise 对象 reslove,得到 resolve 的值,作为await 表达式的运算结果。

  因为await 会阻塞代码的运行,所以await 必须放在async 函数体中,而async 函数的调用不会造成阻塞,它内部所有的阻塞都被封装在一个 promise 对象中异步执行。

  async await的优势对比promise在于处理then链。在async函数体中,可以把对异步返回值得处理程序放在 await 后面,程序会依次执行,可以像写同步代码一样写异步回调。

  注意点:await 等待的promise 对象,运行时可能会reject ,所以最好将await 放在 try{ } catch 代码块中。

  

 async ()=>{
try{
const response = await felch(url,options);
}catch(err=>{
console.log(err)
})
} // 对比 promise 链式调用 promise.then().catch()

async await 使用笔记的更多相关文章

  1. C# async await 学习笔记2

    C# async await 学习笔记1(http://www.cnblogs.com/siso/p/3691059.html) 提到了ThreadId是一样的,突然想到在WinForm中,非UI线程 ...

  2. async/await学习笔记

    async/await 的目的是简化使用 promises 的写法.     让我们来看看下面的例子: // 一个标准的 JavaScript 函数 function getNumber1() { r ...

  3. C# async await 学习笔记1

    由于我的开发工具为vs.net 2010(.net 4.0),需先做以下两步才能进行: 1.下载并安装Async CTP (http://www.microsoft.com/en-us/downloa ...

  4. C#线程学习笔记九:async & await入门二

    一.异步方法返回类型 只能返回3种类型(void.Task和Task<T>). 1.1.void返回类型:调用方法执行异步方法,但又不需要做进一步的交互. class Program { ...

  5. angular2 学习笔记 ( Rxjs, Promise, Async/Await 的区别 )

    Promise 是 ES 6 Async/Await 是 ES 7 Rxjs 是一个 js 库 在使用 angular 时,你会经常看见这 3 个东西. 它们都和异步编程有关,有些情况下你会觉得用它们 ...

  6. 【学习笔记】JS经典异步操作,从闭包到async/await

    参考文献:王仕军——知乎专栏前端周刊 感谢作者的热心总结,本文在理解的基础上,根据自己能力水平作了一点小小的修改,在加深自己印象的同时也希望能和各位共同进步... 1. 异步与for循环 抛出一个问题 ...

  7. 【学习笔记】深入理解async/await

    参考资料:理解javaScript中的async/await,感谢原文作者的总结,本文在理解的基础上做了一点小小的修改,主要为了加深自己的知识点掌握 学完了Promise,我们知道可以用then链来解 ...

  8. C#线程学习笔记十:async & await入门三

    一.Task.Yield Task.Yield简单来说就是创建时就已经完成的Task,或者说执行时间为0的Task,或者说是空任务,也就是在创建时就将Task的IsCompeted值设置为0. 我们知 ...

  9. C#线程学习笔记八:async & await入门一

    一.涉及内容 async & await是C# 5.0引入的,控制台输出所使用的$符号(拼接字符串)是C# 6.0引入的,其功能类似于string.Format()方法. 二.多线程.异步.同 ...

随机推荐

  1. 关闭eclipse自动弹出console功能

    使用eclipse时经常会用到最大化窗口,而如果此时是开着tomcat等服务的话,一段后台有打印什么东西出来都会自己弹出 console挺烦人的.可以使用以下操作关闭这个功能. Preferences ...

  2. ZOJ 3787 Access System 水

    LINK:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3787 思路:结构体 时间转化为秒记录下最小并且排序就好了 /** ...

  3. LightOJ 1244 - Tiles 猜递推+矩阵快速幂

    http://www.lightoj.com/volume_showproblem.php?problem=1244 题意:给出六种积木,不能旋转,翻转,问填充2XN的格子有几种方法.\(N < ...

  4. 【BZOJ】3992: [SDOI2015]序列统计 NTT+生成函数

    [题意]给定一个[0,m-1]范围内的数字集合S,从中选择n个数字(可重复)构成序列.给定x,求序列所有数字乘积%m后为x的序列方案数%1004535809.1<=n<=10^9,3< ...

  5. MongoDB之python简单交互(三)

    python连接mongodb有多种orm,主流的有pymongo和mongoengine. pymongo 安装相关模块 pip install pymongo pymongo操作 主要对象 Mon ...

  6. 144.Binary Tree Preorder Traversal---二叉树先序、中序非递归遍历

    题目链接 题目大意:返回二叉树的先序遍历list.中序见94,后序见145. 法一:普通递归遍历,只是这里多了一个list数组,所以分成了两个函数.代码如下(耗时1ms): public List&l ...

  7. Python 类的名称空间和组合

    一.Python类的名称空间 class Student(object): School = '北京大学' def __init__(self): pass stu1 = Student() stu1 ...

  8. Guava cache功能简介(转)

    原文链接:http://ifeve.com/google-guava-cachesexplained/ 范例 LoadingCache<Key, Graph> graphs = Cache ...

  9. JSP基础与提高(一).md

    JSP基础 JSP的由来 1.1. 为什么有JSP规范 Servlet技术产生以后,在使用过程中存在一个很大的问题,即为了表现页面的效果而需要输出大量的HTML标签,这些标签在Servlet中表现为一 ...

  10. ireport报表,打印时,报表加载失败的解决方法

    1.报表加载失败图示 2.解决方法 原创作者:DSHORE 作者主页:http://www.cnblogs.com/dshore123/ 原文出自:http://www.cnblogs.com/dsh ...