Что это за странный синтаксис массива JavaScript?

Question

У меня возникли проблемы с поиском в google и stackoverflow, чтобы найти ответ на вопрос, что делает этот фрагмент кода JavaScript:

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

Для меня это выглядит как элемент массива с аргументом / параметром:

array[index](argument);

Однако я могу только догадываться, что это делает. Это эквивалентно:

array[index]=argument

Что назначает аргумент элементу массива?

Если бы кто-нибудь мог предоставить простой / общий пример того, что он делает, это было бы здорово. Я пытаюсь расшифровать реализацию Джона Ресига addEvent() . Я на самом деле не ищу объяснения этой реализации или примера, связанного с ней, но больше похож на тупой пример, подобный , который MDC сделал для вызова , который использует некоторые воображаемые продукты.

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 );

Массивы действительно могут использовать запись «obj [...]», но могут использовать любой объект в JavaScript. И в этом случае Resig добавляет свойство к любому объекту, особенно для объектов DOM.

obj['aVar'] эквивалентно obj.aVar. Преимущество первого состоит в том, что он также может работать с ключевыми словами, которые зарезервированы в JavaScript, чтобы иметь особое значение (например, obj ['var'], если вы определили свойство с именем "var" для объекта) и позволяет именам свойств быть Доступ динамически, как в вашем примере. Поскольку type является переменной, вы не можете сделать obj.type, так как это приведет к нахождению свойства с именем «type», а не к обнаружению свойства с именем, равным значению переменной type.

Поскольку объекты (или массивы) могут содержать функции в качестве данных, вы также можете использовать оператор вызова (соответствующие скобки) для функции, найденной внутри объекта или массива, как это сделано здесь - к свойству обращаются (что является ранее сохраненным «методом» или функцией объекта), а затем вызывается с window.event объектом в качестве единственного аргумента.

Функции также имеют встроенный метод toString в своем прототипе (который будет вызываться в случаях, подобных этому, когда вы соединяетесь со строкой, и поэтому должны хотеть строку, если вы не установите ваш собственный метод toString для вашей функции, так как функции также являются объектами в JavaScript!). Код Ресига использует это для определения нового свойства, несколько случайного, что, как правило, является плохой идеей, но таким способом, который вряд ли будет конфликтовать с другими приложениями, также добавляющими такое свойство.

Таким образом, если document.body является obj и если для переменной type установлено значение «click», а для «fn» установлено значение function () {alert('boo!');}", оно фактически назовет свойство объекта document.body как msgstr "eloadfunction () {alert ('boo!');}". Как он объясняет, создание этого свойства (а затем вызов его внутри его собственной анонимной функции) позволяет вызывать функцию с обычным поведением любого ключевого слова "this", используемого внутри - this будет ссылаться на родительский объект, в в этом случае obj, а не в глобальном (если obj не является глобальным, то есть объектом window).

Answer 4

obj['e'+type+fn] возвращает тип функции. Затем выполняется с window.event в качестве параметра.