传递参数#

• 所有函数的参数都是按值传递的，在按值传递参数时，值会被复制到一个局部变量中（也就是arguments对象中的一个槽位） function setName(obj) { obj.name = “aaa” obj = new Object() obj.name = “bbb” } var person = new Object() setName(person) console.log(person.name) // aaa 如果是按照引用传递的话，person将会指向name为”bbb”的对象，而不是任然指向”aaa”的对象。 当obj在函数内部重写时，它变成了一个指向本地对象的指针，而那个本地对象在函数执行结束时就被销毁了。

变量提升与函数提升#

• 变量声明提升：通过var定义(声明)的变量, 在定义语句之前就可以访问到，但值: undefined

• 函数声明提升：通过function声明的函数, 在之前就可以直接调用，但 值: 函数定义(对象)

  1
    //变量提升
  2
    console.log(a1) //可以访问, 但值是undefined
  3
    var a1 = 3
  4
  
  5
    //函数提升
  6
    a2() // 可以直接调用，输出  a2()
  7
    function a2() {
  8
    console.log('a2()')
  9
    }
  10
    a3() //报错
  11
    var a3 = function(){
  12
      console.log('a3')
  13
    }

遇到函数表达式 var a3 = function(){}时，首先会将var a3上升到函数体顶部，然而此时的 a3 的值为 undefined,所以执行a3()报错。

• 注：

  • 当遇到函数和变量同名且都会被提升的情况，函数声明优先级比较高（实际上是变量先提升到全局作用域中，但值为undefined，然后函数提升并且给函数直接赋值），因此变量声明会被函数声明所覆盖，但是可以重新赋值。

    1
      console.log(a) //输出：function a(){ console.log('函数') }
    2
      function a() {
    3
          console.log("函数")
    4
      } //
    5
      var a = "变量"
    6
      console.log(a) //输出：'变量'

function 声明的优先级比 var 声明高，也就意味着当两个同名变量同时被 function 和 var 声明时，function 声明会覆盖 var 声明。

这代码等效于：

1
    function a() {
2
        console.log("函数");
3
    }
4
    var a
5
    console.log(a) //输出：function a(){ console.log('函数') }
6
    a = "变量" //赋值
7
    console.log(a) //输出：'变量'

执行上下文#

1
* 在执行全局代码前将window确定为全局执行上下文
2
* 对全局数据进行预处理
3
  * var定义的全局变量==>undefined, 添加为window的属性
4
  * function声明的全局函数==>赋值(fun), 添加为window的方法
5
  * this==>赋值(window)
6
* 开始执行全局代码

1
* 在调用函数, 准备执行函数体之前, 创建对应的函数执行上下文对象
2
* 对局部数据进行预处理
3
  * 形参变量==>赋值(实参)==>添加为执行上下文的属性
4
  * arguments==>赋值(实参列表), 添加为执行上下文的属性
5
  * var定义的局部变量==>undefined, 添加为执行上下文的属性
6
  * function声明的函数 ==>赋值(fun), 添加为执行上下文的方法
7
  * this==>赋值(调用函数的对象)
8
* 开始执行函数体代码

执行上下文栈#

JavaScript 引擎创建了执行上下文栈来管理执行上下文。可以把执行上下文栈认为是一个存储函数调用的栈结构，遵循后进先出的原则。

• JavaScript 执行在单线程上，所有的代码都是排队执行，遵循后进先出的原则。
• 一开始浏览器执行全局的代码时，首先创建全局的执行上下文，压入执行栈的顶部。
• 每当进入一个函数的执行就会创建函数的执行上下文，并且把它压入执行栈的顶部。当前函数执行完成后，当前函数的执行上下文出栈，并等待垃圾回收。
• 浏览器的 JS 执行引擎总是访问栈顶的执行上下文。
• 全局上下文只有唯一的一个，它在浏览器关闭时出栈。

• 1
    var color = "blue"
  2
    function changeColor() {
  3
        var anotherColor = "red"
  4
        function swapColors() {
  5
            var tempColor = anotherColor
  6
            anotherColor = color
  7
            color = tempColor
  8
        }
  9
        swapColors()
  10
    }
  11
    changeColor()

  • 当上述代码在浏览器中加载时，JavaScript 引擎会创建一个全局执行上下文并且将它推入当前的执行栈
  • 调用 changeColor 函数时，此时 changeColor 函数内部代码还未执行，js 执行引擎立即创建一个 changeColor 的执行上下文，然后把这执行上下文压入到执行栈中。
  • 执行 changeColor 函数过程中，调用 swapColors 函数，同样地，swapColors 函数执行之前也创建了一个 swapColors 的执行上下文，并压入到执行栈中。
  • swapColors 函数执行完成，swapColors 函数的执行上下文出栈，并且被销毁。
  • changeColor 函数执行完成，changeColor 函数的执行上下文出栈，并且被销毁。

作用域#

• 我们可以这样理解：作用域就是一个独立的地盘，让变量不会外泄、暴露出去。也就是说作用域最大的用处就是隔离变量，不同作用域下同名变量不会有冲突。
• 在创建函数会创建函数作用域，函数作用域的含义是指，属于这个函数的全部变量都可以在整个函数的范围内使用及复用（事实上在嵌套的作用域中也可以使用）。而外部作用域无法使用内部作用域的变量
• 在ES6中引入了let关键字，用来在任意块中声明变量，在块中的变量无法在块作用域在进行引用 var foo = true; if (foo) { { // <— 显式的快 let bar = foo * 2; bar = something( bar ); console.log( bar ); } } console.log( bar ); // ReferenceError

作用域链#

• 作用域链是由多个上下级关系的作用域形成的链，他的方向是从下向上的（从内向外），查找变量时就是沿着作用域链来查找的 var a = 2; function fn1() { var b = 3; function fn2() { var c = 4; console.log(c); console.log(b); console.log(a); console.log(d); }

  1
      fn2();
  2
    }
  3
    fn1(); //4, 3, 2, ReferenceError

  上面例子中的作用域链就是fn2函数作用域—>fn1函数作用域—>全局作用域