通过文你将学到:

1.闭包是怎么回事儿?

2.闭包的原理和在jquery中的应用

3.从一到面试题彻底理解闭包和垃圾回收机制

4.闭包在jquery中的应用

概述

经常听到闭包这个词儿,或者匿名函数自执行,之类的。到底他们是一个东西吗?

1.什么是闭包?

​ 我不想扣定义,直接上例子。

function parent(firstname){
return function(lastname){
console.log(firstname+'·屌·'+lastname);
}
}
parent('尼古拉斯')('大彬哥');

看图:

函数执行完以后会销毁(这里我就不谈堆栈操作了理解图就行了),然后各种变量会垃圾回收,而这里parent函数确实销毁了,但是firstName这个参数并没有垃圾回收,释放内存,依然在内存中能够被return里面的函数使用,好像return里面的函数把 父函数的那个资源给关闭在了自己的函数里面一样,这个函数销毁资源被关闭到子函数中依然能够使用的现象叫做闭包。

注意匿名函数自执行只是产生闭包的一种情况,闭包是现象或者情形,不实用匿名函数自执行也有很多情况产生闭包,所以而且根本就是两回事儿,不能混淆。

类比,在window系统中,你子文件夹中有使用的文件父文件夹是没法删除的。

2.实际应用,情况很多,先来一道面试题。

        function fn{
var arr = [];
for(var i = 0;i<3;i++){
arr.push(function(){
console.log(i);
});
}
return arr;
}
var arrFn = fn();
arrFn[0]();//3
arrFn[1]();//3
arrFn[2]();//3

与这个类似的一个题是循环里面用事件,事件里面的i有问题,如下。

for(var i = 0;i<aBtn.length;i++){
aBtn[i].onclick = function(){
alert(i);//3
};
}

还有一到非常爱考的面试题,

for(var i = 0;i<3;i++){
setTimeout(function(){
alert(i);
});
}

我只分析一个,其它的大家就会分析了。注意表象上粗略的理解就是 函数执行一瞬间,并不会等定时器,但是这个说法并不对,因为第一个就说不通。好我给记大家进入内部深入分析下过程。

记住一句话,函数定义压入arr的时候并没有执行。

小测验,你能看出下面的程序用了闭包吗?

function show(){
var a = 12;
setTimeout(function(){
console.log(a);
},1000);
}

3.闭包在jquery中使用。

闭包无处不在,直接看jquery的例子。


$('#btn').click(function(){
var json = {};
ajax(url,function(data){
json =dada;
}); });

体验javascript之美第五课 五分钟彻底明白 匿名函数自执行和闭包的更多相关文章

  1. 体验js之美第八课-面向对象创建和继承终结篇

    概述 到这里我们讲说js面向对象的系列部分的最后一个课程,面向对象必须掌握两个东西一个是对象的创建一个是继承.这节课我们重点说说这两个问题最后我们说下在ES6里面面向对象怎么玩. 1对象的创建 我们第 ...

  2. 体验javascript之美6:如果你觉得什么都会了或者不知道js学什么了看这里-面向对象编程

    概述 当大家已经把js的语言基础理解了,然后能够写出一些简单的例子了,这个时候基本上达到了一年工作经验的水平,而自己能够独立的写一些小功能,完成一些小效果,或者临摹修改一些比较复杂的插件的时候差不多就 ...

  3. Javascript 函数声明、函数表达式与匿名函数自执行表达式

    函数表达式(Function Expression)注:将函数定义为表达式语句(通常是变量赋值)的一部分 //func() 错误 var func = function () { } //func() ...

  4. javascript高逼格代码实现数组去重,JSON深度拷贝,匿名函数自执行,数字取整等

    1.如何装逼用代码骂别人傻逼 (!(~+[])+{})[--[~+""][+[]]*[~+[]] + ~~!+[]]+({}+[])[[~!+[]]*~+[]] 2.如何优雅的用代 ...

  5. javascript匿名函数自执行 (function(window,document,undefined){})(window,document);

    使用匿名自执行函数的作用: (function(window,document,undefined){})(window,document); 1.首先匿名函数 (function(){}) (); ...

  6. [译]Quartz.NET 框架 教程(中文版)2.2.x 之第五课 SimpleTrigger

    第五课 SimpleTrigger 如果你需要在一个指定时间段内执行一次作业任务或是在指定的时间间隔内多次执行作业任务,SimpleTrigger应该能满足你的调度需求.例如,你希望触发器在2015年 ...

  7. JavaScript(第十五天)【匿名函数和闭包】

      学习要点: 1.匿名函数 2.闭包 匿名函数就是没有名字的函数,闭包是可访问一个函数作用域里变量的函数.声明:本节内容需要有面向对象和少量设计模式基础,否则无法听懂.(所需基础15章的时候已经声明 ...

  8. JavaScript中的匿名函数及函数的闭包

    1.匿名函数 函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没有函数名的函数. 1.1 函数的定义,首先简单介绍一下函数的定义,大致可分为三种方式 第一种: ...

  9. JavaScript中的闭包和匿名函数

    JavaScript中的匿名函数及函数的闭包   1.匿名函数 2.闭包 3.举例 4.注意 1.匿名函数 函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没 ...

随机推荐

  1. Kubernetes上安装Metrics-Server

    操作场景 metrics-server 可实现 Kubernetes 的 Resource Metrics API(metrics.k8s.io),通过此 API 可以查询 Pod 与 Node 的部 ...

  2. petite-vue-源码剖析-v-for重新渲染工作原理

    在<petite-vue源码剖析-v-if和v-for的工作原理>我们了解到v-for在静态视图中的工作原理,而这里我们将深入了解在更新渲染时v-for是如何运作的. 逐行解析 // 文件 ...

  3. 【转载】SQL复杂实例

    from:http://blog.csdn.net/basycia/article/details/52134320       OR       from:http://www.wzsky.NET/ ...

  4. elasticsearch高亮之词项向量

    一.什么是词项向量 词项向量(term vector)是有elasticsearch在index document的时候产生,其包含对document解析过程中产生的分词的一些信息,例如分词在字段值中 ...

  5. LGP3449题解

    其实每个串都不是回文串也能做的说... 题意:给定 \(n\) 个互不相同的串,两两拼接一共能够拼出 \(n^2\) 个串,问这 \(n^2\) 个串中有几个回文串. 首先假设拼接出来的串是 \(AB ...

  6. vue/cli项目添加外部js文件的一个方法

    有一个util.js文件,内容如下 function Util () { ... } export default new Util() 可以在main.js里面通过import引入js import ...

  7. 电子检索实体书「GitHub 热点速览 v.22.12」

    不知道有没有小伙伴遇到实体书快速定位指定内容的问题,凭借着记忆里很难快速翻阅到正确的页数,但 paperless-ngx 也许能帮上你的忙,它除了能将你的实体书籍电子化变成文件库里的一员之外,还能帮你 ...

  8. python3求200以内能被17整除的最大正整数

    for i in range(200, 17,-1): if(i%17==0): print(i) break

  9. &取地址运算符

    &可以取得一个变量在内存当中的地址 Register int a; //这种变量不在内存里面,而在CPU里面,是没有地址的, 所以寄存器变量(register)不能用&来取得变量 在计 ...

  10. springboot 踩坑之路之 Configuration Annotation Proessor not found in classpath

    1.出现spring boot Configuration Annotation Proessor not found in classpath的提示是在用了@ConfigurationPropert ...