`
caiyingying234
  • 浏览: 26718 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

js闭包浅谈

JavaScript闭包 
阅读更多 
<html>
<head>

</head>
<body>

	<input type="button" value="button1"/>
	<input type="button" value="button2"/>
	<input type="button" value="button3"/>
	<input type="button" value="button4"/>
	<input type="button" value="button5"/>
	<script type="text/javascript">
		var x = document.getElementsByTagName("input");
		
		function add_event_handlers(nodes){//外部函数
			var i;
			for(i = 0; i<nodes.length;i+=1){
				nodes[i].onclick = function(e){ //内部函数
						alert(i);	
				}
				}
			}
			add_event_handlers(x);
	</script>
	<p>
		我们想要button提示出它的序号。但是结果却不尽如人意。
	</p>
	<p>
		为什么点击每个button的时候都是弹出来5，而不是我们想要的button的序列呢，究其原因是alert(i)中调用了i，这个i是在这个函数的外部的，
	  ,当我们在外部函数（add_event_handlers）的外面调用了内部函数，从而产生了闭包。
	  闭包允许你引用存在于外部函数中的变量。然而，它并不是使用该变量创建时的值，相反，它使用外部函数中该变量最后的值。
	  也就是说，内部函数传递的参数i并不是单纯的值，传的是一个引用，也就是实实在在的i，当然取到的是最后的值。
	</p>
	<p>
	  那我们应该实现我们的目的呢，学过c语言的都知道，传值和传址（传的引用）。我们这里可以把内部函数改成立即执行。
	  这时候取到的就是我们想要的i了。
	 </p>
	 <pre>
	  function add_event_handlers(nodes){//外部函数
			var i;
			for(i = 0; i<nodes.length;i+=1){
				nodes[i].onclick = function(i){ //内部函数
					return function(e){
						alert(i);	
				  }
				}(i);
				}
			}
	</pre>
	
</body>
</html>
分享到：
| 编辑器粘贴过滤技术详解
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    关于JS中的闭包浅谈.docx

    JavaScript中的闭包是一种高级特性，它是函数和其周围状态（变量环境）的组合，使得即使在函数执行完毕后，这个状态依然能够被保留。闭包的主要特点在于它可以访问到定义时的作用域，即使该作用域在函数外部是不可见...

    浅谈js 闭包引起的内存泄露问题

    在JavaScript编程中，闭包是一个非常重要的概念，它的特性使得函数可以访问到外部函数作用域中的变量。然而，闭包如果使用不当，非常容易引起...通过以上措施，可以最大限度地减少JavaScript闭包所带来的内存泄漏问题。

    浅谈JavaScript for循环 闭包_.docx

    浅谈JavaScript for循环闭包 在JavaScript中，for循环和闭包是两个非常重要的概念。本文将对JavaScript for循环和闭包进行浅谈，并提供六种解决方案来解决for循环中的闭包问题。 首先，让我们来看一个例子。我们有...

    关于JS中的闭包浅谈

    闭包是JavaScript编程中一个核心且高级的概念，理解闭包对掌握JavaScript函数式编程风格至关重要。首先，闭包是指有权访问另一个函数作用域中的变量的函数。换句话说，闭包是一个函数和声明该函数的词法环境的组合，...

    浅谈JavaScript闭包

    JavaScript闭包是前端开发中非常重要且基础的概念，它允许一个函数访问并操作函数外部的变量。具体来说，闭包就是一个函数和声明该函数的词法环境的组合。在JavaScript中，闭包允许内层函数持续访问外层函数的作用域...

    浅谈js闭包理解

    在JavaScript中，闭包是一种强大的特性，它允许函数访问并操作其外部作用域中的变量，即使在其外部函数已经执行完毕之后。这种特性使得闭包成为实现数据隐藏、封装和持久化状态的有效工具。 首先，让我们深入理解...

    浅谈JS闭包中的循环绑定处理程序

    这正是JavaScript闭包的强大之处，它允许我们创建具有持久状态的函数，即使这些函数是在其他函数的上下文中定义的。 理解闭包在循环绑定处理程序中的应用是JavaScript开发中的重要概念，它可以帮助我们避免一些常见...

    【JavaScript源代码】浅谈react useEffect闭包的坑.docx

    在JavaScript中，闭包是指能够读取其他函数内部变量的函数。在本例中，问题出现在`useEffect`中注册的点击事件处理器函数`clickHandle`能够访问外部作用域中的变量`v`。这种现象在某些情况下可能导致预料之外的结果...

    根据一段代码浅谈Javascript闭包

    } 这里的闭包是f1，封闭了一个变量n和一个函数f2。 我们先无视nAdd，尽量保持原貌重写一下这个函数。 代码如下: function f1(){ var n = 999; var f2 = function(){ alert&#40;n&#41;; }; return f2; } var result ...

    浅谈JavaScript的闭包函数

    闭包在JavaScript中是一个至关重要的概念，它常常让人困惑，有时甚至被误认为与匿名函数相同。实际上，闭包是一种特殊的函数，它具备访问并存储其父级（或外部）函数作用域中变量的能力，即使在父级函数执行完毕后，...

    浅谈javascript的闭包

    JavaScript中的闭包是一种强大的特性，它允许内部函数访问并操作外部函数的变量，即使外部函数已经执行完毕。这种机制基于JavaScript的作用域链和垃圾回收机制。 首先，我们要理解作用域链。每当JavaScript执行一个...

    浅谈JavaScript for循环 闭包

    这些解决方案展示了JavaScript闭包和作用域的复杂性，以及如何通过不同的技术手段来控制函数作用域内的变量访问。在实际的前端开发工作中，根据具体情况选择合适的解决方案是非常重要的。对for循环和闭包的理解能够...

    浅谈javascript中的闭包

    Javascript中有几个非常重要的语言特性——对象、原型继承、闭包。其中闭包 对于那些使用传统静态...本文将以例子入手来介绍Javascript闭包的语言特性，并结合一点 ECMAScript语言规范来使读者可以更深入的理解闭包。

    浅谈Javascript嵌套函数及闭包

    在探讨JavaScript嵌套函数及闭包之前，我们必须了解一些基础知识。首先是JavaScript中的函数，它们是JavaScript编程的核心。函数在JavaScript中是“一等公民”，这意味着函数可以作为参数传递给其他函数，也可以作为...

Magicbox
Global site tag (gtag.js) - Google Analytics