javascript笔记——闭包
花了三天时间,终于弄清楚闭包的各种写法和注意的事项,以及以前写,经常出错的地方,特此做一个总结,虽然不够专业,但是对于那些初学者来说,绝对对闭包的理解事半功倍。
案例一:
function aa(){
var b=10;
return function cc(){
b++;
alert(b);
}
} aa()();
这个函数调用时,aa()(),有两个括号,第一个是调用aa函数,第二个是执行cc函数。
function test(){
return function(){alert("不做死就不会死!")} }
test()();
第一个括号 执行test函数 返回子函数,第二个括号执行test返回的函数
为什么后面还要加一个括号,以前我直接test()这样调用,但是没有弹出结果,也没有报错。 后来在网友的提示下:再加一个括号,就可以了,注意直接test() 它返回的是子函数的内容,并没有调用子函数,不信你可以输出一下:
alert(test()) ,结果:
,再加上括号,就调用了:
如果觉得很难理解,你可以把它想象返回的不是一个函数,而是一个字符串, :比如:
function test(){
return alert("a+b");
}
test(); 结果:
还有子函数里为什么要写return,?这是因为要在父函数外部调用 。看下面这段代码;
function a(){
var i=0;
function b(){
alert(++i);
}
return b; //返回b函数本身内容,不能写成return b()这样直接执行了 }
var c = a();
c();
这段代码有两个特点:
1、函数b嵌套在函数a内部;
2、函数a返回函数b。
引用关系如图:
这样在执行完var c=a()后,变量c实际上是指向了函数b,再执行c()后就会弹出一个窗口显示i的值(第一次为1)。这段代码其实就创建了一个闭包,为什么?因为函数a外的变量c引用了函数a内的函数b,就是说:
当函数a的内部函数b被函数a外的一个变量引用的时候,就创建了一个闭包。
如果不想用两个括号调用,有两种方式。一是定义一个变量接收子函数返回的值,再执行变量所在的函数,二是子函数直接在里面就调用。 还是拿案例一来说: 可以改成第一种方式。
function aa(){
var b=10;
return function cc(){
b++;
alert(b);
}
}
var dd=aa();
dd();
二: function aa(){
var b=10;
(function cc(){
b++;
alert(b);
})();
}
alert(aa());
结果:11,undefined
为什么第二个会弹出undefined,因为:如果一个函数没有返回值,则会留下一个
undefined
注意如果内部函数在里面执行,那么前面就不要写return, 如:return (function cc(){ b++; alert(b); })(); 此时return在里面没有意义,因为没有返回值 ,就不要写return,就像java 不会写return void一样。函数运行就是个闭包,如果里面的子函数不在里面执行,就要加上return ,然后在父函数外面调用返回的子函数。
下面这个问题困扰我好久,后来在网友的提示下,才弄懂。点击第个li,得到其索引。 问题:里面子函数并没有执行,为什么也能弹出结果?
代码如下:
window.onload=function(){
var li=document.getElementsByTagName("li");
for(var i=0;i<li.length;i++){
li[i].onclick=(function(n){
return function(){
alert(n);
}
})(i);
}
}
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
像 上面那些写法都是要么在里面加上括号,直接调用,要么在父函数外面执行。而这里却没有?
解释:上面的内部的函数被绑定到事件上了
javascript笔记——闭包的更多相关文章
- [Effective JavaScript 笔记]第27条:使用闭包而不是字符串来封装代码
函数是一种将代码作为数据结构存储的便利方式,代码之后可以被执行.这使得富有表现力的高阶函数抽象如map和forEach成为可能.它也是js异步I/O方法的核心.与此同时,也可以将代码表示为字符串的形式 ...
- 深入浅出JavaScript之闭包(Closure)
闭包(closure)是掌握Javascript从人门到深入一个非常重要的门槛,它是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现.下面写下我的学习笔记~ 闭包-无处不 ...
- 【转】深入浅出JavaScript之闭包(Closure)
闭包(closure)是掌握Javascript从人门到深入一个非常重要的门槛,它是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现.下面写下我的学习笔记~ 闭包-无处不 ...
- [Effective JavaScript 笔记]第3章:使用函数--个人总结
前言 这一章把平时会用到,但不会深究的知识点,分开细化地讲解了.里面很多内容在高3等基础内容里,也有很多讲到.但由于本身书籍的篇幅较大,很容易忽视对应的小知识点.这章里的许多小提示都很有帮助,特别是在 ...
- [Effective JavaScript 笔记]第28条:不要信赖函数对象的toString方法
js函数有一个非凡的特性,即将其源代码重现为字符串的能力. (function(x){ return x+1 }).toString();//"function (x){ return x+ ...
- 【转】理解JavaScript之闭包
闭包(closure)是掌握Javascript从人门到深入一个非常重要的门槛,它是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现.下面写下我的学习笔记~ 闭包-无处不 ...
- 深入理解JavaScript的闭包特性如何给循环中的对象添加事件
初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件.在事件响应函数中(event handler)获取对应的索引.但每次获取的都是最后一次循环的索引.原因是初学者并未理解JavaScript ...
- JavaScript作用域闭包简述
JavaScript作用域闭包简述 作用域 技术一般水平有限,有什么错的地方,望大家指正. 作用域就是变量起作用的范围.作用域包括全局作用域,函数作用域以块级作用域,ES6中的let和const可以形 ...
- JavaScript的闭包原理
什么是js(JavaScript)的闭包原理,有什么作用? 一.定义 官方解释:闭包是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分. 个人的理解是 ...
随机推荐
- Codeforces Round #331 (Div. 2)C. Wilbur and Points 贪心
C. Wilbur and Points Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/596/ ...
- UML视图(九)部署图
一.什么是部署图? 部署图对面向对象系统的物理方面建模,描写叙述系统执行时节点.构件实例及其对象的配置.主要用来在部署系统时涉及到的硬件(处理器和设备)进行建模. 二.部署图的组成元素? 部署图主要包 ...
- sublime php语法检查
安装sublimelinter 安装sublimelinter-php 设置sublimelinter 进入SublimeLinter文件夹改动 SublimeLinter.sublime-setti ...
- Web开发接口测试工具——Postman插件的使用(chrome浏览器)
Postman是chrome浏览器的一款插件.Postman 可以模拟 http 请求的发送,并自动解析 JSON 和 XML 的返回数据. 可以手动的去配置各类 parameter,还支持 Basi ...
- [课程相关]homework-07
我读的博客: C++11中值得关注的几大变化 C++11 中的线程.锁和条件变量 C++开发者都应该使用的10个C++11特性 开始使用C++11的9个理由 我的问题: 1.有一句话:“C++像难懂的 ...
- Mysql:表的操作
1.列的添加 2.列的删除 删除多列只需在DROP id 后加, DROP column_name; 3.显示表属性 4.设置默认值 5.删除默认值
- ceph运维命令合集
一.集群 1.启动一个ceph进程 启动mon进程 [root@ceph-adm ~]#203.109 service ceph start mon.ceph-mon1 启动msd进程 [root@c ...
- Telnet客户端连接服务器,看不见字符,只显示横线
Telnet 窗口看不见字符,只显示小横线 在用telnet连接tomcat服务器的 时候,窗口中不显示字符,显示成一个一个的横线 解决办法: 按住“Ctrl+]” 回车解决问题
- Linux基本命令之逻辑测试二
1.首先介绍一个与test一样的测试方式[ expression ](千万注意expression的前后都有空格,没有空格的话会报错) 这个测试方式经常作为if的条件. /home/www这个文件名存 ...
- RestEasy传值方式
一.@pathparam @PathParam 是一个参数注解,可以将一个 URL 上的参数映射到方法的参数上,它可以映射到方法参数的类型有基本类型.字符串.或者任何有一个字符串作为构造方法参数 ...