简单了解一下js的编译和作用域

94 阅读4分钟

编译过程

编译过程是将源代码转换为可执行代码的过程。它通常包括以下步骤:

  1. 词法分析 :也称为词法扫描,它将源代码分解为词法单元(token),例如关键字、标识符、运算符等。这些词法单元构成了语法的基本元素。
  2. 语法分析 :解析器将词法单元转换为语法树(parse tree)或抽象语法树(abstract syntax tree,AST)。语法树表示了代码的结构和语法关系,使得编译器能够理解代码的含义。
  3. 语义分析 :编译器会检查语法树是否符合语言规范的语义要求,例如类型检查、变量声明等。这一步确保代码在执行时不会出现语义错误。
  4. 中间代码生成 :在某些编译器中,语法树可能会转换为中间代码,这是一种便于优化和后续转换的抽象表示形式。
  5. 优化 :编译器可能会对生成的中间代码进行优化,以提高程序的性能、减少内存占用或减少执行时间等。
  6. 代码生成 :最终,编译器将优化后的中间代码转换为目标机器代码或其他形式的可执行代码,这取决于目标平台的要求。

作用域

作用域决定了在程序中变量和其他标识符的可访问性和生命周期。主要有以下几种作用域:

1. 全局作用域

在整个程序中都可访问的作用域,变量在全局作用域声明时通常会成为全局对象的属性(在浏览器中是 window 对象)。

2. 函数作用域

在函数内部声明的变量只能在该函数内部访问。这种作用域有助于避免变量名冲突,并且在函数执行完毕后,函数作用域内的变量通常会被销毁。

3. 块级作用域

使用 letconst 声明的变量具有块级作用域,例如在 if 语句、循环或花括号 {} 内部。块级作用域的引入使得代码更加结构化和可控,同时也减少了变量泄漏的风险。

4. 词法作用域

词法作用域(也称为静态作用域或者静态绑定)是指变量的作用域由它们在代码中的位置决定,而不是由程序的执行流决定。这意味着在编译阶段就能确定变量的作用域,而不是在运行时确定。

5. 欺骗词法作用域

尽管词法作用域通常是静态的,但可以通过以下方式来“欺骗”它:

    • eval() 函数eval 函数可以执行包含动态代码的字符串,并将其作为当前作用域的一部分执行,可能会引入新的变量或修改已有变量,这会改变词法作用域的行为。不建议在代码中使用 eval,因为它会导致代码的可读性和安全性问题。
    • with 语句with 语句允许在一个对象的上下文中执行语句块,但会导致难以预测的作用域链行为,不建议在代码中使用。

简单示例

var a=8

function foo(){
    var a=6;
    console.log(a);
}

foo();

console.log(a);

image.png

var a=8

function foo(){
    var b=6;
    console.log(b);
}

foo();

console.log(a);

image.png image.png

关键字

var vs let

varlet 是声明变量的关键字,它们之间有以下区别:

  • var:函数作用域或全局作用域,声明的变量会提升到所在作用域的顶部,并且会成为全局对象的属性。
  • let:块级作用域,声明的变量不会被提升,只在声明的块内有效,不会成为全局对象的属性,有助于代码的结构化和变量管理

const

const 关键字用于声明常量,一旦声明,其值不能被重新赋值。它具有块级作用域,类似于 let,但必须在声明时初始化。使用 const 可以确保变量在初始化后不会被修改,从而提高代码的可靠性和可维护性。