关注前端 JavaScript进一步学习(一)

<a id="anchor1" href="#">abc</a><br />JavaScript中，(function(){ alert("abc");})();
将匿名函数用括号包起来，后再加一个括号，表示直接执行。
函数调用和引用
var foo=example(); //表示一个函数的返回值（函数的调用）
var foo=example; //表示函数的指针（函数的引用）
换行
JavaScript 如果需要换行，在行尾加上 \ 告知服务器该行是连续的。或者在字符串间用 + 连接。
闭包的介绍。
这里用一个小例子：
对于3个超链接
<a id="anchor1" href="#">abc</a><br />
<a id="anchor2" href="#">abc</a><br />
<a id="anchor3" href="#">abc</a><br />
现在的操作要求点击的时候弹出各自的id
思路如下：
function newInit(){
for (var i=1;i<=3;i++){
var anchor=document.getElementById("anchor"+i);
anchor.onclick=function(){
alert("My id is anchor"+i);
}
}
}
window.onload=newInit;
运行后发现，程序并未按照我们以为的情况走。而是任意超链接点击提示：My id is anchor4
这是一个作用域的问题，本级作用域未找到值的情况下，会自动在上一级寻找。超链接点击的时候，本级作用域没有i，于是往上一级寻找，在newInit中寻找到。可是，此时，i已经变成了4。于是，出现了这个结果。
怎么解决这个问题呢？
function newInit(){
for (var i=1;i<=3;i++){
var anchor=document.getElementById("anchor"+i);
registerListener(anchor , i);
}
}
function registerListener(anchor , i)
{
anchor.cilck=function(){
alert("My id is anchor"+i);
}
}
window.onload=newInit;
这样就解决了问题，看事一样效果的代码为什么结果不同呢？这是因为JavaScript在调用函数的时候会对应生成一个实例，这样，就相当于生成了3个registerListener的实例，各自保存了各自的i值。最后得出正确的结果。

延伸阅读