javascript的闭包学习
为什么要产生闭包的概念,通俗来说一下。
公司有一个项目,分为两个部分,张三、李四各分配一个部分。
张三.js代码:
var key='我要吃肉'
function fn(){
console.log(key);
}
李四.js代码:
var key='我要喝酒'
function fn(){
console.log(key);
}
如果在张三.js或者李四.js代码中分别运行,都没有问题。不过,这是一个网页项目的两部分,需要综合到一起去执行,此时就出现了问题。
我的本意是张三的执行,李四的也执行。实际情况:
只执行了李四的fn,如图。
如果js代码中不用var定义变量,而是用let定义变量,就会更明确的显示出问题。
那就是在 first_js.html这个总项目中,张三和李四的变量、函数名等重复定义了。
闭包就是为了解决这个问题。
那么,如何解决呢?
这就是需要“作用域”这个概念。也就是,在函数内部定义的变量,只在这个函数内有效。
对了,程序员很机智,给张三.js和李四.js的代码,分别用一个函数包含起来,它们不就分别有自己的独立空间了吗?对,这就是闭包。闭:就是封闭的环境(函数内)存放局部变量和方法。包:就是在这个环境中,实现想要的功能。
代码就变成了这样:
再多想一步,既然这个所谓的外部函数的作用只是给出一个独立的空间,它们的名字是不是就略显多余呢?
这时,就自然想到了自运行函数。
这里还有个问题,张三和李四虽然有了自己的空间,那么它们想要实现的功能(函数),怎么让总项目所使用呢?
好办,那就分别导出其功能函数就行了。 【注意:此时返回的变量是一个函数】。
这样,在总项目中,分别运行zs()和ls()就可以了。
进一步思考,如何张三.js和李四.js需要实现多个功能,该如何导出呢?
将导出函数变为导出对象(对象中有多个功能函数)就行了。【注意:此时返回的变量是一个对象】。
在总项目中,依次调用:
结果正确。
至此,就解决了各个分项目中存在同变量名冲突的问题。
张三和李四再也不用为自己代码中的变量名称冲突而烦恼了。
这就是闭包的来源和作用。
小知识:自运行函数的格式(张三.js为自运行函数,李四.js为普通函数的运行)