JavaScript闭包

JavaScript闭包闭包内部函数拥有比它的外部函数更长的生命周期!!!函数可以访问它被创建时所处的上下文环境!!!内部函数能访问外部函数的实际变量,而无需复制!实例:/**点击li标签时,调用其onclick事件,执行代码段function(){alert(i);}*此时,i在全局中的值为4*/window.onload=init;functioninit(){ var

大家好,又见面了,我是你们的朋友全栈君。

闭包

内部函数拥有比它的外部函数更长的生命周期!!!
函数可以访问它被创建时所处的上下文环境!!!
内部函数能访问外部函数的实际变量,而无需复制!
实例:

/*
 * 点击li标签时,调用其onclick事件,执行代码段function(){alert(i);}
 * 此时,i在全局中的值为4
 */
window.onload = init;
function init(){
	var lis = document.getElementById("wrap").getElementsByTagName("li");
	var i;
	for(i=0;i<lis.length;i++){
		lis[i].onclick = function(){
			alert(i);	// 结果:点击每个li都弹出4
		};
	}
}

/*
 * 执行onclick过程,调用(2)处函数,并不是调用(1)处函数;
 * 而(1)也存活,存活域中不存在变量i
 */
window.onload = init;
function init(){
	var lis = document.getElementById("wrap").getElementsByTagName("li");
	var i;
	for(i=0;i<lis.length;i++){
		lis[i].onclick = function(i){ //(1)
			return function(){ //(2)
				alert(i);
			};	// 结果:undefined
		}();
	}
}

/*
 * 执行onclick过程,调用(2)处函数,并不是调用(1)处函数;
 * 而(1)也存活,存活域中不存在变量i;
 * 变量i在循环时暂存储到了匿名函数中
 */
window.onload = init;
function init(){
	var lis = document.getElementById("wrap").getElementsByTagName("li");
	var i;
	for(i=0;i<lis.length;i++){
		lis[i].onclick = (function(i){	//(1)
			return function(){	//(2)
				alert(i);
			};	// 结果:正确
		})(i);
	}
}

/*
 * 页面加载时,在for循环中,为每个li标签绑定onclick事件;
 * 执行函数liclick(),依次弹出0,1,2,3
 */
window.onload = init;
var liclick = function(index){
	alert(index);
}
function init(){
	var lis = document.getElementById("wrap").getElementsByTagName("li");
	var i;
	for(i=0;i<lis.length;i++){
		lis[i].onclick = liclick(i); // 结果:加载页面时自动弹出0,1,2,3
	}
}

/*
 * 页面加载时,在for循环中,为每个li标签绑定onclick事件;
 * 执行函数liclick(),该函数返回值为一个匿名函数,i暂存到匿名函数中,不会立即执行;
 * 用户点击li标签时,触发匿名函数
 */
window.onload = init;
var liclick = function(index){
	return function(){
		alert(index);
	}
}
function init(){
	var lis = document.getElementById("wrap").getElementsByTagName("li");
	var i;
	for(i=0;i<lis.length;i++){
		lis[i].onclick = liclick(i); // 结果:正确
	}
}




常用解决方案:

(1)给对应的li添加一个属性记录是第几个如 id=0,1,2,3

(2)将函数外移,避免函数套函数


版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/148007.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • AD域的详细介绍「建议收藏」

    AD域的详细介绍「建议收藏」文章目录1、什么是域2、内网的环境:3、域的组成:4、域的部署域账号登录成员机的过程:组策略GPO(GroupPolicy)1、什么是域Domain:域是计算机网络的一种形式,其中所有用户账户,计算机,打印机和其他安全主体都在位于称为域控制器的一个或多个中央计算机集群上的中央数据库中注册。两个域之间可以通过建立信任(Trust)关系来进行联系2、内网的环境:1)工作组:默认模式,人人平等,但是不方便管理2)域:人人不平等,优点:可以实现集中管理、统一管理3、域的组成:1)域控制器(DC:D

  • websocket 粘包问题_websocket数据过大

    websocket 粘包问题_websocket数据过大websocket 底层使用的tcp 协议。 当一次发送数据过长时,tcp 会把数据封成多个包发送;同样当数据过短时,会把数据合并成一个包发送,这种现象就是粘包。粘包的情况也有可能是接收端造成的。[参考]( http://m.blog.csdn.net/duotemplar/article/details/73193038).tcp协议相关的知识百度之。 粘包出现必然对应拆包处理。处理

  • matlab从小到大的冒泡排序_matlab比较两个数大小

    matlab从小到大的冒泡排序_matlab比较两个数大小[1,2,3];%冒泡法排序,注意的是特征值顺序变化的同时要与相对应的下标同…转换完之后对向量进行逆序排列,我看到有同学硬是写了一个冒泡排序来完成这个工作,你的数据结构老师一定非常欣慰。但是在MATLAB里不用从头开始,直接调用sort……3.实现对输入任意长度向量元素的冒泡排序的升序排列。不允许使用sort函数…三分搜索法hdu1016PrimeRi…

    2022年10月18日
  • java中如何获取当前系统时间[通俗易懂]

    java中如何获取当前系统时间[通俗易懂]java.util包中提供的和日期时间相关的类有Date类、Calendar类和SimpleDateFormat类等。方法一:Date类对象用来表示日期和时间,该类提供了一系列操作日期和时间各组成部分的方法,Date类中使用最多的是获取系统当前的日期和时间,如Datedate=newDate();这句代码是使用当前时间创建日期对象示例代码如下:publicstaticvoidm…

    2022年10月19日
  • How to pause the game in Uniy3D

    How to pause the game in Uniy3D

  • uboot的作用和功能

    uboot的作用和功能uboot是用来干什么的,有什么作用?uboot属于bootloader的一种,是用来引导启动内核的,它的最终目的就是,从flash中读出内核,放到内存中,启动内核所以,由上面描述的,就知道,UBOOT需要具有读写flash的能力。uboot是怎样引导启动内核的?uboot刚开始被放到flash中,板子上电后,会自动把其中的一部分代码拷到内存中执行,这部分代码负责把剩余的uboo…

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号