006--面试之异步

单线程 - 只有一个线程,只能做一件事
原因 - 避免 DOM 渲染的冲突
解决方案 - 异步

单线程

console.log('start')
        var i, sum = 0;
        for (i = 0; i < 1000000; i++) {
            sum++
        }
        console.log(sum)

执行上述代码会发现浏览器一直在刷新,卡顿过后结束

alert点击过后才能继续执行代码

原因-

浏览器需要渲染 DOM
JS 可以修改 DOM 结构
JS 执行的时候,浏览器 DOM 渲染会暂停
两段 JS 也不能同时执行(都修改 DOM 就冲突了)
webworker 支持多线程,但是不能访问 DOM

简单的异步

    setTimeout(function () {
            console.log(200)
        }, 1000)
        console.log(300)
        console.log(400)

        console.log(100)
        $.ajax({
            url: './data.json',
            success: function (result) {
                console.log(result)
            }
        })
        console.log(300)
        console.log(400)

异步的问题

问题一:没按照书写方式执行,可读性查
问题二:callback 中不容易模块化

eventLoop

事件轮询,JS 实现异步的具体解决方案
同步代码,直接执行
异步函数先放在 异步队列 中
待同步函数执行完毕,轮询执行 异步队列 的函数

详情见https://www.cnblogs.com/ccbest/p/10845536.html

工欲善其事,必先利其器
原文地址:https://www.cnblogs.com/ccbest/p/10843128.html