都是为了避免页面在加载脚本时遇到阻塞等问题而导致白屏等问题的出现

下面对两者的异同点做了一些归纳总结：

相同点：

  1. 都是以异步的方式来加载脚本的，不会对其它资源的加载造成阻塞
  2. 属性值都只对外部脚本有效（defer的标准是在HTML5中规定的，所以在IE老版本的浏览器中可能会支持内部脚本）
  3. 异步的方式导致脚本都不会立即执行，但是总是在load之前执行的

不同点：

  • defer

  1. 脚本的执行是有次序的
  2. 脚本的执行总是在DOMContentLoaded之前，但是实际并非如此

  • async

  1. 无法保证按次序执行
  2. 无法确定是否在DOMContentLoaded前后什么位置执行

以上图片仅是我当时测试的结果，很难测试出书本中的结论，后期阅历增加考虑在回来重新更新

参考部分了链接

https://www.jianshu.com/p/66db7d62d827

https://blog.csdn.net/liuhe688/article/details/51247484