Promise

Promise是异步编程的一种解决方案,简单来说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。

语法上讲,Promise是一个对象,从它可以获取异步操作的消息。
Promise的两个特点:
(1)对象的状态不受外界影响。Promise对象代表一个异步操作,有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。
(2)一旦状态改变,就不会改变,任何时候都可以得到这个结果。Promise对象的状态改变,只有两种可能:从pending变为fulfilled和从pending变为rejected。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果,这时就称为 resolved(已定型)。
一、Promise基本用法:
1、Promise实例:
Promise构造函数接受一个函数作为参数,该函数的两个函数分别是resolve和reject

1
2
3
4
5
6
7
8
$ const promise = new Promise(function(resolve,reject){
// ... some code
if(/*异步操作成功*/){
resolve(value);
}else{
reject(error);
}
});

Promise实例生成后,可以用 then方法分别指定resolved状态和rejected状态的回调函数。

1
2
3
4
5
$ promise.then(function(value){
//success
},function(error){
//failure
});

二、使用Promise分别获取图片的宽高
new Promise实例,而且要return,new Promise时要传入函数,函数有resolve reject两个参数,成功时执行resolve()、失败时执行reject()、
then监听结果

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
$ function loadImg(){
const promise = new Promise(function(resolve,reject){
var img = document.createElement('img')
img.onload = function(){
resolve(img)
}
img.onerror(){
reject()
}
img.src = src
})
return promise
}
var src = 'https://www.imooc.com/static/img/index/logo.png'
var result = loadImg(src)
//获取图片的宽度
result.then(function(img){
console.log(img.width)
},function(){
console.log('failed')
})
//获取图片的高度
result.then(function(img){
console.log(img.height)
},function(){
console.log('failed')
})
文章目录
本站访客数人次