zoukankan      html  css  js  c++  java
  • 435 宏任务,微任务


    /* 
        运行循环 : 
        任务
        宏任务 : 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>
    
  • 相关阅读:
    js中new的本质
    js中真伪数组转换
    2 DC电参数测试 (1)
    1 开短路测试
    2月书单 《编码隐匿在计算机软硬件背后的语言》 21-25章
    2月书单 《编码隐匿在计算机软硬件背后的语言》 17-20章
    时间的掌控
    数码管的秘密
    会眨眼的小灯
    点亮一盏灯
  • 原文地址:https://www.cnblogs.com/jianjie/p/12632648.html
Copyright © 2011-2022 走看看