<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div>es6</div>
<script type="text/javascript">
// what是Promise：Promise是ES6中提供的一个异步编程的解决方案，Promise本身是一个构造函数 typeof Promise // function
// Promise对象代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）
// 异步操作成功，Promise对象传回一个值，状态变为resolved
// 异步操作失败，Promise对象抛出一个错误，状态变为rejected
/*
一旦Promise状态改变，就不会再有变化，任何时候都可以得到这个结果。Promise对象的状态改变，只有两种可能：从pending变为fulfilled 或者 从pending变为rejected。
只要这两种情况发生，状态就不会再变了，会一直保持这个结果，这时就称为 resolved（已定型）。
如果改变已经发生了，你再对Promise对象添加回调函数，也会立即得到这个结果。这与事件（Event）不同，事件的特点是，如果你错过了它，再去监听，是得不到结果的;
Promise优点：
在处理异步程序时，将异步操作队列化，按照期望的顺序执行，返回符合预期的结果，这样即使是多重异步操作，也可以方便的使用Promise进行链式调用
Promise缺点：
1、无法取消Promise，一旦新建它就会立即执行，无法中途取消。
2、如果不设置回调函数，Promise内部抛出的错误，不会反应到外部。
3、当处于pending状态时，无法得知目前进展到哪一个阶段（刚刚开始还是即将完成）
*/
// 基本使用
const promise = new Promise(function(resolve, reject) {
console.log('Promise++++++++111111');
// 执行一个异步操作
setTimeout(() => {
console.log('Promise+setTimeout：最后输出')
}, 3000)
resolve('成功'); // 状态由等待变为成功，传的参数作为then函数中成功函数的实参
// reject('失败'); // 状态由等待变为失败，传的参数作为then函数中失败函数的实参
console.log('Promise++++++++222222');
})
// then中有2个参数，第一个参数是状态变为成功后应该执行的回调函数，第二个参数是状态变为失败后应该执行的回调函数。
promise.then(res => {
console.log('Promise++++++++444444');
console.log('结果1：' + res) // 结果1：成功（如果是reject('失败')则打印结果是：失败）
}, err => {
console.log('错误1：' + err)
}).then(res => {
console.log('结果2：' + res) // 结果2：undefined
}, err => {
console.log('错误2：' + err)
}).finally(() => {
console.log('结束') // finally方法，finally方法用于指定不管 Promise 对象最后状态如何，都会执行的操作
})
console.log('333333');
/*总结：上述依次打印
Promise++++++++111111
Promise++++++++222222
333333
Promise++++++++444444
结果1：成功
结果2：undefined
结束
Promise+setTimeout：最后输出
*/
/*==========================Promise.all()方法=================================*/
// 多个 Promise
const p1 = new Promise((resolve, reject) => {
setTimeout(function() {
console.log('p1')
resolve('p1')
}, 3000)
})
const p2 = new Promise((resolve, reject) => {
setTimeout(function() {
console.log('p2')
resolve('p2')
}, 5000)
})
// 多个异步操作
Promise.all([p1, p2]).then((res) => {
console.log('成功:' + res) // 成功:p1,p2
})
/*==========================Promise.race()方法=================================*/
// race的用法， 语法和all()一样，但是返回值有所不同，race根据传入的多个Promise实例，只要有一个实例resolve或者reject，就只返回该结果，其他实例不再执行，
// 也就是说多个异步程序，只返回响应最快的那个异步程序，不论成功或者失败，就把最快响应的返回值返回，后面的异步程序不再执行
const p4 = new Promise((resolve, reject) => {
setTimeout(function() {
console.log('p4')
resolve('p4')
}, 9000)
})
const p5 = new Promise((resolve, reject) => {
setTimeout(function() {
console.log('p5')
reject('p5')
}, 6000)
})
Promise.race([p4, p5]).then().catch(res => {
console.log('失败：' + res) // p5 失败：p5 p4
})
/*==========================Promise.resolve()方法=================================*/
// Promise的resolve方法，用于将非Promise类型的对象，转为Promise对象，这样就可以调用Promise原型对象上的方法了
// 没有参数，如果没有参数，这直接返回一个resolved状态的Promise对象
const p7 = Promise.resolve()
// 相当于
const p8 = new Promise(resolve => {
resolve(undefined)
})
p7.then(res => {
console.log('p7-resolve()没有参数时候等价与:' + res) // 输出 undefined
})
// 参数是一个不具有then方法的对象，或者是一个基数数据类型的值，则Promise.resolve方法返回一个新的 Promise 对象，状态为resolved，值为指定值
const p9 = Promise.resolve('123')
p9.then(res => {
console.log('p9-resolve()有参数时候等价与:' + res) // 输出 '123'
})
// 参数是一个具有then方法的对象，Promise.resolve方法会将这个对象转为 Promise 对象，然后就立即执行thenable对象的then方法
const obj = {
then: function(resolve, reject) {
resolve(100)
}
}
const p10 = Promise.resolve(obj)
p10.then(res => {
console.log(res) // 100
})
// 特别的：参数是一个Promise对象，那么将原封不动的返回这个Promise对象
// reject与resolve方法基本类似，但是要注意一种情况，就是当参数是一个thenable对象时
const thenable = {
then(resolve, reject) {
reject('出错了');
}
};
Promise.reject(thenable)
.catch(e => {
console.log(e === thenable) // true
})
</script>
</body>
</html>