ECMAScript6——异步操作之Promise
Promise对象的参数为一个回调函数,这个回调函数有两个参数,分别是resolve, reject(这俩参数的名字可任取),resolve,reject分别表示异步操作执行成功后的回调函数和异步操作执行失败后的回调函数 。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
</style>
</head>
<body>
<script>
const imgs = [
'http://img1.3lian.com/2015/a1/14/d/151.jpg',
'http://photos.tuchong.com/110168/f/2034247.jpg',
'http://img1.3lian.com/2015/a1/129/d/193.jpg'
];
/* 第一步:实例化Promise对象
该对象的参数为一个回调函数,这个回调函数有两个参数,分别是resolve, reject(这俩参数的名字可任取),resolve,reject分别表示异步操作执行成功后的回调函数和异步操作执行失败后的回调函数
*/
const p = new Promise(function (resolve, reject){
const img = new Image(); // 声明一个image
img.src = imgs[1];
img.onload = function (){ // 指当图片加载(onload)成功时,执行resolve函数
resolve(this); // resolve(this)指将图片本身当做参数传给resolve
};
img.onerror = function (){ // 指当图片加载失败时,执行reject函数
reject(new Error('图片加载失败'));
};
});
/* 第二步:Promise对象处理方法
Promise对象有两个原型方法:
Promise.prototype.then()
Promise.prototype.catch()
一旦Promise对象创建完成,就可以调用上面两个方法
*/
// then()方法,接收连个参数,第一个参数为执行成功的回调函数,第二个参数为执行失败的回调函数(但是,一般后面的回调函数不常用,通常用catch()来捕获异常)
p.then(function (img) { // img就是上面resolve(this)中的this传过来的
document.body.appendChild(img)
}).catch(function (err) { // catch()来捕获异常,若图片加载失败,则执行之
console.log(err)
})
</script>
</body>
</html>
ECMAScript6——异步操作之Promise的更多相关文章
- 异步操作之 Promise 和 Async await 用法进阶
ES6 提供的 Promise 方法和 ES7 提供的 Async/Await 语法糖都可以更好解决多层回调问题, 详细用法可参考:https://www.cnblogs.com/cckui/p/99 ...
- ES6异步操作之Promise
一直以来觉得异步操作在我心头像一团迷雾,可是它重要到我们非学不可,那就把它的面纱解开吧. ES6 诞生以前,异步编程的方法,大概有下面四种. 回调函数 事件监听 发布/订阅 Promise 对象 异步 ...
- ES6——异步操作之Promise
基本概念: Promise : 是 ES6 中新增的异步编程解决方案,提现在代码中他是一个对象 可以通过Promise构造函数来实例化. -new Promise(cb) ===> 实例的基本使 ...
- JS异步操作之promise发送短信验证码.html
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta cont ...
- javascript中的异步操作以及Promise和异步的关系
https://segmentfault.com/a/1190000004322358 Promise是异步编程的一种解决方案,比传统的解决方案--回调函数和事件--更合理和强大 https://se ...
- Promise异步操作
Promise是es6中新增加的类(new Promise),目的为了管理JS中异步编程,也叫“Promise”设计模式 Promise用来解决异步问题.本身是同步的,只是用来管理异步编程的一种模式 ...
- 简单理解ECMAScript2015中的Promise
ECMAScript6中新增了Promise对象, 所谓Promise对象,即代表着一个还未完成,但将来某时会完成的操作(通常是异步操作).使用Promise对象,我们就可以避免陷入函数层层嵌套的‘回 ...
- promise异步编程的原理
一.起源 JavaScript中的异步由来已久,不论是定时函数,事件处理函数还是ajax异步加载都是异步编程的一种形式,我们现在以nodejs中异步读取文件为例来编写一个传统意义的异步函数: var ...
- 浅谈Promise
学习过JavaScript的人都知道,JavaScript是单线程作业,这样会有一个很大的缺陷,所有的Ajax,浏览器事件等,都是通过异步去完成.所谓的同步和异步最大的区别无非就是在于同步会阻塞后续代 ...
随机推荐
- Oracle EBS 自治事务
自治事务程序主要是自主性,那就是,独立于主要的事务.之所以独立,或者提交之后会影响其他事务处理,本质在于它本身符合编译指令的规则,也就是说它属于在编译阶段就执行的指令,而不是在运行阶段执行的. 当自治 ...
- 关于Apache连接数限制的设置
昨天晚上收到监视团队的电话,说web服务器连不上.(作为DBA,这貌似超出了我的工作范畴啊...) 于是马上VPN连上服务器,发现网络负载均衡下的两台Apache服务器都没有响应,而服务器OS层面上正 ...
- EntityFramework Code-First 简易教程(三)-------数据库初始化
现在我们来学习,当数据库初始化的时候,Code First怎样设置数据库的名字. 下面的图显示了数据库初始化的工作流程,根据传入给context基类的构造函数的参数来初始化: 根据上面的图,conte ...
- python 多进程和多线程的区别
了解线程和进程 进程 程序:磁盘上的可执行二进制文件,并无运行状态. 进程:就是一个正在运行的任务实例(存活在内存里). 获取当前电脑的CPU核心数: pip install psutil >& ...
- Linux uniq命令详解
uniq常见命令参数 用法:uniq [选项]... [文件] 从输入文件或者标准输入中筛选相邻的匹配行并写入到输出文件或标准输出. 不附加任何选项时匹配行将在首次出现处被合并. 长选项必须使用的参数 ...
- 关于服务器端的Json文件的接收,踩了一早上的坑的问题
JSON文件的发送和接收 服务器端接收的JSON文件也是String型的文件,因此不可以直接写成如下的格式,此错误格式下无法找到发送的{}内的数据,服务器会报错提示无法找到你需要的类型数据,也就是根本 ...
- linux结束程序内存不会马上释放的解决方法
Linux下频繁读写文件时,内存资源被耗尽,当程序结束后,内存不会释放需要清除缓存.Linux缓存有dentry,buffer cache,page cache. 注:Dentry用来加速文件路径 ...
- MySQL数据库常用操作和技巧
MySQL数据库可以说是DBA们最常见和常用的数据库之一,MySQL的广泛应用,也使更多的人加入到学习它的行列之中.下面是老MySQL DBA总结的MySQL数据库最常见和最常使用的一些经验和技巧,分 ...
- ArcMap 导入Excel坐标数据
1 准备Excel坐标数据集合 2 ArcMap加入Excel数据 将excel文件放入arcmap工作区的物理路径下 在工作区的根图层上点键,选择添加数据,找到excel文件并选择相应的工作薄 ...
- shp转oracle spatial
2010年12月1日 终于搞定了shp到oracle spatial,说下步骤和感受吧! 1 XP系统:转换工具的下载(shp2sdo.exe ):下载后把此文件复制到PATH变量包含的目录下(E: ...