一、闭包!?

  闭包(closure)是Javascript语言的一个难点,对于初学者来说不容易理解,那我们先来看看闭包的含义。

  百度百科与“官方”解释:所谓“闭包”,指的是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分。

  维基百科:在编程语言中,闭包(也称为词法闭包或函数闭包)是用于在具有第一类函数的语言中实现词法范围名称绑定的技术。

  然而我们看到这些官方的解释并不能很清楚的了解闭包到底是什么鬼东西,只会一头问号,“你在说什么?”。

  其实闭包简单来讲就是能够读取函数内部定义的局部变量的函数,而在Javascript中只有函数内部的子函数才能读取局部变量,所以我们也可以把闭包理解成定义在函数内部的函数。

二、函数的变量

  想要理解闭包,我们就先要了解在函数中的变量,这些变量有自己的作用域。什么是作用域?呐,通常来说,一段程序代码中所用到的名字并不总是有效/可用的,而限定这个名字的可用性的代码范围就是这个名字的作用域。

  变量的作用域有两种,一个是全局,一个是局部,也就是我们所说的全局变量和局部变量。  

var a=50;
function fun1(){
alert(a);
}
fun();

  上面这段代码中,a在函数外面定义,所以在函数内部调用变量a自然可以读取它的值。这里的a我们就叫它全局变量。

function fun2(){
var a=50;
}
alert(a);

  而在这段代码中,我们把a定义在函数内部,那么在函数外部调用a的时候,它会报错,告诉你“a  is not defined”,我们找不到a啊?我们定义过a吗?当然定义过啊!只不过它是局部变量而已。

三、如何找到“藏”在函数里的变量

  在我们敲键盘码代码的时候,总会有一些原因,需要我们得到函数内部的局部变量,那么“藏”在函数里的局部变量我们就需要用一种方法把他提取出来。

  那就是在函数内部,我们再定义一个函数。

function fun3(){
var a=50;
function fun4(){
return a;
}
return fun4();
}
//console.log(a); 报错
console.log(fun3());

  在上面这段代码里,我们在fun3里面定义了一个变量a,这样我们在函数fun3外调用a同样会报错找不到它,而对于函数fun3内部的函数fun4来说,a是可以调用的,因外a在函数fun4的外部,反过来fun4内如果定义了一个变量那么fun3是不可调用的。

  这里就又涉及到另一个概念,就是链式作用域,也就是我们说的作用域链。作用域链就是相同的变量名会产生作用域链,访问该变量名称的时候,会首先找本层作用域是否含有该变量,如果没有就去父层作用域去找,最终找到全局变量为止,如果全局变量也找不到该变量,那么就会报错。

  那么如果想在函数fun3外面调用变量a,就要在函数fun3内部再定义一个函数fun4,我们让它返回一下他可以调用的变量a,那么函数fun4的结果就是变量a,那么我们再返回函数fun4,那么我们执行函数fun3,得到的结果就是变量a的值。

  简单来讲,就是只要把fun4作为返回值,我们就可以在fun3外部读取它的内部变量了。

四、调用局部变量(使用闭包)要注意什么?

  1.闭包会使函数里面的变量被保存在内存中,对于内存的消耗非常大,所以不能滥用闭包,否则网页的性能会降低。

  2.不要随便改变父函数内部变量的值。

  最后总结一下,闭包就是能够读取其他函数内部变量的函数,能够让我们在父级函数外调用父级函数内的变量,有代码的情况下理解起来其实不难,重要的是在变化莫测的代码中,闭包具体的应用还是需要我们真正的理解它才可以熟练应用。

    

