ES6学习笔记(四):异步操作
Promise
Promise三种状态
pending、resolved、rejected
使用语法
var promis = new Promise(function(resolve,reject){
$.ajax({
url:'/api/something.json',
method:'get',
datatype:'json',
success:(res) =>{
resolve(res)
},
error:(err)=>{
reject(err)
}
})
})
promis.then(function(res){
console.log(res)
}).catch(function(err){
console.log(err)
});
Promise.prototype.then()
链式调用,状态变为resolve
如果把下一步想要的东西return出去,即可让下一个then使用
var promise = new Promise(function(resolve,reject){
$.ajax({
url:'/api/poisearch.json',
method:'get',
datatype:'json',
success:(res) =>{
resolve(res)
},
error:(err)=>{
reject(err)
}
})
})
promise.then(function(res){
return res.data
}).then(function(data){
return data.result;
}).then(function(result){
console.log(result)
});
上面的代码还可以借用箭头函数简写成,极大提升了代码的简洁性和可读性
promise.then(res => res.data)
.then(data => data.result)
.then(result => console.log(result));
Promise.prototype.catch()
如果异步操作抛出错误,状态就会变为Rejected,就会调用catch方法指定的回调函数,处理这个错误。
- 另外,then方法指定的回调函数,如果运行中抛出错误,也会被catch方法捕获。
- 如果Promise状态已经变成Resolved,再抛出错误是无效的。
- catch方法返回的还是一个Promise对象,因此后面还可以接着调用then方法。
Promise.all()
多个Promise实例,包装成1个,有点类似Array.prototype.every()
用法:
var p = Promise.all([p1, p2, p3]);
- 只有p1、p2、p3的状态都变成fulfilled,p的状态才会变成fulfilled,此时p1、p2、p3的返回值组成一个数组,传递给p的回调函数。
- 只要p1、p2、p3之中有一个被rejected,p的状态就变成rejected,此时第一个被reject的实例的返回值,会传递给p的回调函数。
Promise.race()
多个Promise实例,包装成1个,有点类似Array.prototype.some()
- p1、p2、p3其中一个状态变成fulfilled,p的状态就会变成fulfilled
- 那个率先改变的Promise实例的返回值,就传递给p的回调函数。
done()、finally()
ES6学习笔记(四):异步操作的更多相关文章
- ES6学习笔记<四> default、rest、Multi-line Strings
default 参数默认值 在实际开发 有时需要给一些参数默认值. 在ES6之前一般都这么处理参数默认值 function add(val_1,val_2){ val_1 = val_1 || 10; ...
- ES6学习笔记四:Proxy与Reflect
一:Proxy 代理. ES6把代理模式做成了一个类,直接传入被代理对象.代理函数,即可创建一个代理对象,然后我们使用代理对象进行方法调用,即可调用被包装过的方法: 1)创建 var proxy = ...
- ES6学习笔记四(类和对象)
{ // 构造函数和实例 class Parent{ constructor(name='mukewan'){ this.name=name; } } let v_parent=new Parent( ...
- ES6学习笔记<五> Module的操作——import、export、as
import export 这两个家伙对应的就是es6自己的 module功能. 我们之前写的Javascript一直都没有模块化的体系,无法将一个庞大的js工程拆分成一个个功能相对独立但相互依赖的小 ...
- ES6学习笔记<三> 生成器函数与yield
为什么要把这个内容拿出来单独做一篇学习笔记? 生成器函数比较重要,相对不是很容易理解,单独做一篇笔记详细聊一聊生成器函数. 标题为什么是生成器函数与yield? 生成器函数类似其他服务器端语音中的接口 ...
- ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring
接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...
- ES6学习笔记<一> let const class extends super
学习参考地址1 学习参考地址2 ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015:也 ...
- JS&ES6学习笔记(持续更新)
ES6学习笔记(2019.7.29) 目录 ES6学习笔记(2019.7.29) let和const let let 基本用法 let 不存在变量提升 暂时性死区 不允许重复声明 块级作用域 级作用域 ...
- C#可扩展编程之MEF学习笔记(四):见证奇迹的时刻
前面三篇讲了MEF的基础和基本到导入导出方法,下面就是见证MEF真正魅力所在的时刻.如果没有看过前面的文章,请到我的博客首页查看. 前面我们都是在一个项目中写了一个类来测试的,但实际开发中,我们往往要 ...
- IOS学习笔记(四)之UITextField和UITextView控件学习
IOS学习笔记(四)之UITextField和UITextView控件学习(博客地址:http://blog.csdn.net/developer_jiangqq) Author:hmjiangqq ...
随机推荐
- JS对表格排序(支持对序号,数字,字母,日期)
JS对表格排序(支持对序号,数字,字母,日期) 前不久看到淘宝组件有"对表格排序的插件" 如想要看 可以看这个地址 http://gallery.kissyui.com/KSort ...
- redis cluster应用连接(password)
application.properties 集群配置 application.properties #各Redis节点信息spring.redis.cluster.nodes=47.96.*.*:6 ...
- OS X 10.11无法安装cocoapods的解决办法
前两天在给OS X 10.11 安装cocoapods时,命令行总是提示"Operation not permitted",我不管是用root用户安装还是查阅网上过去的资料都安装不 ...
- .NetCore Session.Redis (转载)
首先创建ASP.NET CORE Web项目,然后按如下顺序操作. 1.添加nuget程序包: Microsoft.AspNetCore.Session; Microsoft.AspNetCore.D ...
- js中常见继承方式
1.原型模式 function Father(){ this.property = true; } Father.prototype.getValue = function(){ return thi ...
- Spark笔记(一):错误总结
1.转义字符: 常见的replaceAll,split,mkstring中涉及到特殊字符的都要加上转义字符,比如str.split("\\|"),str.replaceAll(&q ...
- vue eslint报错解决办法
若提示入下图时,在build / webpack.base.conf.js中, 找到 // const createLintingRule = () => ({// test: /\.(js|v ...
- WPF自定义控件的自定义属性绑定后不更新问题
原文:WPF自定义控件的自定义属性绑定后不更新问题 需要在绑定时设置属性变更触发 UpdateSourceTrigger=PropertyChanged 例如: <Border CornerRa ...
- asp.net mvc2+nhibernate实体类映射问题之“尝试创建Controller类型的控制器时出错请确保控制器具有无参数公共构造函数”
程序出了问题,解决后发现如此简单,犯的错误是如此的低级啊,特此记录! 运行程序总是在浏览器中看到一片空白,什么也没有,用application_error跟踪发现抓出一个这样的异常 然后浏览器中就是这 ...
- 初次接触Dynamics 365
最近项目上需要用到微软的Dynamics 365 这个产品,Bing上搜索了一下,看了很多大佬在博客上分享了使用Dynamics 365的经验,简单了解了Dynamics 365 是什么,也有很多大企 ...