以前写过一篇关于javascript闭包的随笔,javascript闭包,但是写的不够详细,也没有体现出闭包的强大之处。故作此篇。

众所周知,javascript没有块级作用域,只有函数作用域。那就意味着定义在函数中的参数和变量在函数外部是不可见的,而在一个函数内部任何位置定义的变量,在该函数内部任何地方都可见。这带来的好处是内部函数可以访问定义它们的外部函数的参数和变量。

首先,我们来构造一个简单的对象

 var testObj = {
value: 10,
add: function(inc){
this.value += (typeof inc === "number") ? inc : 1;
}
}; testObj.add();
testObj.value; // testObj.add(2);
testObj.value; //

这样写就有一个问题,value值不能保证不会被非法修改,可以按如下的方法进行修改。

 var testObj = (function(){
var value = 10;
return {
add: function(inc){
value += (typeof inc === "number") ? inc : 1;
},
getValue: function(){
return value;
}
};
})(); testObj.add();
testObj.getValue(); // testObj.add(2);
testObj.getValue(); //

我们可以通用调用一个函数的形式去初始化testObj,该函数会返回一个对象字面量,函数里定义了一个value变量,该变量对add和getValue方法总是可用的,但函数的作用域使得它对其他的程序来说是不可见的。同时,我们还可以得出一个结论,内部函数拥有比它的外部函数更长的生命周期。

我们再继续看一个构造函数调用的例子。

var MyObj = function(str){
this.status = str;
}; MyObj.prototype.getStatus = function(){
return this.status;
}; var obj = new MyObj("javascript");
obj.getStatus(); // "javascript"

这样写并没有错,但是会有一点“多此一举”,为什么要用一个getStatus方法去访问一个本可以直接访问到的属性呢?如果status是私有属性,那当然才有意义。

var obj = function(status){
return {
getStatus: function(){
return status;
}
};
}; var myObj = obj("javascript");
myObj.getStatus(); // "javascript"

这里当我们调用obj的时候,它返回包含getStatus方法的一个新对象,该对象的一个引用保存在myObj中,即使obj已经返回了,但getStatus方法仍然享有访问obj对象的status属性的特权。getStatus方法并不是访问该参数的一个副本,它访问的就是该参数本身。这是可能的,因为该函数可以访问它被创建时所处的上下文环境,这被称为闭包。

javascript闭包详解的更多相关文章

  1. JavaScript 闭包详解

    一.Javascript闭包的用途 事实上,通过使用闭包,我们可以做很多事情.比如模拟面向对象的代码风格:更优雅,更简洁的表达出代码:在某些方面提升代码的执行效率. 1.匿名自执行函数 我们知道所有的 ...

  2. JavaScript事件详解-jQuery的事件实现(三)

    正文 本文所涉及到的jQuery版本是3.1.1,可以在压缩包中找到event模块.该篇算是阅读笔记,jQuery代码太长.... Dean Edward的addEvent.js 相对于zepto的e ...

  3. JavaScript事件详解-Zepto的事件实现(二)【新增fastclick阅读笔记】

    正文 作者打字速度实在不咋地,源码部分就用图片代替了,都是截图,本文讲解的Zepto版本是1.2.0,在该版本中的event模块与1.1.6基本一致.此文的fastclick理解上在看过博客园各个大神 ...

  4. JavaScript正则表达式详解(一)正则表达式入门

    JavaScript正则表达式是很多JavaScript开发人员比较头疼的事情,也很多人不愿意学习,只是必要的时候上网查一下就可以啦~本文中详细的把JavaScript正则表达式的用法进行了列表,希望 ...

  5. JavaScript正则表达式详解(二)JavaScript中正则表达式函数详解

    二.JavaScript中正则表达式函数详解(exec, test, match, replace, search, split) 1.使用正则表达式的方法去匹配查找字符串 1.1. exec方法详解 ...

  6. JavaScript事件详解-zepto的事件实现

    zepto的event 可以结合上一篇JavaScript事件详解-原生事件基础(一)综合考虑源码暂且不表,github里还有中文网站都能下到最新版的zepto.整个event模块不长,274行,我们 ...

  7. javascript 函数详解2 -- arguments

    今天我们接着上篇文章来继续javascript函数这个主题.今天要讲的是函数对像中一个很重要的属性--arguments. 相关阅读: javascript 函数详解1 -- 概述 javascrip ...

  8. [原创]JavaScript继承详解

    原文链接:http://www.cnblogs.com/sanshi/archive/2009/07/08/1519036.html 面向对象与基于对象 几乎每个开发人员都有面向对象语言(比如C++. ...

  9. Python闭包详解

    Python闭包详解 1 快速预览 以下是一段简单的闭包代码示例: def foo(): m=3 n=5 def bar(): a=4 return m+n+a return bar >> ...

随机推荐

  1. spring IOC源码分析(3)

    1.IOC容器的依赖注入 Spring中,依赖注入是在用户第一次向IOC容器索要Bean时触发的(通过getBean方法). 在BeanFactory中我们看到getBean(String…)函数,它 ...

  2. 什么是UI控件

    凡是带有Widget参数的组件都是控件.

  3. 10个最好的 jQuery 视频插件(转)

    在这篇文章中已经收集了 10 个最佳的 jQuery 视频插件,帮助开发人员容易地实现网站播放影片功能.可以显示视频和视频播放列表. 1. Bigvideo.js BigVideo.js 是一个 jQ ...

  4. 关于如何学好游戏3D引擎编程的一些经验[转]

    此篇文章献给那些为了游戏编程不怕困难的热血青年,它的神秘要我永远不间断的去挑战自我,超越自我,这样才能攀登到游戏技术的最高峰 ——阿哲VS自己 QQ79134054多希望大家一起交流与沟通 这篇文章是 ...

  5. vs2015 好用插件

    备用一下,方便自己查阅 Viasfora 高亮,让自己看代码舒服 ClaudiaIDE 更换编辑器背景 Markdown Mode 编辑Markdown Glyphfriend 图像文字支持 Web ...

  6. sjtu1586 Dog

    Description 隔壁村的阿黑的Dog没有跑, 但Dog已经15岁了, 相当于人类达到了79岁. 为了防止Dog患上犬类认知障碍 (Canine cognitive dysfunction, C ...

  7. 1012: [JSOI2008]最大数maxnumber

    单点更新,区间求最大值的题: 可以使用树状数组和线段树: #include<cstdio> #include<cstring> #include<algorithm> ...

  8. UVA 12647 Balloon

    这是一个线段树的题目: 我记得一个月前在cf上也做过一个类似的题目: #include<cstdio> #include<cstring> #include<algori ...

  9. 类型<T> where T:class的用法

    public void Delete<T>(List<T> EntityList) where T : class, new() 就是说T必须是一个类(class)类型,不能是 ...

  10. PHP file_exists() 函数

    定义和用法 file_exists() 函数检查文件或目录是否存在. 如果指定的文件或目录存在则返回 true,否则返回 false. 语法 file_exists(path) 参数 描述 path ...