JavaScript 事件绑定:立即执行函数的闭包 vs let的块作用域
以下两个写法,在执行时是等价的:
// 立即执行函数表达式写法
var btns_var = document.getElementsByTagName('button');
for(var i = 0, lengths = btns_var.length; i < lengths; i++) {
(function(j){btns_var[j].onclick=function(){
alert(j)
}})(i)
}
// es6:let的写法
var btns_let = document.getElementsByTagName('button');
for(let i = 0, lengths = btns_let.length; i < lengths; i++) {
btns_let[i].onclick=function()
{
alert(i)
}
}
一、立即执行函数表达式的写法作用域为Closure,即闭包

二、es6的写法为块作用域

上述二者的,仅 onclick 的回调函数的原型 __proto__ 的作用域不同,一个为闭包,一个为块作用域。
JavaScript 事件绑定:立即执行函数的闭包 vs let的块作用域的更多相关文章
- 深入理解javascript中的立即执行函数(function(){…})()
投稿:junjie 字体:[增加 减小] 类型:转载 时间:2014-06-12 我要评论 这篇文章主要介绍了深入理解javascript中的立即执行函数,立即执行函数也叫立即调用函数,通常它的写法是 ...
- 第一百二十一节,JavaScript事件绑定及深入
JavaScript事件绑定及深入 学习要点: 1.传统事件绑定的问题 2.W3C事件处理函数 3.IE事件处理函数 4.事件对象的其他补充 事件绑定分为两种:一种是传统事件绑定(内联模型,脚本模型) ...
- addEventListener和attachEvent二者绑定的执行函数中的this不相同【转载】
yuanwen http://www.jb51.net/article/32511.htm 写 addEventListener 和 attachEvent 区别的博文不少,不过大部分都把重点放置于前 ...
- javascript中的立即执行函数(function(){…})()
javascript中的立即执行函数(function(){…})() 深入理解javascript中的立即执行函数,立即执行函数也叫立即调用函数,通常它的写法是用(function(){…})()包 ...
- 深入理解javascript中的立即执行函数
这篇文章主要介绍了深入理解javascript中的立即执行函数,立即执行函数也叫立即调用函数,通常它的写法是用(function(){…})()包住业务代码,使用jquery时比较常见,需要的朋友可以 ...
- javascript事件绑定和普通事件的区别
<!doctype html><html lang="en"><head> <meta charset="UTF-8" ...
- 【JavaScript专题】--- 立即执行函数表达式
一 什么是立即执行函数表达式 立即执行函数表达式,其实也可以叫初始化函数表达式,英文名:IIFE,immediately-inovked-function expression.立即执行函数表达式就是 ...
- JS中立即执行函数和闭包的区别
函数声明规则:必须指定一个函数名字 foo(); function foo() { console.log("函数声明") } 由于函数声明会被提升,所以调用函数可以在之前或之后调 ...
- [转]Javascript中的自执行函数表达式
[转]Javascript中的自执行函数表达式 本文转载自:http://www.ghugo.com/javascript-auto-run-function/ 以下是正文: Posted on 20 ...
- off() 方法 与 unbind() 方法移除绑定事件的处理程序。one()函数用于为每个匹配元素的一个或多个事件绑定一次性事件处理函数
off() 方法移除用.on()绑定的事件处理程序. unbind() 方法移除用.bind()绑定的事件处理程序. 从 jQuery 1.7开始, .on() 和 .off()方法是最好的元素上附加 ...
随机推荐
- 关于Requests交互超时的处理方式
拿 https://aes.cryptohack.org/ecb_oracle 这道题来做示范. 由于这个链接的本地服务器在外国,因此我们很容易就会连接超时. 如下一个脚本: import reque ...
- 用 300 行代码手写提炼 Spring 核心原理 [1]
系列文章 用 300 行代码手写提炼 Spring 核心原理 [1] 用 300 行代码手写提炼 Spring 核心原理 [2] 用 300 行代码手写提炼 Spring 核心原理 [3] 手写一个 ...
- 【一步步开发AI运动小程序】三、运动识别处理流程
随着人工智能技术的不断发展,阿里体育等IT大厂,推出的"乐动力"."天天跳绳"AI运动APP,让云上运动会.线上运动会.健身打卡.AI体育指导等概念空前火热.那 ...
- Python 潮流周刊#78:async/await 是糟糕的设计(摘要)
本周刊由 Python猫 出品,精心筛选国内外的 250+ 信息源,为你挑选最值得分享的文章.教程.开源项目.软件工具.播客和视频.热门话题等内容.愿景:帮助所有读者精进 Python 技术,并增长职 ...
- golang之性能分析工具pprof
PProf 是一个 Go 程序性能分析工具,可以分析 CPU.内存等性能.Go 在语言层面上集成了 profile 采样工具,只需在代码中简单地引入 runtime/ppro 或者 net/http/ ...
- 渗透测试-Kioptix Level 1靶机getshell及提权教程
声明! 学习视频来自B站up主 泷羽sec 有兴趣的师傅可以关注一下,如涉及侵权马上删除文章,笔记只是方便各位师傅的学习和探讨,文章所提到的网站以及内容,只做学习交流,其他均与本人以及泷羽sec团队无 ...
- 【并查集+dfs】codeforces 1833 E. Round Dance
题意 输入一个正整数 \(T(1 \leq T \leq 10^4)\),表示接下来输入 \(T\) 组测试用例,对于每一个测试用例: 第一行,输入一个正整数 \(n(2 \leq n \leq 2 ...
- 【Python】【Matplotlib】词云图
关于从网页获取文本 import requests from bs4 import BeautifulSoup code = requests.request("post",&qu ...
- 【报错解决】【Vue】与后端交互时,http与https跨域问题
问题 xhr.js:220 Mixed Content: The page at 'https://xxx' was loaded over HTTPS, but requested an insec ...
- QtCreator中pro项目文件格式说明
名称 说明 QT += core gui 添加本项目中需要的模块,影响后面代码文件include的时候自动弹出下拉选择,如果pro文件没有引入该模块则无法自动语法提示,一般打包发布的时候对应动态库文件 ...