Javascript中的闭包 O__O "…的更多相关文章

  1. 让你分分钟学会Javascript中的闭包

    Javascript中的闭包 前面的话: 闭包,是 javascript 中重要的一个概念,对于初学者来讲,闭包是一个特别抽象的概念,特别是ECMA规范给的定义,如果没有实战经验,你很难从定义去理解它 ...

  2. 难道这就是JavaScript中的"闭包"

    其实对于JavaScript中的"闭包"还没真正理解,这次在实际Coding中似乎遇到了"闭包"的问题,仅此摘录,以待深究. 表现为jQuery的post方法回 ...

  3. 浅谈JavaScript中的闭包

    浅谈JavaScript中的闭包 在JavaScript中,闭包是指这样一个函数:它有权访问另一个函数作用域中的变量. 创建一个闭包的常用的方式:在一个函数内部创建另一个函数. 比如: functio ...

  4. javascript中的闭包解析

    学习javaScript已经有一段时间了,在这段时间里,已经感受到了JavaScript的种种魅力,这是一门神奇的语言,同时也是一门正在逐步完善的语言,相信在大家的逐步修改中,这门语言会逐步的完善下去 ...

  5. JavaScript中的闭包理解

    原创文章,转载请注明:JavaScript中的闭包理解  By Lucio.Yang 1.JavaScript闭包 在小学期开发项目的时候,用node.js开发了服务器,过程中遇到了node.js的第 ...

  6. 【JS】JavaScript中的闭包

    在JavaScript中,闭包指的是有权访问另一个函数作用域中的变量的函数:创建闭包最常见的方式就是在一个函数内创建另一个函数.如下例子: function A(propertyName){ retu ...

  7. Javascript中的闭包(转载)

    前面的话: 闭包,是 javascript 中重要的一个概念,对于初学者来讲,闭包是一个特别抽象的概念,特别是ECMA规范给的定义,如果没有实战经验,你很难从定义去理解它.下面是作者从作用域链慢慢讲到 ...

  8. 狗日的Javascript中的闭包

    前面的话: 闭包,是 javascript 中重要的一个概念,对于初学者来讲,闭包是一个特别抽象的概念,特别是ECMA规范给的定义,如果没有实战经验,你很难从定义去理解它.下面是作者从作用域链慢慢讲到 ...

  9. [译]Javascript中的闭包(closures)

    本文翻译youtube上的up主kudvenkat的javascript tutorial播放单 源地址在此: https://www.youtube.com/watch?v=PMsVM7rjupU& ...

随机推荐

  1. Python mongoDB读取

    class db_class(): def __init__(self): mongo_DB='test1' self.mongo_TABEL='test' client=pymongo.MongoC ...

  2. 【PowerDesigner】【2】将工具栏显示出来

    问题:我的软件一打开,没有工具栏 解决方案:Tools→Customize Menus and Tools→Palette→Close 参考文档: PowerDesigner如何将消失的工具栏显示出来 ...

  3. 【LeetCode】区间合并

    给定一组区间,将所有区间重叠的部分合并起来. e.g. 给出 { [1, 3], [2, 6], [8, 10], [15, 18] },返回 { [1, 6], [8, 10], [15, 18] ...

  4. zabbix安装教程

    1.下 载 https://www.zabbix.com/download 往下拉选择到源码版本下载 2.创建zabbix用户 zabbix需要以非root用户运行:如果以root用户运行那么他将会自 ...

  5. redis sentinel哨兵模式集群搭建教程

    1.环境说明 我们将使用192.168.220.128.192.168.220.129两台机器搭建sentinel交叉主从为例 当前我们已在192.168.220.128上按redis安装教程安装了r ...

  6. QPainter绘制渐进色文本

    参考资料:https://blog.csdn.net/what951006/article/details/52876513 效果图: 代码: void WgtText::paintEvent(QPa ...

  7. vue 中使用 Toast弹框

    import { ToastPlugin,ConfirmPlugin,AlertPlugin} from 'vux' Vue.use(ToastPlugin) Vue.use(ConfirmPlugi ...

  8. Java Date实现加一天,年月日类推往后+1,日期+1,月份+1,年份+1

    System.out.println("String类型 "+endDate); //页面传递到后台的时间 为String类型 SimpleDateFormat sdf = new ...

  9. 熔断监控面板(Hystrix Dashboard)

    Hystrix Dashboard Hystrix-dashboard是一款针对Hystrix进行实时监控的工具,通过Hystrix Dashboard我们可以在直观地看到各Hystrix Comma ...

  10. centos6.5+python2.7+flask+apache+mod-wsgi部署

    flask部署,使用的是centos6.5,python2.7,版本很重要.基本步骤如下: 一.创建虚拟环境,创建目录把项目拷进去 二.安装mod-wsgi和apache easy_install m ...