Понимание того, когда и как использовать Require.JS

Я только начал работать с Require.JS, и я немного неясен в соответствующих случаях, в которых он должен использоваться, а также в правильном способе использовать его в этих случаях.

Вот как у меня в настоящее время есть вещи, заданные с Require.JS. У меня есть две функции: functionA() и functionB(). Обе эти функции требуют дополнительной функции functionC() для правильной работы.

Я хочу только загрузить функцию C(), когда это необходимо, т.е. когда будет вызвана функция A() или functionB(). Поэтому у меня есть следующие файлы:

functionC.js

functionC(){
  //do stuff
}

functionA.js

functionA(){  
  define(['functionC'],function(){
    //functionC() is loaded because it is listed as a dependency, so we can proceed
    //do some functionA() stuff
  });
}

functionB.js

functionB(){  
  define(['functionC'],function(){
    //functionC() is loaded because it is listed as a dependency, so we can proceed
    //do some functionB() stuff
  });
}

Итак, правильно ли это настроено? И если я в конечном итоге вызываю функции functionA() и functionB() на одной странице, это дополнительная работа, выполняемая, поскольку они оба загружают файл functionsC.js? Если да, то это проблема? И если да, есть ли способ настроить его, чтобы они сначала проверяли, загружен ли файл function.js еще, и загружать его, если он еще не был? Наконец, это подходящее использование Require.JS?

ОТВЕТЫ

Ответ 1

define() должен использоваться только для определения модуля. В приведенном выше примере, где кусок кода должен быть динамически загружен, использование require() более уместно:

functionA.js

functionA(){
  require(['functionC'],function(functionC){
    //use funcC in here to call functionC
  });
}

Некоторые примечания:

  • require([]) является асинхронным, поэтому, если вызывающий объект functionA ожидает возвращаемое значение из этой функции, скорее всего, будут ошибки. Лучше, если functionA принимает обратный вызов, который вызывается, когда functionA выполняется с его работой.
  • Вышеприведенный код вызовет require() для каждого вызова functionA; однако, после первого вызова, нет штрафа за загрузку functionC.js, он загружается только один раз. При первом вызове require() он загружает functionC.js, но в остальное время RequireJS знает, что он уже загружен, поэтому он вызовет функцию function(functionC){} без запроса functionC.js снова.