[ES6]1.1作用域

作用域

全局作用域（global/window）
函数作用域/局部作用域（function）
块状作用域（{}）
动态作用域（this）

1、全局作用域

在最外层使用var定义全局作用域的变量。

var course = "es6"

在任意位置创建未定义的变量。

function foo () {
    course = "es6"
}
// 在此处及任何位置都可以调用
console.log(course)

（不建议使用）而在在外层，使用let定义变量时，它的作用域为全局块作用域。

let a3 = 3

console.log("a3" in window); // false

以上定义全局作用域的三种方法总结为：

使用var，是定义了当前作用域的一个变量，可以使用window调用，但不能使用delete删除。
未定义的变量，同样可以使用window调用，但其作为window对象的一个属性，可以使用delete删除。
使用let只是在当前作用域块定义了一个变量，不是window的属性，所以也无法使用window调用。

var a1 = 1
a2 = 2
let a3 = 3
console.log(window.a1, 'a1' in window) // 1 true
console.log(window.a2, 'a2' in window) // 2 true
console.log(window.a3, 'a3' in window) // undefined false

2、函数作用域

在函数内部定义的变量，就成为局部作用域，只作用于函数内部。

function bar() {
    var testValue = 'inner'
}

console.log(testValue) // 报错：ReferenceError: testValue is not defined

如果想兑取函数内的变量，必须使用return或者闭包，这里着重描述一下闭包。

闭包

一个函数和它的周围状态的引用捆绑在一起的组合。

当函数执行的时候，其内部的自由变量（未在函数内部定义）的取值，是根据函数定义的地方向上查找它的值。

function test() {
    const a = 1
    return function () {
        console.log('a', a)
    }
}

const fn = test()
const a = 2
fn() // a 1

3、块状作用域

有{}的就是块，在ES5中使用var定义变量时没有块作用域的，会因为var的变量提升机制，将变量提升到当前作用域的最上层。

if (true) {
    var a = 1
}
console.log(a); // a

相当于

var a
if (true) {
    a = 1
}
console.log(a);

在ES6中，使用let声明变量，就可用吧变量的作用域限制在当前块中。

if (true) {
    let a = 1
}
console.log(a); // a is not defined

动态作用域

window.a = 3

function test() {
    console.log(this.a)
}

test.bind({
    a: 2
})() // 2
test() // 3

通俗的讲变量的作用域是在定义时决定而不是执行时决定，也就是说词法作用域取决于源码，通过静态分析就能确定，因此词法作用域也叫做静态作用域。相反，只能在执行阶段才能决定变量的作用域，那就是动态作用域。

最后编辑于：2021.06.24 19:49:13