10.Promise函数
2020-05-21 本文已影响0人
web_jianshu
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
</head>
<body></body>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
<script>
// 假设:我一个页面有两个异步请求,第二个异步请求参数的时候,需要依赖第一个请求的返回值
// 希望两个请求都返回成功,然后再执行同一个回调函数
// 把异步操作包装在Promsie对象中,当Promise对象中 异步操作
// 成功后就执行resolve,失败执行reject
// 然后再返回Promise实例,调用then方法,就可以获取异步请求回来的数据
// $.get('http://127.0.0.1:3000/api/1', (res) => {
// $.get('http://127.0.0.1:3000/api/2', {msg: res}, (res) => {
// console.log(res);
// })
// })
// Promise
let p1 = () => {
return new Promise((resolve, reject) => {
$.post("http://127.0.0.1:5000/api/1", res => {
resolve(res);
});
});
};
// let p2 = msg => {
// return new Promise((resolve, reject) => {
// $.get("http://127.0.0.1:5000/api/2", { msg: msg }, res => {
// resolve(res);
// });
// });
// };
// p1()
// .then(res => {
// console.log(res);
// return p2(res);
// })
// .then(res => {
// console.log(res);
// });
// let pAll = Promise.all([p1(), p2(123)]); // 当p1和p2都异步调用成功(执行了resolve)
// pAll.then(res => {
// console.log(res);
// });
// // 只拿resolve结果 参数可以是字符串 可以是对象
// Promise.resolve(p1()).then(res => {
// console.log(res);
// });
// Promise.resolve('hello world').then((res) => {
// console.log(res);
// })
// // ===> new Promise((resolve, reject) => { resolve() })
</script>
</html>
Promise.resolve()与new Promise(r => r(v))
promise的使用场景
promise-api