符合中小企业对网站设计、功能常规化式的企业展示型网站建设
本套餐主要针对企业品牌型网站、中高端设计、前端互动体验...
商城网站建设因基本功能的需求不同费用上面也有很大的差别...
手机微信网站开发、微信官网、微信商城网站...
这篇文章给大家分享的是有关JavaScript中作用域和闭包是什么的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。
成都创新互联是一家专注于成都网站制作、做网站与策划设计,蒲江县网站建设哪家好?成都创新互联做网站,专注于网站建设10多年,网设计领域的专业建站公司;建站业务涵盖:蒲江县等地区。蒲江县做网站价格咨询:18980820575
JavaScript作用域和闭包
在javascript中,如果对作用域和闭包弄不清楚,写代码就会出很多问题,今天对作用域和闭包做一个总结。
作用域
作用域主要分为全局作用域和局部作用域,其中局部作用域分为函数作用域和块级作用域。
全局作用域
如果你在大括号({})或者函数的外面定义了一个变量,那么它就是一个全局的变量,它的作用域就是全局作用域。
let a = 1function fun1 () { console.log(a) // 结果:1 function fun2 () { console.log(a) // 结果:1 } fun2()}fun1()console.log(a) // 结果:1
变量a就是定义在最外层,它就能在全局任意地方被使用。
值得注意的是,在同一级作用域中,使用let或const声明变量的时候第二个同名会报错,而使用var声明变量的时候,会覆盖前面的变量;
局部作用域
如果你在函数或者大括号({})内定义的变量,就是局部作用域的变量,它能够在该级作用域级任意下级作用域中使用。
function fun1() { let a = 100 console.log(a) // 结果: 100 function fun2 () { console.log(a) // 结果:100 } fun2()}fun1()console.log(a) // 结果: a is not defined
a只能在fun1函数内部包括内部函数中使用,一旦出了fun1的范围就无法使用该变量了。
自由变量的查找
一个变量在当前作用域没有定义却被使用了,就是自由变量。它的执行规则是怎样的呢?
自由变量的查找是向上级作用域,一层一层以此寻找,直至找到为止。如果全局作用域都没有找到,则报错xx is not defined。
let a = 100function fun1 () { let a1 = 2 function fun2 () { let a2 = 3 let a = 0 function fun3 () { let a3 = 4 a++ console.log(a + a1 + a2 + a3) // 结果: 10 } fun3() } fun2()}fun1()console.log(a) // 结果: 100
正如上述代码所示,在fun3函数内,a和a1、 a2都没有定义,但被使用了,在执行的时候,它会往上级作用域中查找,从而找到它们的值。值得注意的一点的是,在全局作用域和fun2的函数中我们都定义了a,但是在fun3中使用的fun2中定义的值,外面的使用的全局作用域的值,也就是说,它往上级查找的时候,只要查找到就会停止查找,会就近使用。作用域间也不会互相干扰。(它们里面存在的变量提升和函数提升可以查看我的另一篇博客有专门的总结)
闭包
闭包是作用域应用的特殊情况,主要有两种表现:(1)函数作为参数被传递。(2)函数作为返回值被返回。
/** * 函数作为返回值 */function create () { const a1 = 100 return function () { console.log(a1) }}const fn = create()const a1 = 200fn() // 结果: 100/** * 函数作为参数 */function print (fn) { const a2 = 300 fn()}const a2 = 400function fn1 () { console.log(a2)}print(fn1) // 结果: 400
上面代码演示了函数的两种表现,值得注意的是:在闭包中,自由变量的查找,是在函数定义的地方,向上级作用域查找,不是在执行的地方!
闭包的实际应用场景
(1)隐藏数据, 如做一个简单的cache工具
(2)函数防抖与节流
感谢各位的阅读!关于“JavaScript中作用域和闭包是什么”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!