体验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中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没 ...
随机推荐
- bower install 报错fatal: unable to access 'https://github.com/angular/bower-angular-touch.git/'类错误解决方法
bower install时出现很多unable to access 'https://github.com/angular/bower-angular-touch.git/'类似的错误, 方法一:( ...
- 基于JQuery打造无缝滚动新闻
JQuery实现 新闻无缝滚动 一.使用"首尾追加"实现无缝滚动 <head lang="en"> <meta charset="U ...
- JZ-038-二叉树的深度
二叉树的深度 题目描述 输入一棵二叉树,求该树的深度.从根结点到叶结点依次经过的结点(含根.叶结点)形成树的一条路径,最长路径的长度为树的深度. 题目链接: 二叉树的深度 代码 /** * 标题:二叉 ...
- DDos攻击竟然这么恐怖,它的原理是什么?
DDOS的定义 分布式拒绝服务(DDoS:Distributed Denial of Service)攻击指借助于客户/服务器技术,将多个计算机联合起来作为攻击平台,对一个或多个目标发动DDoS攻击, ...
- php 访问java接口数据
$header = []; $header[] = 'Accept:application/json'; $header[] = 'Content-Type:application/json;char ...
- php pdf添加水印(中文水印,图片水印)
1.下载软件包 链接:https://pan.baidu.com/s/1cah-mf-SCtfMhVyst_sG8w&shfl=sharepset 提取码:ld8z 2.下载pdf_water ...
- clang的线程安全分析模块 thread safety analysis
介绍 Clang的线程安全分析模块是C++语言的一个扩展,能对代码中潜在的竞争条件进行警告.这种分析是完全静态的(即编译时进行),没有运行时的消耗.当前这个功能还在开发中,但它已经具备了足够的成熟度, ...
- vue结合antV/g6 实现网络拓扑图
最近很多业务场景都会需要用到拓扑图,翻找了很多资料,最后选择了antV/g6,主要原因有以下几点: 1.阿里出品,所以框架的成熟性有保障 2.业务场景契合(1.规则拓扑图:2.动画流向:每个节点会有流 ...
- 监听页面中的某个div的滚动事件,并将其滚动距离保存到cookie
在html中,写一个id为type的div: <div class="type" id="type"></div> css: .type ...
- java 实现装饰器设计模式
package com.gylhaut.base; /** * 装饰器 * 类与类之间的关系 * 1.依赖:形参(局部变量) * 2.关联:属性 * 聚合 属性 整体和部分 不一致的生命周期 人和手 ...