Is 'require' synchronous in AMD (asynchronous module definition)? If so, what makes this specification asynchronous? What if I have require() (and it hasn't been loaded yet) in the middle of my code, will it stall execution? Talking browser-side.
AMD中的'require'是同步的(异步模块定义)吗?如果是这样,是什么让这个规范异步?如果我在代码中间有require()(并且尚未加载),它会停止执行吗?谈论浏览器方面。
2 个解决方案
#1
2
For requireJS:
You have to pass a callback method alongside the required modules to .require(), that will get fired when the resources were loaded successfully. So, of course you should/can only access loaded AMD or CommonJS modules just within that callback.
您必须将回调方法与所需模块一起传递给.require(),这将在资源成功加载时触发。所以,当然你应该/只能在该回调中访问加载的AMD或CommonJS模块。
for NodeJS:
Yes, .require() does work synchronously. NodeJS uses the CommonJS module system, not AMD.
是的,.require()确实可以同步工作。 NodeJS使用CommonJS模块系统,而不是AMD。
#2
2
There are two different synchronous concepts here. The first is "Will it stop my entire webpage, and sit and wait for the file.".
这里有两种不同的同步概念。第一个是“它会停止我的整个网页,然后等待文件。”
The answer is no. RequireJS doesn't do that if you've got a script with dependencies.
答案是不。如果你有一个带有依赖项的脚本,RequireJS不会这样做。
If you use it appropriately, it uses a promise-system. What that means is that if you send in your callback and define your requirements for that file, the callback won't be run until all of the required files are loaded.
如果你恰当地使用它,它使用一个promise系统。这意味着如果您发送回调并定义对该文件的要求,则在加载所有必需文件之前不会运行回调。
If there's a require inside of one of those required files, then THAT callback won't be run until ITS dependencies have loaded.
如果在其中一个必需文件中有一个require,那么在ITS依赖项加载之前,不会运行那个回调。
The outermost callback (the one that would be at the bottom of your script, normally), won't run until everything inside has.
最外层的回调(通常位于脚本底部的回调)在内部的所有内容都不会运行。
This works on a promise system. It's worth understanding how promise systems work (similar to an observer-pattern, in a way). They're meant to be passed around or chained, based on an event, rather than having multiple people listen in any order.
这适用于承诺系统。值得了解承诺系统如何工作(在某种程度上类似于观察者模式)。它们意味着根据事件传递或链接,而不是让多个人以任何顺序收听。
var widget = new Widget(),
widgetLoaded = widget.load(url); // return a promise to let the program use the widget
widgetLoaded.then(function () { widget.move(35); })
.then(function () { widget.setColour("Blue"); })
.then(function () { widget.show(); });
This is like returning this so that you can chain function calls, except that the calls don't actually happen until widget.load() completes.
这就像返回这个,以便你可以链接函数调用,除了在widget.load()完成之前调用实际上没有发生。
The widget will actually control when this happens, by keeping its promise if the widget loads and everything is fine, or by breaking its promise if something went wrong.
小部件实际上会控制何时发生这种情况,如果小部件加载并且一切正常,则保持其承诺,或者如果出现问题则通过违反其承诺。
In most promise systems, .then or whatever they call it, either takes two functions (kept and broken -- in my systems, brokens are always optional), or they take an object with success and failure -- $.ajax does this, and then lets you predetermine what you want to do with the data when it's loaded, or if it fails -- promises.
在大多数promise系统中,.then或者他们称之为的任何系统,要么需要两个函数(保持和破坏 - 在我的系统中,brokens总是可选的),或者它们取得成功和失败的对象 - $ .ajax这样做,然后让你预先确定你在加载数据时想要做什么,或者如果它失败了 - 承诺。
So your page still work 100% asynchronously (without interrupting the UI), but it's 100% synchronous in that all of the modules will fire in the right order.
因此,您的页面仍可100%异步工作(不会中断UI),但它是100%同步的,因为所有模块都将以正确的顺序触发。
One thing you MUST REMEMBER: If you have these dependencies in your code, you can not have any dependencies lying around at the bottom of your script, waiting to run, inline. They must all be locked away inside of your callback, or locked inside a function waiting to be called by your callback.
您必须要记住的一件事:如果您的代码中存在这些依赖项,则不能在脚本底部放置任何依赖项,等待运行,内联。它们必须全部锁定在回调中,或锁定在等待被回调调用的函数内。
This is simply because it is an asynchronous process, in terms of actual processing, and will not block the browser from running events/JS, rendering the page, et cetera.
这只是因为它在实际处理方面是一个异步过程,并且不会阻止浏览器运行事件/ JS,呈现页面等等。
#1
2
For requireJS:
You have to pass a callback method alongside the required modules to .require(), that will get fired when the resources were loaded successfully. So, of course you should/can only access loaded AMD or CommonJS modules just within that callback.
您必须将回调方法与所需模块一起传递给.require(),这将在资源成功加载时触发。所以,当然你应该/只能在该回调中访问加载的AMD或CommonJS模块。
for NodeJS:
Yes, .require() does work synchronously. NodeJS uses the CommonJS module system, not AMD.
是的,.require()确实可以同步工作。 NodeJS使用CommonJS模块系统,而不是AMD。
#2
2
There are two different synchronous concepts here. The first is "Will it stop my entire webpage, and sit and wait for the file.".
这里有两种不同的同步概念。第一个是“它会停止我的整个网页,然后等待文件。”
The answer is no. RequireJS doesn't do that if you've got a script with dependencies.
答案是不。如果你有一个带有依赖项的脚本,RequireJS不会这样做。
If you use it appropriately, it uses a promise-system. What that means is that if you send in your callback and define your requirements for that file, the callback won't be run until all of the required files are loaded.
如果你恰当地使用它,它使用一个promise系统。这意味着如果您发送回调并定义对该文件的要求,则在加载所有必需文件之前不会运行回调。
If there's a require inside of one of those required files, then THAT callback won't be run until ITS dependencies have loaded.
如果在其中一个必需文件中有一个require,那么在ITS依赖项加载之前,不会运行那个回调。
The outermost callback (the one that would be at the bottom of your script, normally), won't run until everything inside has.
最外层的回调(通常位于脚本底部的回调)在内部的所有内容都不会运行。
This works on a promise system. It's worth understanding how promise systems work (similar to an observer-pattern, in a way). They're meant to be passed around or chained, based on an event, rather than having multiple people listen in any order.
这适用于承诺系统。值得了解承诺系统如何工作(在某种程度上类似于观察者模式)。它们意味着根据事件传递或链接,而不是让多个人以任何顺序收听。
var widget = new Widget(),
widgetLoaded = widget.load(url); // return a promise to let the program use the widget
widgetLoaded.then(function () { widget.move(35); })
.then(function () { widget.setColour("Blue"); })
.then(function () { widget.show(); });
This is like returning this so that you can chain function calls, except that the calls don't actually happen until widget.load() completes.
这就像返回这个,以便你可以链接函数调用,除了在widget.load()完成之前调用实际上没有发生。
The widget will actually control when this happens, by keeping its promise if the widget loads and everything is fine, or by breaking its promise if something went wrong.
小部件实际上会控制何时发生这种情况,如果小部件加载并且一切正常,则保持其承诺,或者如果出现问题则通过违反其承诺。
In most promise systems, .then or whatever they call it, either takes two functions (kept and broken -- in my systems, brokens are always optional), or they take an object with success and failure -- $.ajax does this, and then lets you predetermine what you want to do with the data when it's loaded, or if it fails -- promises.
在大多数promise系统中,.then或者他们称之为的任何系统,要么需要两个函数(保持和破坏 - 在我的系统中,brokens总是可选的),或者它们取得成功和失败的对象 - $ .ajax这样做,然后让你预先确定你在加载数据时想要做什么,或者如果它失败了 - 承诺。
So your page still work 100% asynchronously (without interrupting the UI), but it's 100% synchronous in that all of the modules will fire in the right order.
因此,您的页面仍可100%异步工作(不会中断UI),但它是100%同步的,因为所有模块都将以正确的顺序触发。
One thing you MUST REMEMBER: If you have these dependencies in your code, you can not have any dependencies lying around at the bottom of your script, waiting to run, inline. They must all be locked away inside of your callback, or locked inside a function waiting to be called by your callback.
您必须要记住的一件事:如果您的代码中存在这些依赖项,则不能在脚本底部放置任何依赖项,等待运行,内联。它们必须全部锁定在回调中,或锁定在等待被回调调用的函数内。
This is simply because it is an asynchronous process, in terms of actual processing, and will not block the browser from running events/JS, rendering the page, et cetera.
这只是因为它在实际处理方面是一个异步过程,并且不会阻止浏览器运行事件/ JS,呈现页面等等。