Я смотрю на кусок кода:
(function($) {
// other code here
$(document).ready(function() {
// other code here
});
})(jQuery);
Хотя IIFE выполняет функции $(document).ready, правильный ли этот код? или я могу просто удалить $(document).ready и поместить код непосредственно в IIFE.
Нет, IIFE не выполняет код в готовом документе.
(function($) {
console.log('logs immediately');
})(jQuery);
Этот код запускается немедленно, записывает «журналы немедленно», даже если документ не готов.
(function($) {
$(document).ready(function(){
console.log('logs after ready');
});
})(jQuery);
Немедленно запускает код и ожидает готовности документа и регистрирует «журналы после готовности».
Это объясняет, чтобы лучше понять:
(function($) {
console.log('logs immediately');
$(document).ready(function(){
console.log('logs after ready');
});
})(jQuery);
Это записывает «немедленно» в консоль сразу после загрузки окна, но «журналы после готовности» регистрируются только после того, как документ готов.
Альтернативой для $(document).ready(function(){}) является:
$(function(){
//code in here
});
Начиная с jQuery версии 3.0 обработчик готовности изменен.
Только следующая форма готового обработчика рекомендуется.
jQuery(function($) {
});
Обработчик готовности теперь асинхронный.
$(function() {
console.log("inside handler");
});
console.log("outside handler");
> внешний обработчик
> внутренний обработчик
$(function() {/* DOM Manipulations goes here})(function($) {/* safely use $ here*/}(jQuery))И вы можете комбинировать оба подхода:
(function($) {
/*Do smth that doesn't require DOM to be ready*/
$(function() {
/*Do the rest stuff involving DOM manipulations*/
});
}(jQuery));
IIFE необходимо создать еще одну область. Если вы удалите IIFE и $ не будет определено (т.е. jQuery.noConflict()) - вы получите ошибку. jQuery будет определено везде, где был загружен файл javascript с библиотекой.
Так что это не лучшая практика jQuery, это лучшая практика javascript.
IIFE выполняет функции, когда контекст выполнения ( объем текущего оцениваемого кода ) готов. Прочтите статью о концепциях организации кода в jQuery, в которой описаны два наиболее распространенных шаблона: Литерал объекта и Шаблон модуля и способы их использования.
$(document).ready, в противном случае это не имеет значения. - person Morteza Edalati schedule 24.07.2014$(function(){ ... });(это сокращение jQuery для.ready()) сIIFE- person Spokey schedule 24.07.2014$(document).ready()— это если вы поместите свой тег сценария перед нижней частью тела, и в этом случае DOM еще не готов, и вам нужно дождаться запуска события. - person PlantTheIdea schedule 17.06.2015