let的使用 优先于闭包
闭包 优先 Let 使用
2023-09-14 08:57:36 时间
let声明的变量在{}中使用,变量的作用域限制在块级域中
举例:使用js动态给ul添加li对象并点击第几项,显示当前点击是第几个
错误代码
window.onload = function(){ var ul = document.getElementById("ulList"); for(var i = 0 i <= 5; i++){ // 创建一个li对象 var li = document.createElement("li"); // li标签内内容设置为:Itemi li.appendChild(document.createTextNode("Item" + i)); // 绑定点击事件 li.onclick = function(){ alert("Item" + i + "is clicked."); }; ul.appendClild(li); } }
闭包方式:
window.onload = function(){ var ul = document.getElementById("ulList"); for(var i = 0 i <= 5; i++){ // 创建一个li对象 var li = document.createElement("li"); // li标签内内容设置为:Itemi li.appendChild(document.createTextNode("Item" + i)); // 绑定点击事件 li.onclick = (function(i){ return function (){ alert("Item" + i + "is clicked."); }; })(i) // 闭包 // 将LI对象item拼接到UL标签体内 ul.appendClild(li); } }
let声明方式:
(function(){ var ul = document.getElementById("TopDiggPostsBlock").querySelector('ul');//TopDiggPostsBlock children ul for(var i = 0; i <= 5; i++){ // 创建一个li对象 var li = document.createElement("li"); // li标签内内容设置为:Itemi li.appendChild(document.createTextNode("Item" + i)); // 声明一个块级变量j,并将i赋给j let j = i; // 绑定点击事件 li.onclick = function(){ alert("Item" + j + "is clicked."); }; ul.appendChild(li); } })()
说明:采用的闭包的方式在绑定的时候已经把j的值已经传递给对应的click事件了,所以能够实现相同的结果,但是,从程序的可维护性来说不推荐使用。
闭包的优缺点说明:
优点:设计私有的方法和变量,保护函数内的变量安全;
弊端:闭包有一个非常严重的问题,那就是内存浪费问题,这个内存浪费不仅仅因为它常驻内存,更重要的是,对闭包的使用不当会造成无效内存的产生。
摘自:https://www.cnblogs.com/amujoe/p/8874343.html
相关文章
- 匿名函数、闭包、lambda表达式、Block
- 作用域、闭包、内存泄露
- PHP的闭包
- Swift语法专题八——闭包
- Scala闭包函数
- atitit.闭包的概念与理解attilax总结v2 qb18.doc
- 【Android Gradle 插件】组件化中的 Gradle 构建脚本实现 ⑤ ( 优化 Gradle 构建脚本 | 构建脚本结构 | 闭包定义及用法 | 依赖配置 | android 块配置 )
- 【Groovy】闭包 Closure ( 闭包类 Closure 简介 | this、owner、delegate 成员区别 | 静态闭包变量 | 闭包中定义闭包 )
- js通过闭包实现多个相同事件只需绑定一次
- 无意间创建的一个闭包,以及解决的方法
- 1-05-1 内部函数与闭包
- Dart基础第8篇:函数、箭头函数 匿名函数 闭包等