资讯专栏INFORMATION COLUMN

关于for循环中利用索引执行函数的问题(闭包)

Xufc / 2056人阅读

摘要:第二种就是在点击事件外加入立即执行函数,把当做变量传递进点击事件,这样也可获取到每次点击的索引。

今天在前端技术群中看到有位初学朋友问了个问题,我贴一下代码:
js:

var pList = document.getElementsByTagName("p");
for(var i=0;i

html:

1

2

3

4

5

他的想法是点击每一个P标签的时候获取到点击的p标签的html,代码看着没什么问题,可实际报错了~
这个问题估计大部分人一开始都遇到过,为什么这条语句不好使呢?
个人理解,页面初始化的时候i就已经从0走到了4,当你点击P的时候,此时i已经变成了5,而pList[5]并不存在,所以会报undefined的错误,改法有两种:
第一种把pList[i]改成this,当p标签被点击时this直接代表p进行获取html。
第二种就是:

var pList = document.getElementsByTagName("p");
for(var i=0;i

在点击事件外加入立即执行函数,把i当做变量传递进点击事件,这样也可获取到每次点击的索引。
这个如果深刻点说,就涉及到js里至关重要的闭包环节了~
点击事件在循环内部,然而还想调用人家的变量,就像你在别人家看着人家主人在跑步,你还想用跑步机,那么你要么等人家跑完了,你用着人家“跑完”的跑步机(文中的i=5),要么你就让主人给你同时在旁边安装一个一模一样的跑步机,你们一起(立即执行函数)
粗略的写完了,嘿嘿,欢迎一起探讨问题指正错误,高手可以跳过,写出来也是为了做个笔记,温故而知新~

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/79739.html

相关文章

  • 循环异步&&循环闭包

    摘要:原文链接在这之前先要了解一下循环中和的区别是函数级作用域或者全局作用域,是块级作用域看一个例子循环中的逻辑代码函数下的输出,全局下的不存在现在我们把换为循环中的逻辑代码报错了,不在函数作用域下,当然肯定也不会再全局下因为和的这个区别当然和的 原文链接在这之前先要了解一下 for循环中let 和var的区别 var 是函数级作用域或者全局作用域,let是块级作用域看一个例子 fu...

    Near_Li 评论0 收藏0
  • 闭包学习与总结

    摘要:第一部分执行代码之后,返回了一个新的匿名函数,此时在全局作用域调用匿名函数它不在是的属性或者方法,此时调用者是因此输出是。总结关于中的,记住谁调用,就指向谁要访问闭包的,要定义个变量缓存下来。 前言: 这是一篇关于闭包函数的总结和笔记 希望对大家有点帮助 写的不好的地方,也请大家多多指教 一: js中的命名函数,匿名函数,自调用函数和回调函数 1.命名函数: 函数如果有名字,就...

    YanceyOfficial 评论0 收藏0
  • [ JS 进阶 ] 闭包,作用域链,垃圾回收,内存泄露

    摘要:执行返回的内部函数,依然能访问变量输出闭包中的作用域链理解作用域链对理解闭包也很有帮助。早期的版本里采用是计数的垃圾回收机制,闭包导致内存泄露的一个原因就是这个算法的一个缺陷。 关于闭包,我翻了几遍书,看了几遍视频,查了一些资料,可是还是迷迷糊糊的,干脆自己动手来个总结吧 !欢迎指正... (~ o ~)~zZ 1. 什么是闭包? 来看一些关于闭包的定义: 闭包是指有权...

    clasnake 评论0 收藏0
  • 那些年,前端学习之路疑难杂症(四):面试遇到3个问题概览

    摘要:闭包能用来实现私有化和创建工厂函数等作用。关于闭包的常见面试题是这样的写一个函数,循环一个整数数组,延迟秒打印这个数组中每个元素的索引。 文章来源:http://mp.weixin.qq.com/s/vs0... 前言 在公众号上看到了这篇文章,觉得很有用,有助于理解JS学习中的一些重点难点。决定把它整理下发布出来。该文章主要介绍了JS中的三个问题。在以后的几篇文章里,我会详细介绍这三...

    gecko23 评论0 收藏0
  • 我所认识闭包

    摘要:哈哈,简单粗暴的理解,不过也对,这样确实是形成了闭包。但有一个方法可以帮我们在外部调取内部的值,没错,这就是闭包我们先继续看这道题,我将一步步解释。第二点就是利用闭包的特点,增加某些的安全性。 (~ ̄(OO) ̄)ブ,闭包,一个面试长问的问题,本白也迷糊了很久。慢慢不断地有了自己的一点认识,这里分享一下~~~废话不多说,先看题: var output = (function () { ...

    _Suqin 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<