Знак доллара jQuery ($) как аргумент функции?

Я понимаю закрытие JavaScript, и я видел это в собственном JS:

(function () {
  // all JS code here
})();

Но что делает добавление jQuery spices?

(function ($) {
  // all JS code here
})(jQuery);

Ответ 1

Его способ сопоставления jQuery с $таким образом, чтобы увидеть не весь код на странице.

Возможно, у вас есть существующий script, который использует jQuery, который вам нравится повторно использовать, но вы также используете прототип, который также использует $на той же странице.

Обернув любой jQuery с помощью кода в этой конструкции, вы переопределите $to jQuery для содержащейся части, не вступая в конфликт с другим кодом на странице.

Ответ 2

Когда вы видите:

(function() {
  // all JS code here
})();

Он известен как самозапускающаяся анонимная функция. Функция выполняется, как только она анализируется из-за добавления () в конце (то, как вы запускаете js-функции).

Обратите внимание, что дополнительные внешние фигурные скобки - это просто соглашение, вы также можете записать его так:

function() {
  // all JS code here
}();

Но это соглашение сильно используется повсюду, и вы должны придерживаться его.

(function($) {
  // all JS code here
})(jQuery);

Здесь $ сопоставляется с объектом jQuery, чтобы вы могли использовать $ вместо ключевого слова jQuery. Вы также можете добавить туда другого персонажа:

(function(j) {
  // all JS code here
})(jQuery);

Здесь j отображается вместо jQuery объекта.

Обратите внимание также, что аргументы, определенные для функции self-invoking, остаются в рамках этой функции и не конфликтуют с внешней областью/переменными.


Я написал статью на эту тему, пожалуйста, ознакомьтесь с ней:

Ответ 3

(function() {
   // all JS code here
})();

Является выражением с выраженной немедленной функцией (IIFE), произносится как "iffy". Некоторые люди также называют их "анонимными, самоисполняющимися функциями" или просто "самоисполняющимися функциями".

(function(aParameter) {
   alert(aParameter);  // will alert "an argument"
})("an argument");

Здесь IIFE, который принимает параметр "aParameter" и передает аргумент "аргумент".

(function($){
   alert($(window).jquery);  // alert the version of jQuery
})(jQuery);

Это похоже, но "jQuery" (экземпляр объекта jQuery) является аргументом для IIFE, и в этом случае jQuery передается как параметр "$" . Таким образом, просто набрав '$', тело IIFE имеет доступ к jQuery и его членам. Это обычное соглашение jQuery, и это распространено для людей, которые пишут плагины jQuery, чтобы поддерживать это соглашение таким образом.

Этот код не только поддерживает jQuery-соглашение, но также гарантирует, что ни вы, ни кто-либо еще не можете случайно нарушить это соглашение. Например, введите следующий код:

var $ = function() {
   alert('foo');
}

Этот код превращает '$' во что-то, что определенно не jQuery. Если кто-то сделал это в другом коде вне вашего кода плагина, а затем вы явно не передали jQuery как "$" в ваш плагин, тогда вы не сможете использовать "$" в качестве jQuery, как обычно.

Ответ 4

Есть две причины, чтобы передать jQuery в закрытие таким образом.

Самым значительным является то, что он заставляет ваш код работать на страницах, которые используют jQuery "no conflict" mode, что позволяет использовать jQuery вместе с другими библиотеками, которые хотят контролировать глобальный $. По этой причине метод (function($) { ... })(jQuery) рекомендуется сильно при написании плагинов jQuery.

Вторая причина заключается в том, что она делает $ локальную переменную в объеме функции самоисполнения, а доступ к локальной переменной (незначительно) быстрее, чем доступ к глобальной переменной. Лично я не считаю это очень веской причиной - я не могу представить себе сценарий, в котором накладные расходы на использование методов jQuery, а не DOM были бы приемлемыми, но доступ к jQuery в качестве глобальной переменной не стал бы.: -)

Я бы сказал, что лучшая причина использовать эту технику, когда вы не пишете плагин, это согласованность - вы с меньшей вероятностью забудете сделать это, когда это важно, если вы привыкли делать это, когда это нет. Кроме того, вы никогда не знаете, когда у вас будет возможность перерабатывать код!