您现在的位置: 首页 > 网站导航收录 > 百科知识百科知识

javascript的“闭包”是什么？

函数,变量,也是javascript的“闭包”是什么？

发布时间：2019-02-08加入收藏来源：互联网点击：

问题补充： javascript闭包谁能给我讲清楚，用个例子或有相应的视频教程。

回答于 2019-09-11 08:43:50

回答于 2019-09-11 08:43:50

在javascript中，闭包是一个难点，也是一个特色，很多高级应用都得靠它实现，而且也是不太容易完全理解的；闭包，顾名思义，就是封闭的，不对外开放的函数语句块，你创建一个函数，实际上它就是一个闭包，不过，闭包通常是在函数内部，即函数中的函数，从而形成“链式作用域”。当然要理解闭包，我们得思考为什么会有闭包这种概念，它的作用是什么？下面通过几个例子来说明下：

一、代码封装

在js中，函数外部全局变量对函数内部是可见的，而在函数内部定义的变量，对外是不可见的。

利用这个特性，在开发中可以用闭包的形式封装重要变量：

这样封装，变量age对外是不可见的，但是，在外部却是可以操作变量age的。

二、缓存

在闭包中引用的变量，外层函数调用后，是不会被垃圾回收机制回收的，可用于缓存计算的结果集，在下次使用时不用重新计算，对性能方面有一定提升；不过，这种情况是会造成内存泄漏的，所以，建议慎用闭包。


obj1在第三次调用的时候，其值为3，说明函数调用后，a的值一直缓存在内存中。

三、自动执行(IIFE模式)

用IIFE模式创建一个匿名函数，它会自动执行，在它内部的变量对外是不可见的。


在闭包内部把age的值改为30，data对象仍没有改变，避免了污染全局变量。

经典面试题思考

一、闭包中，this指向问题。


二、定时器与闭包

三、变量引用与闭包

看懂这三道面试题，对闭包的理解基本差不多了，另外，有不对的地方，还望高人指点。

觉得不错的童鞋，用你发财的小手点个赞呗，蟹蟹支持。

回答于 2019-09-11 08:43:50

以下解释为Javascript闭包。

我们都知道一个概念。

在JS当中，一个函数可以访问其外部的变量资源。

一个典型的代码




但以下这种情况会出错。

function m1(){ var a = 100; console.log(a++); } function m2(){ console.log(a++); //这里无法访问a }

如果，我们想在m2的作用域里，访问m1里的变量，就像下面这样：

首先，我们可以在m1的内部创建一个函数m3

function m1(){ var a = 100; function m3(){ console.log(a++); } }

m3可以正常访问a，接下来我们增加一个return操作。

function m1(){ var a = 100; return function m3(){ console.log(a++); } }

既然有了返回值，那我们不妨接收一下，继续编写代码如下：

function m1(){ var a = 100; return function m3(){ console.log(a++); } } var _m3 = m1();

我们执行了函数m1, 并将返回值赋值给_m3，

那么目前_m3和m3函数是等价的，即它们是同一个函数。

有了_m3，一切都好办了。我们继续编写代码

function m1(){ var a = 100; return function m3(){ console.log(a++); } } var _m3 = m1(); function m2(){ _m3(); }

因为_m3是全局变量，因此m2可以调用_m3

也就等价于m2间接的，访问到了变量a




通常，我们管m3，叫做一个『 闭包函数 』




下面列举几个常见的闭包场景：

for(var i=0; i<list.length; i++){ var item = list[i]; item.onclick = (function(num){ return function(){ //...... } })(i); }




function (){ var that = this; setTimeout(function(){ //...... },2000) }




function User(){ var _age = 0; this.getAge = function(){ return _age; } this.setAge = function(age){ this._age = age; } }




(function(){ var cache = [...]; return { get : function(){ //... } }; })()




(function(){ var t = null; return function(){ if(!t){ t = create(); } } })()