JavaScript 闭包 作用域

闭包

JavaScript 中的闭包是相当重要的概念并且与作用域相关知识的指向密切相关

• JavaScript 中的作用域是什么意思?
• 闭包会在哪些场景中使用?
• 通过定时器循环输出自增的数字通过 JS 的代码如何实现?

闭包概念一

闭包是指有权访问另外一个函数作用域中的变量的函数。

闭包概念二

MDN:一个函数和对其周围状态的引用捆绑在一起(或者说函数被引用包围)这样的组合就是闭包(closure)也就是说，闭包让你可以在一个内层函数中访问到其外层函数的作用域

闭包概念三

闭包其实就是一个可以访问其他函数内部变量的函数
通常情况下，函数内部变量是无法在外部访问的
因此使用闭包的作用
就具备实现了能在外部访问某个函数内部变量的功能

function fun1() {
    var a = 1;
    return function () {
        console.log(a);
    }
}

fun1();
var result = fun1();
result();//1

输出

1

闭包产生的本质就是:当前环境中存在指向父级作用域的引用

闭包产生的原因

let fun3
function fun1() {
    var a = 2
    fun3 = function () {
        console.log(a)
    }
}

fun1()
fun3()

输出

2

闭包的表现形式

1. 返回一个函数，上面讲原因的时候已经说过，这里就不赘述了
2. 在定时器、事件监听、Ajax请求、Web Workers 或者任何异步中只要使用了回调函数，实际上就是在使用闭包
3. 作为函数参数传递的形式，比如下面的例子
4. IIFE(立即执行函数)，创建了闭包
   保存了全局作用域(window)和当前函数的作用域，因此可以输出全局的变量

for (var i = 1; i <= 5; i++) {
    (function (j) {
        setTimeout(function timer(){
            console.log(j)
        },0)
    })(i)
}

for (let i = 1; i <= 5; i++) {
    setTimeout(function timer(){
        console.log(i)
    },0)
}

for (var i = 1; i <= 5; i++) {
    setTimeout(function timer(j){
        console.log(j)
    },0,i)
}

作用域基本介绍

JavaScript 的作用域。指变量能够被访问到的范围

• ES5 之前
  全局作用域和函数作用域
• ES6 出现之后
  新增块级作用域

不论Java也好，JavaScript也罢变量一般都会分为全局变量和局部变量两种。
在 JavaScript 中，全局变量是挂载在 window 对象下的变量所以在网页中的任何位置你都可以使用并且访问到这个全局变量。

var globalName = 'global'

function getName() {
    console.log(globalName)//globalvar name='inner
    var name = "icon"
    console.log(name);//console.log(globalName);//global
}

function setName() {
    vName = 'setName'
}

getName()
// console.log(name) //name is not defined
console.log(globalName)
setName()
// console.log(vName)  //vName is not defined
// console.log(window.vName)  //window is not defined

输出：

global
icon  
global

作用域链的基本概念

当访问一个变量时，代码解释器会首先在当前的作用域查找如果没找到，就去父级作用域去查找直到找到该变量或者不存在父级作用域中

函数作用域

• 除了这个函数内部，其他地方都是不能访问到它的
• 当这个函数被执行完之后，这个局部变量也相应会被销毁

块级作用域

• 最直接的表现就是新增的 let 关键词
• 使用 let 关键词定义的变量只能在块级作用域中被访问

块级作用域举例

在 JS 编码过程中
if 语句以及 for 语句后面 {…} 这里面所包括的就是块级作用域