Подробно объясните этот код ColorBox

Я пытаюсь изучить настоящие подробные детали Javascript, поэтому я был бы признателен, если бы кто-нибудь мог объяснить этот код для меня. В ColorBox автор определяет свой публичный метод следующим образом:

publicMethod = $.fn[colorbox] = $[colorbox] = function (options, callback) {
 // do stuff...
};

Затем определяются другие общедоступные методы, такие как:

publicMethod.remove = function () {
 // do more stuff
};

На практике я знаю, что эту функцию можно затем вызывать как $.colorbox() и $.colorbox.remove(), но я немного смущен фактическим синтаксисом. В частности, что происходит, когда он назначает "$. Fn [colorbox]" и "$ [colorbox]" в publicMethod?

Есть ли у вас комментарии по этому коду? Это хороший дизайн? Есть ли другие шаблоны, которые вы бы рекомендовали?

3 ответа

В JavaScript каждый объект является ассоциативным массивом в одно и то же время, свойства объекта также являются ключами массива. Это означает, что obj.prop = 1 и obj["prop"] = 1 - это точно одно и то же. Кроме того, методы - это просто свойства, которые имеют функцию как свое значение. Таким образом, $["colorbox"] = function() {...} создает анонимную функцию и присваивает ее как свойство colorbox объекта $ ($ является регулярным именем переменной в JavaScript), тогда эта функция становится методом $.colorbox(). Обратите внимание, что я использовал строку "colorbox", в вашем примере кода есть ее без кавычек, которая будет интерпретироваться как имя переменной, поэтому там, вероятно, используется переменная colorbox со значением "colorbox".

Функции также являются объектами, поэтому вы можете устанавливать на них настраиваемые свойства. В этом примере свойство remove устанавливается на объект функции и становится его методом.


Писатель колонок здесь, и я хотел сказать, что Владимир прав. Я использовал обозначение скобки, чтобы переменная (colorbox) могла быть сокращена при пробеле через minifier, так как одна и та же строка использовалась повторно в источнике.

В JavaScript объекты (в данном случае, выражение функции) передаются через ссылку.

Так что $.colorbox, $.fn.colorbox и publicMethod указывают на один и тот же объект. Когда новое свойство добавляется в publicMethod (т.е. publicMethod.remove = function() {};), $.fn.colorbox также получает свойство как ссылку на тот же объект.

$. fn.pluginName - это соглашение для плагинов jQuery, а $.colorbox - просто псевдоним для этого. publicMethod был сокращением для $.fn.colorbox, используемого в плагине, который был бы сокращен, когда script был пройден через minifier.


В соответствии с руководством по javascript Mozilla квадратные скобки используются в качестве атрибутов доступа к ресурсам. См. https://developer.mozilla.org/en/JavaScript/Guide/Working_with_Objects

licensed under cc by-sa 3.0 with attribution.