美文网首页
2019-06-17 JS(异步、定时器)

2019-06-17 JS(异步、定时器)

作者: 柳叁叁 | 来源:发表于2019-06-17 15:48 被阅读0次

    (本文摘录于阮一峰老师所写文章,https://wangdoc.com/javascript/basic/index.html,作个人学习使用。)

    异步操作概述

    1、JavaScript 只在一个线程上运行,不代表 JavaScript 引擎只有一个线程。事实上,JavaScript 引擎有多个线程,单个脚本只能在一个线程上运行(称为主线程),其他线程都是在后台配合。
    CPU 完全可以不管 IO 操作,挂起处于等待中的任务,先运行排在后面的任务。等到 IO 操作返回了结果,再回过头,把挂起的任务继续执行下去。这种机制就是 JavaScript 内部采用的“事件循环”机制(Event Loop)

    2、JavaScript 运行时,除了一个正在运行的主线程,引擎还提供一个任务队列(task queue),里面是各种需要当前程序处理的异步任务。
    首先,主线程会去执行所有的同步任务。等到同步任务全部执行完,就会去看任务队列里面的异步任务。如果满足条件,那么异步任务就重新进入主线程开始执行,这时它就变成同步任务了。等到执行完,下一个异步任务再进入主线程开始执行。一旦任务队列清空,程序就结束执行。

    异步任务的写法通常是回调函数。一旦异步任务重新进入主线程,就会执行对应的回调函数。如果一个异步任务没有回调函数,就不会进入任务队列,也就是说,不会重新进入主线程,因为没有用回调函数指定下一步的操作。

    引擎在不停地检查,一遍又一遍,只要同步任务执行完了,引擎就会去检查那些挂起来的异步任务,是不是可以进入主线程了。这种循环检查的机制,就叫做事件循环(Event Loop)。

    异步操作模式

    3、回调函数:回调函数的优点是简单、容易理解和实现,缺点是不利于代码的阅读和维护,各个部分之间高度【耦合】(coupling)
    function f1(callback) {
    // ...
    callback();
    }

    function f2() {
    // ...
    }

    f1(f2);

    4、事件监听:采用事件驱动模式。异步任务的执行不取决于代码的顺序,而取决于某个事件是否发生。
    这种方法的优点是比较容易理解,可以绑定多个事件,每个事件可以指定多个回调函数,而且可以【去耦合】(decoupling),有利于实现模块化。缺点是整个程序都要变成事件驱动型,运行流程会变得很不清晰。阅读代码的时候,很难看出主流程。

    5、发布/订阅:这种方法的性质与“事件监听”类似,但是明显优于后者。因为可以通过查看“消息中心”,了解存在多少信号、每个信号有多少订阅者,从而监控程序的运行。

    定时器

    6、setTimeout():setTimeout函数用来指定某个函数或某段代码,在多少毫秒之后执行。它返回一个整数,表示定时器的编号,以后可以用来取消这个定时器。如果要传入执行的语句,需要用字符串的形式。

    7、setInterval() :setInterval函数的用法与setTimeout完全一致,区别仅仅在于setInterval指定某个任务每隔一段时间就执行一次,也就是无限次的定时执行。setInterval的一个常见用途是实现轮询。

    8、debounce 函数(防抖动)

    9、setTimeout(f, 0):setTimeout(f, 0)会在下一轮事件循环一开始就执行,这种写法的目的是,尽可能早地执行f,但是并不能保证立刻就执行f。

    相关文章

      网友评论

          本文标题:2019-06-17 JS(异步、定时器)

          本文链接:https://www.haomeiwen.com/subject/tttafctx.html