最近去面试了一家企业,结果非常灰心丧气,于是周末给自己定了一个目标

学好一门,学精通一门。不求多,只求懂。

最近看到一个概念“闭包”。

什么是闭包呢?

简单一点就是:看得到多和看得到少的区别。

上面这句话是我自己总结的,或许不太准确。

你能看到的多少这句话该如何理解呢?

下面随便丢一段代码:

var name="Peter";

function outer()

{

  var name="Tom";

  function inner()

  {

    return this.name;
  }   return inner;  //返回函数inner,作为OUTER的一个返回值 } var flag=outer(); alert(flag()); //Peter

 大家也许会比较的疑惑,为什么返回的是Peter而不是Tom?

是不是认为编程的就近原则?

答案是:你还没有很好的理解闭包。

下面的一张图可以帮助大家理解一下,定义了一个flag对象,然后公共的函数是inner的父函数outer,

其实执行的是inner函数,因为outer函数返回对INNER函数的一个引用。

然后alert就是执行这个函数inner了。

我们要理解为什么是Peter而不是Tom,还需要了解一下闭包的作用域链。

那么,什么是作用域链呢?

看下面的代码;

function num()
{
var number=0; //结果为4
//number=0; //结果为1 number++;
}
var number=4;
num(); alert(number);

  如果运行上述代码,在function内加var 和不加var的区别是很大的。

这就是文章下面要提到的JAVASCRIPT链式结构;

如果不声明var,那就表示这是一个全局变量,记住这一点概念很重要。

而在函数内部加了var以后,试想一下,外面的这个number和里面的number就没有任何的关系了,

所以最后的结果是4,是全部的number起作用。

如果没加var关键字,那么number就是属于window下的,默认this指向window(this.number),

外层的var=4会被自动替换成1.

如果想alert的值为4,只有一个办法,把

var number=4;
num();

的顺序替换一下^_^。

闭包的特性之一,就是可以在函数外部通过对象调用到函数内部的局部变量。

就好像是C#中,私有的变量,必须通过getter,setter方法来进行调用一样。

说白了,闭包,就是和上面说的可以类比。

再回到上面的问题,为什么name是window的而非function内部的局部变量的呢?

大家有没有发现 var flag=outer()这句话。

其实flag对象是指向window的。

而这个outer函数其实是返回了一个inner的引用。

所以,inner里的this.name(等同于outer().name)也被变成了一个window对象的引用。

所以,闭包不仅可以在外面访问函数内部的变量,

还可以改变内部变量的值,所以这一点大家要注意了,

非常危险的!慎用闭包。

比如下面的代码

name="Peter";

var obj={

name:"yang",

innerFunc:function()

  {

return function()

{

 return this.name;

}

  }

}

alert(obj.innerFunc()()); //Peter

通过外面可以改变里面局部变量的值,让其指向全局变量。

所以这就相当于形成了一个setter方法。

大家使用闭包的时候一定要小心啊。

另外最后再补充一下:

JAVASCRIPT的链式原理:

1.内部函数B形式参数,实际参数,函数,内部变量。

2.内部函数B的原型prototype

3.外部函数A的形式参数,实际参数,函数,内部变量。

4.WINDOW对象,活动对象(链式的顶端)

另外还有一点要注意,就是在闭包的时候,因为外部可以调用到内部函数的变量,并且是Writable的,所以内部

函数变量是一个“可持久的”,就是可以不受JAVASCRIPT的垃圾回收机制的影响。

而内部函数的变量根据链式原理对于外部的变量也是可持久的,这就造成了内,外的变量都具有可持久性,

这就形成了闭包,不过造成了这些变量越积越多,在内存中,从而影响程序的效率。

这个时候,就要在函数调用结束后删掉一些不必要的变量,否则严重的会造成内存泄漏。

好了,写完了,话说那个人问我怎么写JQUERY的分页,我没答出来,好好努力吧

O(∩_∩)O哈哈~

祝大家周末愉快,我是新手,有写得不合理的地方,请多多指正。


理解JAVASCRIPT 闭包的更多相关文章

  1. 我从来不理解JavaScript闭包,直到有人这样向我解释它...

    摘要: 理解JS闭包. 原文:我从来不理解JavaScript闭包,直到有人这样向我解释它... 作者:前端小智 Fundebug经授权转载,版权归原作者所有. 正如标题所述,JavaScript闭包 ...

  2. 深入理解JavaScript闭包【译】

    在<高级程序设计>中,对于闭包一直没有很好的解释,在stackoverflow上翻出了一篇很老的<JavaScript closure for dummies>(2016)~ ...

  3. 【转】深入理解JavaScript闭包闭包(closure) (closure)

    一.什么是闭包?"官方"的解释是:闭包是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分.相信很少有人能直接看懂这句话,因为他描述 ...

  4. 全面理解Javascript闭包和闭包的几种写法及用途

    好久没有写博客了,过了一个十一长假都变懒了,今天总算是恢复状态了.好了,进入正题,今天来说一说javascript里面的闭包吧!本篇博客主要讲一些实用的东西,主要将闭包的写法.用法和用途.  一.什么 ...

  5. 深入理解JavaScript闭包(closure)

    最近在网上查阅了不少javascript闭包(closure)相关的资料,写的大多是非常的学术和专业.对于初学者来说别说理解闭包了,就连文字叙述都很难看懂.撰写此文的目的就是用最通俗的文字揭开Java ...

  6. 深入理解javascript闭包(一)

    闭包(closure)是Javascript语言的一个难点.也是它的特色,非常多高级应用都要依靠闭包实现. 一.什么是闭包? 官方"的解释是:闭包是一个拥有很多变量和绑定了这些变量的环境的表 ...

  7. 深入理解javascript闭包(一)

    原文转自脚本之家(http://www.jb51.net/article/24101.htm) 闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. ...

  8. 深入理解Javascript闭包概念

    一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域无非就是两种:全局变量和局部变量. Javascript语言的特殊之处,就在于函数内部能够直接读取全局变量 ...

  9. 轻松理解JavaScript闭包

    摘要 闭包机制是JavaScript的重点和难点,本文希望能帮助大家轻松的学习闭包 一.什么是闭包? 闭包就是可以访问另一个函数作用域中变量的函数. 下面列举出常见的闭包实现方式,以例子讲解闭包概念 ...

  10. 【译】理解JavaScript闭包——新手指南

    闭包是JavaScript中一个基本的概念,每个JavaScript开发者都应该知道和理解的.然而,很多新手JavaScript开发者对这个概念还是很困惑的. 正确理解闭包可以帮助你写出更好.更高效. ...

随机推荐

  1. Shell下突破安全狗远程桌面守护

    首先在Shell下把安全狗的安装配置给下来 默认安装路径: C:\Program Files\SafedogServer\SafeDogGuardCenter  找到 ProGuardData.ini ...

  2. C语言中的sizeof()

    sizeof,一个其貌不扬的家伙,引无数菜鸟竟折腰,小虾我当初也没少犯迷糊,秉着"辛苦我一个,幸福千万人"的伟大思想,我决定将其尽可能详细的总结一下. 但当我总结的时候才发现,这个 ...

  3. CYQ.Data V5 MDataTable 专属篇介绍

    前言 以前一两个月才出一篇,这三天有点变态地连续1天1篇(其实都是上周末两天写好的存货). 短期应该没有新的和此框架相关的文章要写了,这应该是最后一篇,大伙且看且珍惜. 前两篇讲数据库读写分离和分布式 ...

  4. 梦想还需有,因它必实现——发现最新版iOS漏洞,OverSky团队专访

    梦想还需有,因它必实现——发现最新版iOS漏洞,OverSky团队专访    “成功了!”,随着一句欢呼声在阿里巴巴西溪园区传出,Cydia的图标出现在一部iOS9.3.4的iPhone6上并成功运行 ...

  5. ASP.NET MVC 5 入门指南汇总

    经过前一段时间的翻译和编辑,我们陆续发出12篇ASP.NET MVC 5的入门文章.其中大部分翻译自ASP.NET MVC 5 官方教程,由于本系列文章言简意赅,篇幅适中,从一个web网站示例开始讲解 ...

  6. 剑指Offer面试题:35.将字符串转换为数字

    一.题目:将字符串转换为数字 题目:写一个函数StrToInt,实现把字符串转换成整数这个功能.当然,不能使用atoi或者其他类似的库函数. 二.代码实现 (1)考虑输入的字符串是否是NULL.空字符 ...

  7. Hadoop学习笔记——搭建

    一搭建环境列表 操作系统:centos6.5 64位 JDK环境:jdk1.7.0_71 hadoop版本:社区版本2.7.2,hadoop-2.7.2-src.tar.gz 主机名 ip 角色 用户 ...

  8. WCF 安全性 之 Windows

    案例下载 http://download.csdn.net/detail/woxpp/4113172 服务端配置代码 <system.serviceModel> <services& ...

  9. bootstrap-material-design-个人总结

    bootstrap-material-design-个人总结: 所需框架:1.boostrapt 3.0+2.jQuery 1.9.1+ 项目目录:Material/├── css/│ ├── boo ...

  10. WCF学习之旅—WCF第二个示例(五)

    二.WCF服务端应用程序 第一步,创建WCF服务应用程序项目 打开Visual Studio 2015,在菜单上点击文件—>新建—>项目—>WCF服务应用程序.在弹出界面的“名称”对 ...