Question

我在搜索google和stackoverflow时遇到了一些问题，无法解答这段JavaScript代码的作用：

obj['e'+type+fn]( window.event );

对我来说，这看起来像一个带参数/参数的数组元素：

array[index](argument);

但是，我只能猜测这是做什么的。这相当于：

array[index]=argument

哪个为数组元素赋值？

如果有人能够提供一个简单/通用的例子，说明这样做会很棒。我试图破译John Resig's addEvent() implementation。我并不是在寻找这个实现或与它相关的示例的解释，但更像是像MDC has done for call这样使用一些想象产品的愚蠢的例子。

Answer 1

obj['e'+type+fn]( window.event );

这只是一种访问对象属性的方法。例如，如果你有一个对象

a = {
 name: 'someName'
 age: 20
};

您可以使用a.name或上述a['name']来访问姓名。

他使用[]表示法的原因是他可以从多个字符串构建密钥。

因此，如果type=click和fn=foo他正在访问obj.eclickfoo。或obj['eclickfoo']

对象的这个属性必须是一个方法，因为他使用（）调用它;所以，他说：

obj.eclickfoo( window.event );

或同等的

obj['eclickfoo']( window.event );

Answer 2

这就是它正在做的事情：

从数组obj，它采用索引为'e'+type+fn的函数。然后它执行它作为参数传递window.event。

请记住()调用一个函数，[]从数组中提取一个值。

Answer 3

obj['e'+type+fn]返回一个函数类型。然后以window.event作为参数执行此操作。

Answer 4

obj['e'+type+fn]( window.event );

数组确实可以使用“obj [...]”表示法，但JavaScript中的任何对象都可以使用。在这种情况下，Resig将属性添加到任何对象，特别是DOM对象。

obj['aVar']相当于obj.aVar。前者的优点是它也可以使用JavaScript中保留的具有特殊含义的关键字（例如，如果在对象上定义了一个名为“var”的属性，则为obj ['var']并允许属性名称为动态访问，如您的示例所示。由于type是变量，因此您无法执行obj.type，因为这将找到一个名为“type”的属性，而不是查找名称等于type的值的属性变量

由于对象（或数组）可以将函数作为数据保存，因此您也可以在对象或数组中找到的函数上使用调用运算符（匹配的括号），如此处所述 - 访问属性（是先前存储的“方法”或对象上的函数），然后使用window.event对象作为单个参数调用。

函数在它们的原型上也有一个内置的toString方法（在这种情况下会被调用，你要连接到一个字符串，因此必须要一个字符串，只要你不要'在函数上设置自己的toString方法，因为函数也是JavaScript中的对象！）。 Resig的代码正在利用这一点，定义一个新的属性，有点随意，这通常是一个坏主意，但在某种程度上不太可能与其他应用程序冲突，同时添加这样的属性。

因此，如果document.body是obj，并且type变量设置为“click”并且“fn”设置为function () {alert('boo!');}"，那么它实际上会命名为this document.body对象上的属性为“eloadfunction（）{alert（'boo！'）;}”。正如他解释的那样，创建这个属性（然后在他自己的匿名函数中调用它）允许使用内部使用的任何“this”关键字的正常行为来调用函数 - obj将引用父对象，在这种情况下obj，而不是全局（除非window是全局的 - 即{{1}}对象。）

这个奇怪的JavaScript数组语法是什么？

4 个答案: