<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
<script type="text/javascript">
//模拟异步
// setTimeout(function(){
// console.log("hello promise")
//})
//回调函数
new Promise((resolve, reject) => {
setTimeout(() => {
//成功时调用
resolve('成功')
//失败时调用
reject('失败')
}, 1000)
}).then((data) => {
//成功时的回调函数
console.log(data)
}).catch((err) => {
//失败时的回调函数
console.log(err)
})
//另外处理形式
//可以在then里面传入两个函数
new Promise((resolve, reject) => {
setTimeout(() => {
//成功时调用
resolve('成功')
//失败时调用
reject('失败')
}, 1000)
}).then((data) => {
//成功时的回调函数
console.log(data)
}, (err) => {
//失败时的回调函数
console.log(err)
})
//1.链式写法
new Promise((resolve, reject) => {
setTimeout(() => {
resolve('aaa')
}, 1000)
}).then((res) => {
console.log(res)
return new Promise((resolve, reject) => {
resolve(res + '111')
})
}).then((res) => {
console.log(res)
return new Promise((resolve, reject) => {
resolve(res + '222')
})
}).then((res) => {
console.log(res)
})
//2.链式写法的简写
new Promise((resolve, reject) => {
setTimeout(() => {
resolve('aaa')
}, 1000)
}).then((res) => {
console.log(res)
return Promise.resolve(res + '111')
}).then((res) => {
console.log(res)
//return Promise.resolve(res + '222')
//调用失败时的方法
//可以用抛出异常的方法,catch函数也可以捕获
//return Promise.reject('err message')
throw 'err message'
}).then((res) => {
console.log(res)
}).catch((err) => {
console.log(err)
})
//promise.all方法使用
//场景:有一个方法,需要两个网络请求返回值,缺一不可
Promise.all([
new Promise((resolve, reject) => {
setTimeout(() => {
resolve({
name: 'kobe',
age: 22
})
}, 1000)
}),
new Promise((resolve, reject) => {
setTimeout(() => {
resolve({
name: 'kaka',
age: 33
})
}, 2000)
})
]).then((results) => {
//results两次网络请求的返回值,会传到一个数组当中
console.log(results)
})
</script>
</html>