前言:
如今兄弟们对“js闭包与作用域”大约比较珍视,你们都想要了解一些“js闭包与作用域”的相关知识。那么小编在网络上汇集了一些有关“js闭包与作用域””的相关内容,希望各位老铁们能喜欢,姐妹们一起来学习一下吧!作用域
ES6 之前 JS 没有块级作用域。例如
if (true) { var name = 'zhangsan'}console.log(name)
从上面的例子可以体会到作用域的概念,作用域就是一个独立的地盘,让变量不会外泄、暴露出去。上面的name就被暴露出去了,因此,JS 没有块级作用域,只有全局作用域和函数作用域。
var a = 100function fn() { var a = 200 console.log('fn', a)}console.log('global', a)fn()
全局作用域就是最外层的作用域,如果我们写了很多行 JS 代码,变量定义都没有用函数包括,那么它们就全部都在全局作用域中。这样的坏处就是很容易撞车、冲突。
// 张三写的代码中var data = {a: 100}// 李四写的代码中var data = {x: true}
这就是为何 jQuery、Zepto 等库的源码,所有的代码都会放在(function(){....})()中。因为放在里面的所有变量,都不会被外泄和暴露,不会污染到外面,不会对其他的库或者 JS 脚本造成影响。这是函数作用域的一个体现。
附:ES6 中开始加入了块级作用域,使用let定义变量即可,如下:
if (true) { let name = 'zhangsan'}console.log(name) // 报错,因为let定义的name是在if这个块级作用域作用域链
首先认识一下什么叫做 自由变量 。如下代码中,console.log(a)要得到a变量,但是在当前的作用域中没有定义a(可对比一下b)。当前作用域没有定义的变量,就称为 自由变量 。自由变量如何得到 —— 向父级作用域寻找。
var a = 100function fn() { var b = 200 console.log(a) console.log(b)}fn()
如果父级也没呢?再一层一层向上寻找,直到找到全局作用域还是没找到,就宣布放弃。这种一层一层的关系,就是 作用域链 。
var a = 100function F1() { var b = 200 function F2() { var c = 300 console.log(a) // 自由变量,顺作用域链向父作用域找 console.log(b) // 自由变量,顺作用域链向父作用域找 console.log(c) // 本作用域的变量 } F2()}F1()闭包
通过例子来理解闭包。
function F1() { var a = 100 return function () { console.log(a) }}var f1 = F1()var a = 200f1()
自由变量将从作用域链中去寻找,但是 依据的是函数定义时的作用域链,而不是函数执行时,以上这个例子就是闭包。闭包主要有两个应用场景:
1.函数作为返回值,上面的例子就是
2.函数作为参数传递,看以下例子
function F1() { var a = 100 return function () { console.log(a) }}function F2(f1) { var a = 200 console.log(f1())}var f1 = F1()F2(f1)