我正在阅读javascript:Douglas Crockford的优点。我很难理解一个特定的例子和作者提供的解释。
例1 :(第38页)
var quo=function (status) {
return {
get_status:function() {
return status;
}
};
};
var myQuo=quo("amazed");
document.writeln(myQuo.get_status());
书中的解释(我不明白这一点。请解释这一部分):
此quo函数设计为在没有 new 前缀的情况下使用,因此名称不是大写的。当我们调用quo时,它返回一个包含get_status方法的新对象。对该对象的引用存储在myQuo中。 即使quo已经返回,get_status方法仍然具有对quo状态属性的特权访问权限。 get_status无权访问参数的副本。它可以访问参数本身。这是可能的,因为该函数可以访问创建它的上下文。这叫做封闭。
示例2(第39页):
//make a function that assigns event handler function to array of nodes
//when you click on a node, an alert box will display the ordinal of the node
var add_the_handlers=function (nodes) {
var helper=function(i) {
return function(e) {
alert(i);
}
};
var i;
for (i=0;i<nodes.length;i++) {
nodes[i].onclick=helper(i);
}
};
我很难理解这段代码是如何工作的,而且函数(e)是做什么的? 为什么辅助函数返回函数反过来又不返回任何东西。这让我非常困惑。如果有人能用简单的语言解释,那将会非常有帮助。非常感谢
EDIT:
According to the book is the bad example for the above(example 2):
var add_the_handlers=function(nodes) {
var i;
for (i=0;i<nodes.length;i++) {
nodes[i].onclick=function(e) {
alert(i);
};
}
};
作者认为这是一个糟糕的例子,因为它总是显示节点数。
答案 0 :(得分:5)
我相信,他在示例中暗示的是,您不必复制status
参数并将其传递给get_status
函数,因为{{1隐式访问包含在定义它的上下文中的所有内容(在本例中为get_status
)
同样,在例2中
答案 1 :(得分:4)
为什么辅助函数返回函数反过来又不返回任何内容。
在javascript中,函数不必显式返回值。如果省略返回值,则隐式return undefined;
为。
此外,功能是对象。因此,helper()
是一个javascript函数,它返回一个函数:
function(e) {
alert(i);
}
稍后在for循环中,nodes[i].onclick=helper(i);
此行执行helper()
函数,该函数返回一个函数对象,然后将该函数对象分配给节点的onclick
处理程序。
在Bad示例中,作者说明了一个常见的问题,即新手javascript开发人员绊倒了。
//According to the book is the bad example for the above(example 2):
var add_the_handlers=function(nodes) {
var i;
for (i=0;i<nodes.length;i++) {
nodes[i].onclick=function(e) {
alert(i);
};
}
在这种情况下,新手程序员希望每个节点都显示其索引。但是,因为onclick处理程序在i
周围创建了一个闭包,所以i
的值设置为外部作用域的值,当函数为0时,最终为i
的值。 执行,而不是新手程序员所期望的分配功能。因此,对于单击的每个节点,它最终会打印相同的数字,即nodes.length
或数组中的节点数。
根据评论:
此外,你能解释一下功能(e)中的e是什么吗?
在DOM Api中,事件处理程序都传入一个包含事件信息的事件对象。所以在这种情况下,e
是click事件对象。此函数未使用e
,因此可能已将其省略。