三个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,假设某天接口有所变动,改起来就十分麻烦了. ...
随机推荐
- java中system.out.println()是什么意思
在Java编程中,我们常常用System.out.println()方法来输出字符串,也许我们都已经猜到println()是方法名,但System是什么,out又是什么呢?这里就涉及用到一个stati ...
- vs2010帮助文档下载以及帮助查看器(H3Viewer)的使用
在工作中遇到想查看vs2010的帮助文档.推荐使用H3Viewer.一个第三方的免费软件,独立于VS2010运行的帮助查看器.这方面的资料并不多.把本次自己使用的心得分享给大家. H3Viewer官方 ...
- mongo 初级使用
1.找到mongo所在地址 cd /usr/bin 2.进入mongo 命令:mongo mongo:端口(默认27017) ps:我用的是30005 3.选择使用的database 命令:use 自 ...
- 4.当接口的请求方式为 application/json的时候时
1..当接口的请求方式为 application/json的时候时,使用抓包软件(fiddler)获取到这个接口, 其中的Inspectprs-TextView中的内容就是jmeter中Body Da ...
- Vue.js 指南-基础
Installation 可以使用的方式: script标签方式加载vue.js cdn https://unpkg.com/vue@2.0.5/dist/vue.js npm Introductio ...
- C#中的??是什么意思
C#中的??是什么意思 DJ8Angus | 浏览 49982 次 2012-01-16 12:07 2012-01-16 12:23 最佳答案 如果不赋予初值,C#的变量是不允许直接使用的 ...
- Misha and Palindrome Degree
Misha and Palindrome Degree 题目链接:http://codeforces.com/problemset/problem/501/E 贪心 如果区间[L,R]满足条件,那么区 ...
- Java反序列化漏洞分析
相关学习资料 http://www.freebuf.com/vuls/90840.html https://security.tencent.com/index.php/blog/msg/97 htt ...
- 《JS权威指南学习总结--8.8.3 不完全函数》
内容要点: 本节讨论的是一种函数变换技巧,即把一次完整的函数调用拆成多次函数调用,每次传入的实参都是完整实参的一部分,每个拆分开的函数叫做不完全函数(partial function),每次函数调用叫 ...
- JS复习:第三章&第四章
第三章 一.把一个值转换成字符串的两种方法: 1.使用每个值都有的toString( )方法.这个方法唯一要做的就是返回相应值的字符串表现.例如: var age = 11 ; var ageAsSt ...