javascript执行顺序和执行时间的一些相关问题

html渲染时JavaScript的执行时间

• 通过设置script元素的defer属性，可以设置包围其内的js代码是在html文档加载完后才执行该js代码，还是html代码加载到该js代码时，就执行。
  
  • 当defer属性值为”true”或”defer”时(true比较标准)，会在html文档加载后，才执行该js代码。反之，当其属性值为”false”(默认值)时，浏览器在加载html文档时，一解析到该js代码就执行。
  • 设置defer属性值为true后，script中没有包含在函数中(并该函数没被调用)的代码会立即执行，在其函数中则不会。
  • 因为默认false 所以一般把Javascript代码放在最后，因为放在前边有可能执行js代码时，dom节点还没有渲染出来，找不到DOM节点而报错。
  • onload事件函数是指html文档加载结束后执行的函数，当需要操作HTMl的DOM树时，通常应该在onload事件函数中操作，防止html还没加载完就执行js代码时，找不到指定的元素(标签)和内容。
  • onload标准来说与匿名函数配合使用：window.onload=function(){ html加载后做的事;}

javascript执行顺序

• JavaScript是按块执行一个script标签就是一个代码块。自上而下执行（因为html是自上而下的），执行完一个代码块在执行另一个代码块。
• 代码块间相互独立，但变量和方法共享。（但共享是指代码块加载完成之后才会共享。所以要注意代码块的顺序）
• JavaScript在执行时是单线程的
• 分为两个阶段（与编译阶段与执行阶段）
• 最先是预编译阶段，先对javascript进行扫描，进行变量提升
• 然后，在按顺序自上向下执行
• 执行阶段分为进入执行上下文和开始执行阶段（JavaScript的执行环境）

JavaScript单线程与settimeout(0)详解

• JavaScript时单线程的处理任务队列，可以理解为普通函数和回调函数构成的队列。
  
  • 在执行事件时，会将事件及回调函数放入一个栈队列中顺序执行。
  • 上边那条也叫做异步事件驱动，当一个事件正在执行又触发了一个点击事件，就会把该事件放入等待队列。
  • JavaScript是单线程的但浏览器不是单线程
  • ajax异步请求时，浏览器会新开一个线程去执行异步请求，如果请求状态变更时且之前设置了回调，异步线程会将变更事件放入JavaScript单线程引擎队列中去。这个过程中Javascript始终是单线程的。
  • 总结：浏览器新开一个线程请求，事件回调的时候是放入Event loop单线程事件队列等候处理。
  • settimeout（0）
  • 这个重点是改变了 执行流程，他的意思是在当前代码执行完毕后0秒在执行改代码。
  • 也就是让settimeout跳出队列。成为新的队列

javascript的预编译与执行（上下文）

当 JS 引擎开始执行预编译生成的代码时，就会进入到一个执行上下文（Executable Code - 简称 EC）