面试:js运行机制

面试考点

js是单线程的

js是浏览器脚本语言,用于与用户互动、操作dom,注定只能是单线程的。H5允许jd创建多个线程,但是子线程完全受主线程控制,且不得操作dom。

任务队列和事件循环

同步任务:在主线程上排队执行的任务,只有前一个任务执行完毕,才能执行后一个任务。

异步任务:不进入主线程、而进入"任务队列"(task queue)的任务,只有"任务队列"通知主线程,某个异步任务可以执行了,该任务才会进入主线程执行

过程: 只要主线程空了,就去读取任务队列,并不断重复。这个过程就是事件循环(Event Loop)

(1)主线程-执行栈(execution context stack)-同步任务

(2)任务队列(tash queue)-异步任务

任务队列中的事件:IO设备、用户产生事件、定时器事件、Promise

:HTML5标准规定了setTimeout()的第二个参数的最小值(最短间隔),不得低于4毫秒,如果低于这个值,就会自动增加。在苹果机上的最小时间间隔是10毫秒,在Windows系统上的最小时间间隔大约是15毫秒

一些例子

<!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>js运行机制</title>
</head>
<body>
</body>
<script>
    console.log(1);
    setTimeout(() => {
        console.log(2);
    }, 0);
    console.log(3);
    //1 3 2
    //---------------------------------
    console.log('A');
    while (1) {
        
    }
    console.log('B');
    //print A
    //then brower crash
    //-----------------------------------
    console.log('A');
    setTimeout(() => {
        console.log('B');
    }, 0);
    while (1) {
        
    }
    //only print A
    //----------------------------------
    for (var i = 0 ;i < 4; i++) {
        setTimeout(() => {
            console.log(i);
        }, 1000);
    }
    //print 4 4 4 4
    //在1秒之后,settimeout中的语句才被放在了异步队列当中
</script>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_41900808/article/details/88309447