执行上下文与作用域---②

局部作用域中定义的变量可用于在局部上下文中替换全局变量。看一看下面这个例子

var color = 'blue';

    function changeColor() {
    let anotherColor = 'red';

    function swapColors() {
    let tempColor = anotherColor;//red
    anotherColor = color;//blue
    color = tempColor;//red
    //这里可以访问color、anotherColor、和tempColor、
    //这的swapColors是最里层的上下文。通过向外部延伸访问到color、anotherColor、tempcolor.也就是全部的变量和函数
    }
    //这里可以访问color、和anotherColor,但访问不到tempColor
    swapColors()
    console.log(color);//BLUE swapColors()调用在前 = red??
    console.log(anotherColor);//red swapColors()调用在前= blue??
    // console.log(tempColor);//访问不到
    // swapColors()
    }
    changeColor();

以上代码涉及3个上下文:全局上下文、changeColor()的局部上下文和swapColors()的局部上下文。全局上下文中有一个变量color和一个函数changeColor()。changeColor()的局部上下文中有一个变量anotherColor和一个函数swapColors(),但在这里可以访问全局上下文中的变量color。swapColors()的局部上下文中有一个变量tempColor,只能在这个上下文中访问到。全局上下文和changeColor()的局部上下文都无法访问到tempColor。而在swapColors()中则可以访问另外两个上下文中的变量,因为它们都是父上下文。
下图展示了前面这个例子的作用域链。

上图中表示不同的上下文。内部上下文可以通过作用域链访问外部上下文中的一切,但外部上下文无法访问内部上下文中的任何东西。上下文之间的连接是线性的、有序的。每个上下文都可以到上一级上下文中去搜索变量和函数,但任何上下文都不能到下一级上下文中去搜索。swapColors()局部上下文的作用域链中有3个对象:swapColors()的变量对象、changeColor()的变量对象和全局变量对象。swapColors()的局部上下文首先从自己的变量对象开始搜索变量和函数,搜不到就去搜索上一级变量对象。changeColor()上下文的作用域链中只有2个对象:它自己的变量对象和全局变量对象。因此,它不能访问swapColors()的上下文。注意 函数参数被认为是当前上下文中的变量,因此也跟上下文中的其他变量遵循相同的访问规则。

posted @ 2021-09-10 01:20  Caesar_Y  阅读(35)  评论(0编辑  收藏  举报