javascript进阶系列专题:闭包(Closure)
在javascript中,函数可看作是一种数据,可以赋值给变量,可以嵌套在另一个函数中。
var fun = function(){
console.log("平底斜");
}
function fun(){
var n=10;
function son(){
n++;
}
son();
console.log(n);
}
fun(); //11
fun(); //11
我们把上面第二段代码稍微修改下:
var n=10;
function fun(){
function son(){
n++;
}
son();
console.log(n);
}
fun(); //11
fun(); //12
看出差别了吗,如果理解不了代码执行结果,请看上一篇博文,关于javascript作用域和作用域链的讲解。
上面这段代码中变量n是全局变量,随时可能被重新赋值,而无需通过fun函数的调用。为了让变量n不受污染,或者说是减少全局变量的污染,我们需要把n放到函数中作为局部变量。
function fun(){
var n=10;
function son(){
n++;
console.log(n);
}
son();
}
fun(); //
fun(); //
如果我们可以在全局中直接调用son函数,那么便可以达成想要的效果。son函数现在是作为局部变量存在,要想在全局中访问,一般有两种方法:
一种是赋值给全局变量
var a;
function fun(){
var n=10;
a = function son(){
n++;
console.log(n);
}
}
fun(); //son()
a(); //
a(); //
另一种是使用return返回值
function fun(){
var n=10;
return function son(){
n++;
console.log(n);
}
}
var a=fun();
a(); //
a(); //
上面的son()函数就是闭包,某种意义上所有函数都可以看作闭包。闭包就是可以访问外层函数作用域的变量的函数。
var a;
function fun(){
var n=10;
a = function son(){
n++;
console.log(n);
}
return a();
}
fun(); //11
a(); //12
a(); //13
fun(); //11
a(); //12
a(); //13
还是上面那段代码,我们稍微修改下,再看看执行结果,这是因为每次执行fun()函数时都会初始化变量n。
闭包的好处是减少全局变量,避免全局污染,可以将局部变量保存在内存中。但这既是优点又是缺点,一段代码中如果闭包过多,有可能造成内存泄露。由于闭包中局部变量不会被垃圾回收机制回收,所以需要手动赋值为null(关于内存泄露,后期单独开专题)
javascript进阶系列专题:闭包(Closure)的更多相关文章
- javascript进阶系列专题:作用域与作用域链
字面意思,作用域是指变量和函数的作用范围,换言之,作用域决定了变量和函数的可见性和有效时间.javascript作用域是用函数来区分,与其他语言的大括号不同. for (var i=0; i<5 ...
- JavaScript进阶系列01,函数的声明,函数参数,函数闭包
本篇主要体验JavaScript函数的声明.函数参数以及函数闭包. □ 函数的声明 ※ 声明全局函数 通常这样声明函数: function doSth() { alert("可以在任何时候调 ...
- JavaScript进阶系列07,鼠标事件
鼠标事件有Keydown, Keyup, Keypress,但Keypress与Keydown和Keyup不同,如果按ctrl, shift, caps lock......等修饰键,不会触发Keyp ...
- JavaScript进阶系列06,事件委托
在"JavaScript进阶系列05,事件的执行时机, 使用addEventListener为元素同时注册多个事件,事件参数"中已经有了一个跨浏览器的事件处理机制.现在需要使用这个 ...
- JavaScript进阶系列05,事件的执行时机, 使用addEventListener为元素同时注册多个事件,事件参数
本篇体验JavaScript事件的基本面,包括: ■ 事件必须在页面元素加载之后起效■ 点击事件的一个简单例子■ 为元素注册多个点击事件■ 获取事件参数 ■ 跨浏览器事件处理 □ 事件必须在页面元素加 ...
- JavaScript进阶系列04,函数参数个数不确定情况下的解决方案
本篇主要体验函数参数个数不确定情况下的一个解决方案.先来看一段使用函数作为参数进行计算的实例. var calculate = function(x, y, fn) { return fn(x, y) ...
- JavaScript进阶系列03,通过硬编码、工厂模式、构造函数创建JavaScript对象
本篇体验通过硬编码.工厂模式.构造函数来创建JavaScript对象. □ 通过硬编码创建JavaScript对象 当需要创建一个JavaScript对象时,我们可能这样写: var person = ...
- JavaScript进阶系列02,函数作为参数以及在数组中的应用
有时候,把函数作为参数可以让代码更简洁. var calculator = { calculate: function(x, y, fn) { return fn(x, y); } }; var su ...
- [C#进阶系列]专题二:你知道Dictionary查找速度为什么快吗?
一.前言 在之前有一次面试中,被问到你了解Dictionary的内部实现机制吗?当时只是简单的了问答了:Dictionary的内部结构是哈希表,从而可以快速进行查找.但是对于更深一步了解就不清楚了.所 ...
随机推荐
- Bootstrap栅格系统详解,响应式布局
Bootstrap栅格系统详解 栅格系统介绍 Bootstrap 提供了一套响应式.移动设备优先的流式栅格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列. 栅格系统用于通 ...
- Mac OS下基于Eclipse的Android调试环境搭建
1.安装Eclipse:http://www.eclipse.org/downloads/,网页会自动检测适用的版本(Mac OS x64),下载“Eclipse IDE for java Devel ...
- PHP动态图像的创建要如何实现呢?
with-gd=[/path/to/gd] --with-jpeg-dir=[/path/to/jpeg-6b] --with-t1lib=[/path/to/t1lib] 完成添加后执行make命 ...
- Linux常用命令小结(续)
20. mysql mysql --host=127.0.0.1 --port=3306 --database=test --user=test --password=test --default-c ...
- javascript之聊天室(单机)来自于冷的锋刃
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- args[0]
java程序有一个主方法,是这样的public static void main(String [] args)你说的args[0]就是你用命令行编译运行java程序时,传入的第一个参数,比如你运行一 ...
- 终于搞定office 2013中文双引号无法匹配问题啦!!!
设计>>字体>>自定义字体>>所有字体改为宋体>>保存>>点击字体确认当前字体是自己刚新建的>>点击旁边设为默认值>> ...
- Network Wars-ZOJ2676最小割+01规划
Time Limit: 5 Seconds Memory Limit: 32768 KB Special Judge Network of Byteland consists of n servers ...
- ASP.NET Core 使用 AutoFac 注入 DbContext
DI 1.0 -- 通过 RegisterInstance 注入 一开始,并不是很懂 AutoFac 的用法,又因为要使用特定的构造器和参数来初始化 DbContext,所以我想到的办法就是使用 Re ...
- [转]Part1: Understanding !PTE , Part 1: Let’s get physical
http://blogs.msdn.com/b/ntdebugging/archive/2010/02/05/understanding-pte-part-1-let-s-get-physical.a ...