深入理解JS|青训营笔记

44 阅读2分钟

JS的基本概念

不是纯解释性语言,也要经过编译

Browser进程、GPU进程、渲染进程、插件进程、网络进程

渲染进程:

  • GUI线程:绘制页面内容
  • JS线程:执行JS
  • 事件触发线程
  • 定时器触发线程
  • 网络线程

作用域

变量的可访问性和可见性

静态作用域, 通过它就能够预测代码在执行过程中如何查找标识符

变量提升

  • var有变量提升
  • let、const没有变量提升,提前访问会报错
  • function函数可以先调用再定义
  • 赋值给变量的函数无法提前调用

JS是怎么执行的

执行上下文

当JS引擎解析到可执行代码片段(通常是函数调用)的时候,就会先做一些执行前的准备工作,这个准备工作就是执行上下文,也叫执行环境

执行上下文包含:

  • 变量环境:变量环境和词法环境的一个不同就是后者者被用来存储函数声明和变量(let和const)绑定,而后者只能用来存储var变量绑定
  • 词法环境:基于ECMAScript代码的词法嵌套结构来定义标识符和具体变量和函数的关联,一个词法环境由环境记录器和一个可能的引用外部词法环境的空值组成
  • Outer:指向外部变量环境的一个指针,这个外部假如外部没有函数包裹就代表全局,有就代表函数内,指上一级
  • This
  • 可执行代码

执行上下文种类:

  • 全局执行上下文

代码开始执行时就会创建,将他压执行线的栈底,每个生命周期内只有一份

  • 函数执行上下文

当执行一个函数时,这个函数内的代码会被编译,生成变量环境、词法环境等,当函数执行结束的时候该执行环境从栈顶弹出

  • Eval执行上下文

创建执行上下文时做了什么:

  • 绑定This
  • 创建词法环境
  • 创建变量环境

JS的进阶知识点

this

  • 普通函数的this指向window(函数)
  • 对象调用指向对象,先赋值再调用,看调用的地方,可以用apply、call、bind改变this指向(对象)
  • 创建临时对象,将this指向临时对象,执行构造函数,返回临时对象(构造函数)

事件循环

事件执行顺序:

主线程→微任务→宏任务