体验javascript之美第五课 五分钟彻底明白 匿名函数自执行和闭包
通过文你将学到:
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之美第五课 五分钟彻底明白 匿名函数自执行和闭包的更多相关文章
- 体验js之美第八课-面向对象创建和继承终结篇
概述 到这里我们讲说js面向对象的系列部分的最后一个课程,面向对象必须掌握两个东西一个是对象的创建一个是继承.这节课我们重点说说这两个问题最后我们说下在ES6里面面向对象怎么玩. 1对象的创建 我们第 ...
- 体验javascript之美6:如果你觉得什么都会了或者不知道js学什么了看这里-面向对象编程
概述 当大家已经把js的语言基础理解了,然后能够写出一些简单的例子了,这个时候基本上达到了一年工作经验的水平,而自己能够独立的写一些小功能,完成一些小效果,或者临摹修改一些比较复杂的插件的时候差不多就 ...
- Javascript 函数声明、函数表达式与匿名函数自执行表达式
函数表达式(Function Expression)注:将函数定义为表达式语句(通常是变量赋值)的一部分 //func() 错误 var func = function () { } //func() ...
- javascript高逼格代码实现数组去重,JSON深度拷贝,匿名函数自执行,数字取整等
1.如何装逼用代码骂别人傻逼 (!(~+[])+{})[--[~+""][+[]]*[~+[]] + ~~!+[]]+({}+[])[[~!+[]]*~+[]] 2.如何优雅的用代 ...
- javascript匿名函数自执行 (function(window,document,undefined){})(window,document);
使用匿名自执行函数的作用: (function(window,document,undefined){})(window,document); 1.首先匿名函数 (function(){}) (); ...
- [译]Quartz.NET 框架 教程(中文版)2.2.x 之第五课 SimpleTrigger
第五课 SimpleTrigger 如果你需要在一个指定时间段内执行一次作业任务或是在指定的时间间隔内多次执行作业任务,SimpleTrigger应该能满足你的调度需求.例如,你希望触发器在2015年 ...
- JavaScript(第十五天)【匿名函数和闭包】
学习要点: 1.匿名函数 2.闭包 匿名函数就是没有名字的函数,闭包是可访问一个函数作用域里变量的函数.声明:本节内容需要有面向对象和少量设计模式基础,否则无法听懂.(所需基础15章的时候已经声明 ...
- JavaScript中的匿名函数及函数的闭包
1.匿名函数 函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没有函数名的函数. 1.1 函数的定义,首先简单介绍一下函数的定义,大致可分为三种方式 第一种: ...
- JavaScript中的闭包和匿名函数
JavaScript中的匿名函数及函数的闭包 1.匿名函数 2.闭包 3.举例 4.注意 1.匿名函数 函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没 ...
随机推荐
- vue初步构建项目
新建项目文件夹 在当前文件夹打开命令行工具(shift+右键-->在次此处打开命令窗口) npm install -g vue-cli npm init webpack npm install ...
- appium滚动查找屏幕外的控件
嗯,还是把自己做的实验保存一下 Appium1.12.1+python2.7 实验滚动,查找屏幕外控件以及控制seekbar scroll() 是根据页面中两个元素位置之间的距离进行滑动. 滑动寻找屏 ...
- JZ-064-滑动窗口的最大值
滑动窗口的最大值 题目描述 给定一个数组和滑动窗口的大小,找出所有滑动窗口里数值的最大值.例如,如果输入数组{2,3,4,2,6,2,5,1}及滑动窗口的大小3,那么一共存在6个滑动窗口,他们的最大值 ...
- ws请求定时
heartChechInit() { const _this = this; // 设置统筹管理 let heartCheck = { timer: ...
- laravel resource风格
resource 风格 概念 一种软件架构风格.设计风格,而不是标准,只是提供了一组设计原则和约束条件.它主要用于客户端和服务器交互类的软件.基于这个风格设计的软件可以更简洁,更有层次,更易于实现缓存 ...
- 如何在 MWeb 中配置 Hexo 等静态网站
原文链接 参考链接: https://zh.mweb.im/mweb-1.4-add-floder-octpress-support.html https://zhuanlan.zhihu.com/p ...
- Linux环境下安装配置JDK1.8
最近在搞虚拟机,记录下虚拟机内java环境的搭建流程 一.下载合适版本的jdk 此处选择JDK1.8,各位同学可以根据自己的需求选择对应的版本,下载地址为: https://www.oracle.co ...
- ## [湖南省赛2019]Findme ###
[湖南省赛2019]Findme 1.题目概述 2.解题过程 010打开这几张图片 先简单分析一下这几张图片 简单分析 1.png 从外观上,1.png明显高度太低,需要更改 2.png 2.png末 ...
- NaviCat连接提示驱动程序IM004错误
今天一打开NaviCat提示驱动程序IM004错误,百度了好几种方法都不起作用,多次尝试后总结出一套方法: 一.到控制面板--卸载程序--卸载NaviCat Clien 注意可能有多个版本的,2008 ...
- Mariadb开启密码复杂度
mariadb开启密码复杂度 #安装插件# INSTALL SONAME 'simple_password_check'; #设置输入错误多少次锁定# set global max_password_ ...