预解析

JavaScript引擎运行时，分两步

  1. 预解析
    JavaScript会将 var 和 function 优先解析
    • 变量提升
      只提升变量，不提升赋值
    • 函数提升
      只提升声明，不调用函数
  2. 代码执行
    预解析结束后，按代码从上往下执行

函数内部变量如果没有声明，直接赋值。则为全局变量

测试1

  1. var num = 10
  2. fun()
  3. function fun() {
  4.     console.log(num)
  5.     var num = 20
  6. }

结果为：

  1. undefined

解析：
它的执行过程是

  1. function fun() {
  2.     var num
  3.     console.log(num)
  4.     num = 10
  5. }
  6. var num = 10
  7. fun()

测试2

  1. var num = 10
  2. function fn() {
  3.     console.log(num)
  4.     var num = 20
  5.     console.log(num)
  6. }
  7. fn()

结果为：

  1. undefined
  2. 20

解析：
它的执行过程是

  1. var = num
  2. function fn() {
  3.     var num
  4.     console.log(num)
  5.     num = 20
  6.     console.log(num)
  7. }
  8. num = 10
  9. fn()

测试3

  1. var a = 18
  2. f1()
  3. function f1() {
  4.     var b = 9
  5.     console.log(a)
  6.     console.log(b)
  7.     var a = '123'
  8. }

结果为：

  1. undefined
  2. 9

解析：
它的执行过程是

  1. var a
  2. function f1() {
  3.     var b
  4.     var a
  5.     b = 9
  6.     console.log(a)
  7.     console.log(b)
  8.     a = '123'
  9. }
  10. a = 18
  11. f1()

测试4

  1. f1()
  2. console.log(c)
  3. console.log(b)
  4. console.log(a)
  5. function f1() {
  6.     var a = b = c = 9
  7.     console.log(a)
  8.     console.log(b)
  9.     console.log(c)
  10. }

结果为：

  1. 9
  2. 9
  3. 9
  4. 9
  5. 9
  6. 报错

解析：
它的执行结果为

  1. function f1() {
  2.     var a 
  3.     a = 9
  4.     b = 9
  5.     c = 9
  6.     console.log(a)
  7.     console.log(b)
  8.     console.log(c)
  9. }
  10. f1()
  11. console.log(c)
  12. console.log(b)
  13. console.log(a)