JavaScript有关Let的用法

2013-08-13 18:16:51 +08:00
 Windweller
最近在读MDN上关于JavaScript1.7的更新(感觉js更新得不是一般的快。。)

感觉let statement是个很好的工具,尤其是在循环或是if语句里面,要建立一种临时的局部变量,比scope绑定到函数的var肯定要方便很多。

然后MDN提供了这样一段代码:

var list = document.getElementById("list");

for (var i = 1; i <= 5; i++) {
var item = document.createElement("LI");
item.appendChild(document.createTextNode("Item " + i));

let j = i;
item.onclick = function (ev) {
alert("Item " + j + " is clicked.");
};
list.appendChild(item);
}

下面配上解释说,这里,j是必须的,换成var j这玩意不会有用,去掉j,直接用 i, 也不会起作用。

请问它为什么用let j=i 就可以让 j 可以在下面那个匿名函数中被调用了?(然后一个小白点的问题。。function (ev) 中的ev是啥东西,我也见过类似 function (el, index, array)。。。这东西有名字么。。能给个MDN的知识链接么)
10102 次点击
所在节点    程序员
10 条回复
dorentus
2013-08-13 19:09:58 +08:00
for (var i = 1; i <= 5; i++) 这里的 i 是全局可见的,于是循环体里的函数每次被调用的时候都是取的这个全局的 i 的值,而循环结束后,i 的值就被固定为 5 了。

循环体里面的 let j = i; 限制了变量 j 的作用域在循环体内,每次循环的时候这个 j 都是新的(被赋予了当时变量 i 的值),同在循环体里的函数所使用的 j 都是当次循环时创建的 j(好像正常的说法是说『j 和这个函数被绑定在了一起,形成了一个闭包』这样吧)。

ev 就是 event 的缩写吧。el 大概是 element。

说句题外话,Javascript 这个名字好像是 Mozilla 基金会所有的,MDN 里面提到的 Javascript x.x 就是特指他们自己的这个实现的版本。
bitsmix
2013-08-13 23:13:17 +08:00
觉得这不是啥好事儿额。。
又多了一个坑
chemzqm
2013-08-13 23:32:54 +08:00
如果你在一个函数里var多次j,它其实都是指向一个引用。
Windweller
2013-08-13 23:44:14 +08:00
@chemzqm 这个例子。。MDN的这个例子是不是比较极端,本来不该把item.onclick的事件注册放到循环中去的。它为了表明let j每次都是新的,才故意放到循环里去了。。

其实我把这段代码复制到JS Bin去后发现是报错的jsbin.com/‎ 说是不要在循环里放置函数,而且也说expect an identifier instead saw "let"。。Chrome Console里好像也不认识let。。。
toctan
2013-08-14 00:32:19 +08:00
@Windweller 不是不该把 item.onclick 的事件注册放到循环中去,而是不应该在循环中制造 closures
参见 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Closures Creating closures in loops: A common mistake 一节
https://gist.github.com/toctan/6222729
toctan
2013-08-14 00:38:57 +08:00
@livid 贴的 gist 为什么上下这么多空行?
Windweller
2013-08-14 00:59:09 +08:00
@toctan 原来let只能在Firefox上用,怪不得Chrome里调试会失败了!在MDN上看到JS1.7,JS1.85一类的特殊申明,都是只能在Firefox上用,其他浏览器不能使用吗?(这简直是极大增加学习难度嘛)
bitsmix
2013-08-14 01:07:49 +08:00
@toctan v2ex 的 css 写的跟 gist 那边冲突了。行号的宽度太小了。
zzNucker
2013-08-14 12:15:20 +08:00
@Windweller 可以认为Javascript 是mozilla的标准
其它浏览器支不支持要看能不能普及咯 比如能不能进入ECMA的标准
SuperMonster009
2019-04-19 08:13:28 +08:00
还是多用 let 和 const 吧 var 感觉会被慢慢遗弃的 总有一天编辑器会提示你 var is depricated

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/78975

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX