JavaScript中的闭包理解
原创文章,转载请注明:JavaScript中的闭包理解 By Lucio.Yang
1.JavaScript闭包
在小学期开发项目的时候,用node.js开发了服务器,过程中遇到了node.js的第一个陷阱:由事件和回调函数形成的特殊的循环。解决这个问题时我使用了创建闭包的方法,当然如果不需要控制循环的变量的话也可以使用数组的forEach函数。最近ES6在紧锣密鼓的准备,新标准里面的Harmony Generator和yield十分引人瞩目,也可以用来决解这个问题。这是后话了。
这里来着重介绍一下js的闭包这一重要特性。
首先什么是闭包?
1.1闭包的概念解释
闭包(wikipedia):In programming languages, a closure (also lexical closure or function closure) is a function or reference to a function together with a referencing environment—a table storing a reference to each of the non-local variables (also called free variables or upvalues) of that function.
也就是说,闭包是一个函数或者函数的引用,并绑定了一些变量和其生存环境。
通过以下闭包的两个简单的用途来看闭包的概念。
1.提取函数内部的变量
function f1(){
n=999;
function f2(){
alert(n);
}
return f2;
}
var result=f1();
result(); //
函数f2就被包括在函数f1内部,这时f1内部的所有局部变量,对f2都是可见的。但是反过来就不行,f2内部的局部变量,对f1 就是不可见的。这就是Javascript语言特有的“链式作用域”结构(chain scope)。简单来说,作用域链就是函数在定义的时候创建的,用于寻找使用到的变量的值的一个索引,而他内部的规则是,把函数自身的本地变量放在最前面,把自身的父级函数中的变量放在其次,把再高一级函数中的变量放在更后面,以此类推直至全局对象为止。当函数中需要查询一个变量的值的时候,js解释器会去作用域链去查找,从最前面的本地变量中先找,如果没有找到对应的变量,则到下一级的链上找,一旦找到了变量,则不再继续。如果找到最后也没找到需要的变量,则解释器返回undefined。正是因为这种机制,闭包才能提取父级函数内部的变量。
2.在内存中保有某些变量。
function f1(){
var n=999;
nAdd=function(){n+=1}
function f2(){
alert(n);
}
return f2;
}
var result=f1();
result(); //
nAdd();
result(); //
首先明确一点,在函数内部定义变量/函数的时候,如果不用var,那么该变量/函数就是全局变量/函数。
result实际上就是闭包f2函数。它一共运行了两次,第一次的值是999,第二次的值是1000。这证明了,函数f1中的局部变量n一直保存在内存中,并没有在f1调用后被自动清除。为什么会这样呢?原因就在于f1是f2的父函数,而f2被赋给了一个全局变量,这导致f2始终在内存中,而f2的存在依赖于f1,因此f1也始终在内存中,不会在调用结束后,被垃圾回收机制(garbage collection)回收。这里需要解释一下js的内存回收机制。
一般来说,一个函数在执行开始的时候,会给其中定义的变量划分内存空间保存,以备后面的语句所用,等到函数执行完毕返回了,这些变量就被认为是无用的了。对应的内存空间也就被回收了。下次再执行此函数的时候,所有的变量又回到最初的状态,重新赋值使用。但是如果这个函数内部又嵌套了另一个函数,而这个函数是有可能在外部被调用到的。并且这个内部函数又使用了外部函数的某些变量的话。这种内存回收机制就会出现问题。如果在外部函数返回后,又直接调用了内部函数,那么内部函数就无法读取到他所需要的外部函数中变量的值了。所以js解释器在遇到函数定义的时候,会自动把函数和他可能使用的变量(包括本地变量和父级和祖先级函数的变量(自由变量))一起保存起来,也就是构建一个闭包,这些变量将不会被内存回收器所回收,只有当内部的函数不可能被调用以后(例如被删除了,或者没有了指针),才会销毁这个闭包,而没有任何一个闭包引用的变量才会被下一次内存回收启动时所回收。
3.实现对象的封装
var person = function(){
//变量作用域为函数内部,外部无法访问
var name = "default"; return {
getName : function(){
return name;
},
setName : function(newName){
name = newName;
}
}
}(); print(person.name);//直接访问,结果为undefined
print(person.getName());
person.setName("abruzzi");
print(person.getName()); 得到结果如下: undefined
default
abruzzi
这是一个简单的js的对象的封装,只有通过对象才可以访问对象中的变量,实现了变量和环境(对象)的绑定。也就是通过闭包,我们模拟了面向对象语言中的封装对象的模板。
4.高效率的匿名自执行函数
var datamodel = {
table : [],
tree : {}
}; (function(dm){
for(var i = 0; i < dm.table.rows; i++){
var row = dm.table.rows[i];
for(var j = 0; j < row.cells; i++){
drawCell(i, j);
}
} //build dm.tree
})(datamodel);
代码中的闭包实际是用来做UI的初始化,执行一次后临时变量即销毁,这样的机制不会污染全局变量,效率很好。
1.2闭包与匿名函数的概念辨别
首先来看匿名函数的概念:
anonymous function(wikipedia):In computer programming, an anonymous function (also function literal or lambda abstraction) is a function definition that is not bound to an identifier.
简单来说,没有标识符的函数就是匿名函数。一下是匿名函数的一些写法:
(function() {})();最常见到的;
(function(){}());
void function(){};
错 误的写法
function(){}();
关于匿名函数的原理和理解这里就不再赘述。我们只探讨匿名函数和闭包的关系。
再回顾一下闭包的概念中的关键字-“ is a function or reference to a function”,说明只要是函数内部申明的函数是闭包,不管是什么函数。所以,得出结论:
如果匿名函数不在函数内部,就不是闭包。
函数内的匿名函数如果引用了父函数的变量,那么这个匿名函数就成为了一个闭包。
就这么简单"( ̄▽ ̄)"""。所以产生了以下的闭包的定义方法:
var datamodel = {
table : [],
tree : {}
}; (function(dm){
//something
})(datamodel);
参考:javascript深入理解闭包-脚本之家,墓中无人,sunlylorn,十个流年。
JavaScript中的闭包理解的更多相关文章
- 让你分分钟学会Javascript中的闭包
Javascript中的闭包 前面的话: 闭包,是 javascript 中重要的一个概念,对于初学者来讲,闭包是一个特别抽象的概念,特别是ECMA规范给的定义,如果没有实战经验,你很难从定义去理解它 ...
- 难道这就是JavaScript中的"闭包"
其实对于JavaScript中的"闭包"还没真正理解,这次在实际Coding中似乎遇到了"闭包"的问题,仅此摘录,以待深究. 表现为jQuery的post方法回 ...
- 浅谈JavaScript中的闭包
浅谈JavaScript中的闭包 在JavaScript中,闭包是指这样一个函数:它有权访问另一个函数作用域中的变量. 创建一个闭包的常用的方式:在一个函数内部创建另一个函数. 比如: functio ...
- javascript中的闭包解析
学习javaScript已经有一段时间了,在这段时间里,已经感受到了JavaScript的种种魅力,这是一门神奇的语言,同时也是一门正在逐步完善的语言,相信在大家的逐步修改中,这门语言会逐步的完善下去 ...
- 【JS】JavaScript中的闭包
在JavaScript中,闭包指的是有权访问另一个函数作用域中的变量的函数:创建闭包最常见的方式就是在一个函数内创建另一个函数.如下例子: function A(propertyName){ retu ...
- Javascript中的闭包(转载)
前面的话: 闭包,是 javascript 中重要的一个概念,对于初学者来讲,闭包是一个特别抽象的概念,特别是ECMA规范给的定义,如果没有实战经验,你很难从定义去理解它.下面是作者从作用域链慢慢讲到 ...
- 狗日的Javascript中的闭包
前面的话: 闭包,是 javascript 中重要的一个概念,对于初学者来讲,闭包是一个特别抽象的概念,特别是ECMA规范给的定义,如果没有实战经验,你很难从定义去理解它.下面是作者从作用域链慢慢讲到 ...
- [译]Javascript中的闭包(closures)
本文翻译youtube上的up主kudvenkat的javascript tutorial播放单 源地址在此: https://www.youtube.com/watch?v=PMsVM7rjupU& ...
- javaScript中的闭包原理 (译)
这篇文章通过javaScript代码解释了闭包的原理,来让编程人员理解闭包.它不是写给大牛或使用功能性语言进行编程的程序员的.一旦意会了其核心概念,闭包理解起来并不难.然而,你不可能通过阅读任何有关闭 ...
随机推荐
- hdu 5256 序列变换 (LIS变形)
序列变换 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submi ...
- 20151226--easyUI
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
- leetcode Binary Tree Level Order Traversal python
# Definition for a binary tree node. # class TreeNode(object): # def __init__(self, x): # self.val = ...
- struts2中使用ognl表达式时各种符号的使用规则$,#,%
OGNL表达式struts2标签“%,#,$” 一.什么是OGNL,有什么特点? OGNL(Object-Graph Navigation Language),大概可以理解为:对象图形化导航语言.是一 ...
- JBoss部属和EJB调用-EJB3.0入门经典学习笔记(2)
目录 1. 在JBoss中部属 2. 在Tomcat中调用EJB 3. 在JBoss中调用EJB 1. 在JBoss中部属 1) JBoss的配置目录 路径D:\Java\jboss6\serv ...
- zendstudio -chinese
http://archive.eclipse.org/technology/babel/index.php http://www.eclipse.org/babel/downloads.php 注册码 ...
- Fidder 工具使用
Fiddler是最强大最好用的Web调试工具之一,它能记录所有客户端和服务器的http和https请求,允许你监视,设置断点,甚至修改输入输出数据. 使用Fiddler无论对开发还是测试来说,都有很大 ...
- html---id,name和value
id是唯一标识符,不允许有重复值(类似数据表的主键,pk),可以通过它的值来获得对应的html标签对象.(如果在同一页面代码中,出现重复的id,会导致不可预料的错误) js代码可通过document. ...
- Flex4开发笔记(与JAVA交互)
(由于本人也是第一次接触flex开发,因此将开发过程中问题记录留档) 一.数据交换过程 借助BlazeDS可以实现flex与java之间的数据交互,大体流程如下: 1.导入blazeds的文件(配置w ...
- IE9下报错,错误: “JSON”未定义
今天在公司运行的代码好好的,但是拿回家里以后就报错了 结果是IE9,没有设为兼容模式,唉,微软导出都是坑啊.