@klas

Как правильно прочитать каждую строчку данного кода?

Здравствуйте. Везде в библиотеках на подобии jQuery (и другие тоже) встречаю одинаковый код. Принцип работы jQuery, браузера, веба и JavaScriptа знаю. Вот хотелось бы и понимать что означает данный код. Если кому не сложно объясните пожалуйста построчно что делает каждая строка. За ранее спасибо тем кто откликнется.

( function( global, factory ) {

	"use strict";

	if ( typeof module === "object" && typeof module.exports === "object" ) {

		// For CommonJS and CommonJS-like environments where a proper `window`
		// is present, execute the factory and get jQuery.
		// For environments that do not have a `window` with a `document`
		// (such as Node.js), expose a factory as module.exports.
		// This accentuates the need for the creation of a real `window`.
		// e.g. var jQuery = require("jquery")(window);
		// See ticket #14549 for more info.
		module.exports = global.document ?
			factory( global, true ) :
			function( w ) {
				if ( !w.document ) {
					throw new Error( "jQuery requires a window with a document" );
				}
				return factory( w );
			};
	} else {
		factory( global );
	}

// Pass this if window is not defined yet
} )( typeof window !== "undefined" ? window : this, function( window, noGlobal ) {
// тут как я понял внутренние методы и свойства библиотеки... 
} );
  • Вопрос задан
  • 1162 просмотра
Решения вопроса 2
delphinpro
@delphinpro Куратор тега JavaScript
frontend developer
Это так называемое универсальное определение модуля (UMD - Universal module definition)

Note. Только это какой-то урезанный umd, здесь нет определения define.amd. Может быть amd и устарел, но тот же webpack при сборке в umd формат пишет полную шапку.

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

Давайте разберем.

Во-первых, использована анонимная самовызываемая функция. Здесь разжевывал, прочитайте, если не знаете.
В нашем случае это

( function( global, factory ) {

} )(
    typeof window !== "undefined" ? window : this,    // global
    function( window, noGlobal ) { /* код модуля */ } // factory
 );

Анонимка принимает два параметра — глобальный объект (window) и функцию-фабрику. Фабрика является самим модулем, тот самый полезный код, ради которого написан модуль.

Во-вторых, в теле анонимки проверяется метод подключения:

// Если доступен объект module значит используется сборщик CommonJS
  if ( typeof module === "object" && typeof module.exports === "object" ) {
    // Если доступен document
    module.exports = global.document
      // То всё гуд, мы в браузере, нужно выполнить код модуля
      // и вернуть то, что он вернет
      ? factory( global /* это window */ , true )
      // Иначе возвращается функция, которая при необходимости выведет 
      // ошибку если при ее вызове не будет доступен document
      : function( w ) {
        if ( !w.document ) {
          throw new Error( "jQuery requires a window with a document" );
        }
        return factory( w );
      };
  // Модуль просто подключен через тег script
  } else {
    // Выполнить код модуля
    factory( global );
  }


Это стандартный код. Часто он формируется автоматически (например при сборке модуля webpack'ом для дальнейшей публикации в npm). Вам достаточно в общих чертах понимать что он делает и всё — обеспечивает поддержку различных вариантов использования вашего модуля.
Ответ написан
Комментировать
Xuxicheta
@Xuxicheta
инженер
Тут же английским по белому написано.
1. iife тут для изоляции переменных.
2. в iife передается либо window либо this в зависимости от окружения. Т.е. если браузер, то window, если нода, то global.
3. Внутри, если у нас нетwindow.document в окружении то экспортируем либу в стиле commonJS для ноды (module.exports), а если есть, то добавляем в window свойство jQuery, что равнозначно добавлению глобальной переменной jQuery.

Это у вас UMD
https://devhints.io/umdjs
https://tproger.ru/translations/js-modules-formats...
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы