了解何时以及如何使用Require.JS

Question

我刚刚开始使用Require.JS,我对它应该使用的适当情况以及在这些情况下使用它的正确方法有点不清楚.

以下是我目前使用Require.JS设置的方法.我有两个功能,functionA()和functionB().这两个功能都需要额外的功能functionC()才能正常工作.

我只想在必要时加载functionC(),即当要调用functionA()或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(),是否因为它们都加载了functionC.js文件而进行了额外的工作？如果是这样,那是一个问题吗？如果是这样,有没有办法设置它,以便他们首先检查是否已经加载了functionC.js,并且只在尚未加载时加载它？最后,这是否适用于Require.JS？

Answer 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.

Answer 2

您可以在此处找到有关RequireJS和JavaScript模块化的详细信息:使用RequireJS的JavaScript模块化(从意大利面条代码到馄饨代码)