Question

javascript 中的函数格式，下面的代码是照片显示中的部分代码,请教几个问题:

1.函数的写法都要写成①那样的吗,这和function functionName(){}有什么区别?
2.从②开始好混乱啊,前面还有这样的一段代码的
eg.addListener = function(target,type,handler){
if(target.addEventListener){
target.addEventListener(type,handler,false);
}else if(target.attachEvent){
target.attachEvent("on"+type,handler);
}else{
target["on"+type]=handler;
}
};
按照②的写法,也就是
eg.addListener(li,"click",function(){
eg.showNumber = i;
eg.showBig();
});
这个函数的第三个参数可以再写多一个函数的吗,还有eg.addListener = function(target,type,handler)这段代码是什么意思可以解释一下吗?

eg.data = [
["../../photo/a1.jpg","../../photo/a1.jpg"]
,["../../photo/a2.jpg","../../photo/a2.jpg"]
,["../../photo/a3.jpg","../../photo/a3.jpg"]
,["../../photo/a4.jpg","../../photo/a4.jpg"]
,["../../photo/a5.jpg","../../photo/a5.jpg"]
,["../../photo/a6.jpg","../../photo/a6.jpg"]
,["../../photo/a7.jpg","../../photo/a7.jpg"]
,["../../photo/a8.jpg","../../photo/a8.jpg"]

];
eg.showNumber = 0; //默认显示
eg.groupNumber = 1; //当前显示的组
eg.groupSize = 6; //每组的数量
eg.showThumb = function(group){...................................................①
var ul = eg.$("smallPhotosList");
ul.innerHTML = '';
var start = (group-1)*eg.groupSize;
var end = group*eg.groupSize;
for(var i=start;(i<end&&i<eg.data.length);i++){
var li = document.createElement("li");
li.innerHTML = '<img src="'+eg.data[i][1]+'" id="thumb'+i+'" width="80" height="40"/>';
(function(i){..............................................................②
eg.addListener(li,"click",function(){
eg.showNumber = i;
eg.showBig();
});
})(i);
ul.appendChild(li);
}
};

Answer 1

1. 两种写法是等效的，都是可以的

2. 第三个参数传了一个方法进去作为li标签的click事件的处理函数，也就是说当单击鼠标的时候就会执行第三个参数的传进去的那个函数了。
   

追问

②处的
(function(i){ //function(i)是哪个函数?前面没有定义这样的函数呀?
..............
})(i);.................................................③这里怎么还有一个(i)

追答

这个是自执行的匿名函数，函数定义和运行一起的，格式如下：

(function(参数列表){
    //函数代码
})(参数列表);

追问

那这个函数的作用是什么?例如这个例子可以直接执行eg.addListener(li,"click",function(){
eg.showNumber = i;
eg.showBig();
i就可以传值了。

追答

在你这个例子里面确实没得用，可以去掉，效果一样。