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


68

我刚刚开始使用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的适当用法?

Answers:


47

define()仅应用于定义模块。对于上面的示例,应该动态加载一段代码,使用require()更为合适:

functionA.js

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

一些注意事项:

  • require([])是异步的,因此如果的调用者functionA期望该函数返回值,则可能会出现错误。最好是functionA接受一个在functionA工作完成后被调用的回调。
  • 上面的代码将调用require()每次调用functionA; 但是,在第一次调用之后,load不会受到任何惩罚functionC.js,它只会加载一次。第一次require()被调用时,它将被加载functionC.js,但其余时间,RequireJS知道它已经被加载,因此它将调用该function(functionC){}函数而无需functionC.js再次请求。

1
感谢您的回复-很有帮助。我需要澄清一下define()与require(),另外两个要点确实有很大帮助。我认为第一个要点是我仍然需要更好地理解一些东西-如何正确处理RequireJS的异步性质。
maxedison 2011年

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.