JS基础-异步和单线程

JS基础-异步和单线程

异步

1.同步和异步

1. 同步：停止等待运行结束，继续后续的运行
2. 异步：需要等待一个内容完成后继续执行后面的内容，但是不能将后面的内容写在等待函数外，否则就会同时执行两个
3. 图片要进行预加载，否则不会出现图片的宽高。浏览器具有缓存功能

2. 异步操作

1. 操作性事件 需要时间

2. load事件 异步 需要加载

3. setTimeout 异步

4. setInterval 异步

5. requestAnimationFrame 异步

6. 注意：async 放在下一帧执行 defer 所有内容全部加载完成，HTML标签已经完成渲染，给最后执行的代码加

primise函数解决地狱回调

//地狱回调
//比如有一个场景，需要获取第一个数据之后请求第二个数据，接着请求第三个数据
//层层嵌套，维护困难，业务复杂，显得很乱
//获取第一个数据
$.get(url1,data1=>{
    console.log(data1)
    //获取第二个数据
    $.get(url2,data2=>{
        console.log(data2)
        //获取第三个数据
        $.get(url3,data3=>{
            console.log(data3)
        })
    })
})

//用promise解决地狱回调
//先封装一个promise
function getParams(url){
    return new Promise((resolve,reject)=>{
        $.ajax({
            url:url,
            success(res){
                resolve(res)
            },
            error(err){
                reject(err)
            }
        })
    })
}
//.then接受promise成功的回调，promise返回promise直接在后面.then接受结果
getParams(url1).then(data1=>{
    console.log(data1)
    return getParams(url2)
}).then(data2=>{
    console.log(data2)
    return getParams(url3)
}).then(data3=>{
    console.log(data3)
}).catch(err=>{
    console.log(err)
})

单线程
   JavaScript是单线程脚本语言。
   所以，在一行代码的执行过程过，必然不会执行另一行代码的，就行你在使用了alert(1)以后在后面疯狂的console.log()，如果执行到 alert(1)，你没有关闭这个弹窗，后面的console.log()是永远都不会执行的，因为 alert() 这个任务还没有执行完成，下面的代码没法执行。