var\let\const

for(var i=0;i<10;i++){ var button=document.createElement("button"); button.innerText=i+1; button.onclick=function(){ alert(i); } document.body.appendChild(button); }

结果是10个button,点击每一个都会弹出10。

const定义的是常量;
var与let定义的是变量;
var是函数作用域,let是块作用域;
let不能重复声明覆盖,var可以重复声明覆盖;

也就是说在for循环里var出来的i,每次都被覆盖了新的值,所以当onclick时alert出的i是最终循环结束的值i=10。

如果改用let定义
for(let i=0;i<10;i++){ var button=document.createElement("button"); button.innerText=i+1; button.onclick=function(){ alert(i+1); } document.body.appendChild(button); }

这里10个button就会分别弹出1-10。
因为var是不断覆盖i,给它新的值,而let不会覆盖。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容