三个JS函数闭包(closure)例子
闭包是JS较难分辨的一个概念,我只是按自己的理解写下来,如有不对还请指出。
函数闭包是指当一个函数被定义在另一个函数内部时,这个内部函数使用到的变量会被封闭起来形成一个闭包,这些变量会保持形成闭包时设定的值。当内部函数被从外面访问时,它会显示出当时形成闭包时设定的值。下面举例说明:
例一:
<body onload="alert(caculate(1,2))"> </body> </html> <script type="text/javascript"> <!-- function caculate(op1,op2){ var num=6; function add(){ return op1+op2+num; } return add(); } //--> </script>
上面这段代码执行会显示9.
例二:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> New Document </title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> </head> <body onload="init()"> <div>123</div> <div>abc</div> <div>456</div> <div>cde</div> <div>567</div> <div>efg</div> <div>789</div> <div>fgh</div> </body> </html> <script type="text/javascript"> <!-- function init(){ var divs=document.getElementsByTagName("div"); for(var i=0;i<divs.length;i++){ var div=divs[i]; (function(div){ div.onclick=function(){ alert(this.innerHTML); }; })(div); } } //--> </script>
例三:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> New Document </title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> </head> <body onload="init()"> <table border="1"> <tbody id="mytable"> <tr><td>1</td><td>abc</td><td>123</td><td>1000</td></tr> <tr><td>2</td><td>bcd</td><td>456</td><td>10000</td></tr> <tr><td>3</td><td>cde</td><td>567</td><td>10000</td></tr> <tr><td>4</td><td>def</td><td>789</td><td>10000</td></tr> </tbody> </table> </body> </html> <script type="text/javascript"> <!-- function init(){ var table=document.getElementById("mytable"); for(var i=0;i<table.rows.length;i++){ var tr=table.rows[i]; var tds=tr.getElementsByTagName("td"); for(var j=0;j<tds.length;j++){ var td=tds[j]; (function(td){ td.onclick=function(){alert(this.innerHTML)}; })(td); } } } //--> </script>
2017年1月15日12:56:02
三个JS函数闭包(closure)例子的更多相关文章
- js 函数闭包内部返回函数体调用方法难点解答
今天在网上,看到一篇关于js函数难点的文章,js函数的一些难点.在那上面提了一下,关于js函数返回另一个函数的问题,并附上了一道面试题: var add = function(x){ var sum ...
- 彻底搞清js中闭包(Closure)的概念
js中闭包这个概念对于初学js的同学来说, 会比较陌生, 有些难以理解, 理解起来非常模糊. 今天就和大家一起来探讨一下这个玩意. 相信大家在看完后, 心中的迷惑会迎然而解. 闭包概念: 闭包就是有权 ...
- 关于js函数闭包的理解
在开始之前我们先来了解一下函数的变量作用域 JavaScript 变量可以是局部变量或全局变量. 私有变量可以用到闭包. 全局变量 函数可以访问由函数内部定义的变量,如: 实例1 function m ...
- JavaScript学习记录总结(六)——js函数闭包特性
<script type="text/javascript"> function arrdemo(){ var arr=["hello&q ...
- 如何编写高质量的 JS 函数(3) --函数式编程[理论篇]
本文首发于 vivo互联网技术 微信公众号 链接:https://mp.weixin.qq.com/s/EWSqZuujHIRyx8Eb2SSidQ作者:杨昆 [编写高质量函数系列]中, <如何 ...
- VC与JavaScript交互(二) --- 调用JS函数
这一章,我们来动手实践VC调用JS函数. 我们动手写一个HTML,其中包含这样一段JS代码: //[html] <script type="text/javascript"& ...
- 两个实例轻松理解js函数预解析
js函数预解析 例子1: 先上一段代码,看看能不能写出最终的执行结果. console.log(a); var a = 1; console.log(a); function a(){ console ...
- js 函数定义的方式
js 函数定义的方式 一.总结 一句话总结: 最常见就下面三种 最常见:function func1([参数]){/*函数体*/} 将匿名函数赋值给变量:var func2=function([参数] ...
- js函数只执行一次,函数重写,变量控制与闭包三种做法
一.情景需求 调用后台接口需要附带token信息,那么在每个请求的头部添加token的做法就不太优雅了:一个网站请求100次,那就得写添加100次token,假设某天接口有所变动,改起来就十分麻烦了. ...
随机推荐
- Design Pattern - Strategy
Strategy Pattern: The Strategy Pattern defines a family of algorithms,encapsulates each one,and ...
- JAVA读取本地配置文件实例
import java.io.InputStream; import java.util.Properties; public class FileProperties extends Propert ...
- asp.net 后台验证成功(弹出对话框)并跳转?不能实现
原始 Context.Response.Write("<script></script>"); Response.Redirect(); 解决办法: Cli ...
- Enhancing Reliability and Response Times via Replication in Computing Clusters---INFOCOM 2015
[标题] Enhancing Reliability and Response Times via Replication in Computing Clusters [作者] Zhan Qiu an ...
- 在Table的Tbody中实现滚动条滚动
功能描述: 在一个Table中实现表头固定不动,内容部分实现通过滚动条滚动. 实现效果: 当页面宽度变宽时,只有最后一列的宽度会改变. 逻辑实现: 1.将表头和内容分别使用两个table标签包裹,每一 ...
- 运算程序,计算玩判断,Y继续,重复计算,N结束
#include "stdio.h" void main() { /*定义变量,d1,d2:第一.二个数 fu:符号 p1:接收判断号Y/N p2:接收的p1赋给p1 */ int ...
- 闭包&装饰器详解
闭包 先不着急看闭包的定义,让我们从一段示例代码开始.如果将上一个示例稍微修改下: >>> def outer(): ... x = 1 ... def inner(): ... p ...
- Ubuntu操作相关笔记
Eclipse添加图标 #sudo vim /usr/share/applications/eclipse.desktop 写入以下内容 [Desktop Entry] Name=Eclipse Co ...
- Windows下Discuz搭建论坛过程
搭建环境:Win7 + XAMPP5.5 + Discuz3.2 GBK 官方论坛下载安装包,解压,把upload文件夹拷贝到网站文档根目录(例如我的为:D:\IT\XAMPP5.5\htdocs\) ...
- L2-004. 这是二叉搜索树吗?
L2-004. 这是二叉搜索树吗? 题目链接:https://www.patest.cn/contests/gplt/L2-004 这题我的方法是先递归判定是不是二叉搜索树(镜像),再建树输出. 代码 ...