02.定时器引发的思考.html 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>Document</title>
  8. </head>
  9. <body>
  10. <!--
  11. 1、定时器真是定时执行的吗?
  12. 定时器并不能保证真正定时执行
  13. 一般会延迟一丁点儿(可以接受),也有可能延迟很长时间(不能接受)
  14. 2、定时器回调函数是在分线程执行的吗?
  15. 在主线程执行的,js是单线程的
  16. 3、定时器是如何实现的?
  17. 事件循环模型
  18. -->
  19. <button id="btn">启动定时器</button>
  20. <script>
  21. document.getElementById('btn').onclick = function () {
  22. // var start = new Date().getTime()//写成下面的语句更简便
  23. var start = Date.now()
  24. console.log('启动定时器前')
  25. setTimeout(function () {
  26. console.log('定时器执行了', Date.now() - start)
  27. }, 200)
  28. console.log('启动定时器后')
  29. //做一个长时间的工作
  30. for(var i=0;i<1000000000;i++){
  31. }
  32. }
  33. </script>
  34. </body>
  35. </html>