#javascript #jquery #jquery-plugins
#javascript #jquery #jquery-плагины
Вопрос:
Я пытаюсь изучить реальные мельчайшие детали Javascript, поэтому я был бы признателен, если бы кто-нибудь мог объяснить этот код для меня. В ColorBox автор определяет свой общедоступный метод следующим образом:
publicMethod = $.fn[colorbox] = $[colorbox] = function (options, callback) {
// do stuff...
};
Затем определяются другие общедоступные методы, такие как:
publicMethod.remove = function () {
// do more stuff
};
На практике я знаю, что эти функции могут быть вызваны как $.colorbox() и $.colorbox.remove(), но меня немного смущает фактический синтаксис. В частности, что происходит, когда он присваивает «$.fn[colorbox]» и «$[colorbox]» publicMethod?
У вас есть какие-либо комментарии к этому коду? Является ли это хорошим шаблоном проектирования? Есть ли другие шаблоны, которые вы бы порекомендовали?
Комментарии:
1. Не будет ли этот первый блок кода множественным присвоением анонимной функции publicMethod, $.fn [colorbox] и $ [colorbox]?
2. Да, извините, вы правы. Но что именно происходит, когда вы назначаете эту функцию anon для $.fn [colorbox] и $ [colorbox]. Наверное, я не понимаю обозначения в скобках.
Ответ №1:
В JavaScript каждый объект одновременно является ассоциативным массивом, свойства объекта также являются ключами массива. Это означает, что obj.prop = 1 и obj["prop"] = 1 — это в точности одно и то же. Кроме того, методы — это просто свойства, которые имеют функцию в качестве своего значения. Итак, $["colorbox"] = function() {...} создается анонимная функция и присваивается ей как свойству colorbox объекта $ ( $ это обычное имя переменной в JavaScript), после чего эта функция становится методом $.colorbox() . Обратите внимание, что я использовал строку "colorbox" , однако в вашем примере кода она без кавычек, что интерпретировалось бы как имя переменной, поэтому там, вероятно, используется переменная colorbox со значением "colorbox" .
Функции также являются объектами, поэтому вы можете устанавливать для них пользовательские свойства. В примере свойство remove устанавливается для объекта function и становится его методом.
Комментарии:
1. Да, я вижу выше, что он объявил colorbox = ‘colorbox’
2.
obj.prop = 1иobj["prop"] = 1— это в точности одно и то же. Идеальное объяснение
Ответ №2:
Согласно руководству Mozilla по javascript, в данном случае квадратные скобки используются в качестве средств доступа к свойствам. Смотрите https://developer.mozilla.org/en/JavaScript/Guide/Working_with_Objects
Ответ №3:
Автор Colorbox здесь, и я хотел сказать, что Владимир абсолютно прав. Я использовал обозначение в скобках, чтобы переменную (colorbox) можно было сократить при прохождении через минификатор, поскольку одна и та же строка неоднократно использовалась в исходном коде.
В JavaScript объекты (в данном случае выражение функции) передаются по ссылке.
Итак, $.colorbox, $.fn.colorbox и publicMethod указывают на один и тот же объект. Когда в publicMethod добавляется новое свойство (т.Е. publicMethod.remove = function(){};), $.fn.colorbox также получает свойство, поскольку оба ссылаются на один и тот же объект.
$.fn.PluginName — это соглашение для плагинов jQuery, а $.colorbox — это просто псевдоним для этого. publicMethod был сокращением для $.fn.colorbox, используемого в плагине, который будет сокращен, когда скрипт будет передан через минификатор.