/*
运行循环 :
任务
宏任务 : script 、timeout
微任务 : promise
先执行宏任务, 再执行微任务
宏任务 微任务
第一圈: script promise(then)
第二圈: setTimeout
*/
console.log('log1') // 宏任务 1
setTimeout(() => {
console.log('timeout') // 下一次事件循环宏任务 【先放到消息队列中。】
}, 0)
new Promise((resolve, reject) => {
console.log('promise1') // 宏任务 2
resolve()
}).then(res => {
console.log('then1') // 微任务 5 【去排队】
})
new Promise((resolve, reject) => {
console.log('promise2') // 宏任务 3
resolve()
}).then(res => {
console.log('then2') // 微任务 6
})
console.log('log2') // 宏任务4
/* log1
promise1
promise2
log2
then1
then2
timeout
*/
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<!--
promise 封装一个ajax
-->
<script>
// 我们的封装promise
function fetch(options) {
const p = new Promise((resolve, reject) => {
$.ajax({
// 接口地址
url: options.url,
// 参数
data: options.data || {},
// 请求方式
type: options.type || 'GET',
// 数据类型
dataType: 'json',
// 成功回调
success: resolve,
// 失败回调
error: reject
})
})
// 返回
return p
}
// 使用
fetch({
url: '...........'
}).then(res => {
// .....
})
// const p = new Promise( (resolve,reject)=> {
// $.ajax({
// url : '',
// dataType :'json',
// data : {}
// })
// } )
</script>
</body>
</html>
