Javascript 如何避免在加载外部JS文件之前丢失对该文件的调用

我的问题是，多个网站将包含我的JS文件，当调用类似这样的内容时：

<script src="..."></script>

hello.say("yay");

---

如何做到这一点？

如果您将文件包含在html页面的页眉部分，则在运行页面中的任何其他javascript之前，将加载该文件

---

UPD：另外，我认为即使是thml文本中包含的文件也会在处理其余的Java脚本之前下载。首先，你确定这是你的问题吗？

Google Analytics使用了一个技巧，这是一个只能用duck类型语言完成的完美例子。如果GA脚本尚未加载，则主对象是一个数组，但如果已加载，则会更改其行为。让我们看看我能不能解释一下

我从stackoverflow的来源中提取了这篇文章：

var _gaq = _gaq || [];
_gaq.push(['_setAccount','UA-5620270-1']);
_gaq.push(['_trackPageview']);

它看起来像一个数组，其中包含一些值。事实上，如果运行此代码时是

\u gaq

（如果还没有运行其他分析JavaScript，也是如此），则它将作为一个数组。然后，当主分析脚本（包含在页面上任意位置的脚本标记）加载时，它将检查此数组并根据数组的内容执行一些任务

因此，如果这种情况以相反的顺序发生（首先加载主脚本，然后加载上面的代码段），则主脚本会使用push方法将

\u gaq

设置为一个对象，该方法执行google希望它执行的任何操作。稍后，当上面的代码运行时，

\u gaq.push

不仅仅是向数组添加值；它实际上执行任意代码（并且根本不推送到数组）

---

因此，无论先运行哪个脚本，当两个脚本都完成时，最终结果将是相同的。

您需要将依赖外部javascript的任何javascript代码的执行延迟到页面完全加载之后，您可以通过将执行附加到window.onload事件来完成

window.onload = function() {
  hello.say('yay');
}

但这样做的缺点是只对一个函数工作，并且会覆盖最初附加到该事件的任何函数。你可能想阅读Simon Wilson的帖子和关于如何处理这种情况的解决方案的评论

---

我有点不确定你认为种族问题是什么

浏览器总是按照它们看到的顺序*执行脚本标记。如果这不是真的，互联网的很大一部分将会崩溃——就像存在的几乎所有常见JavaScript库一样

因此，只要用户在文档中加载脚本的时间早于调用其API的时间，您就不会有问题。我能想到的唯一可能的例外是，如果脚本的初始化依赖于异步逻辑，那么您应该考虑为用户提供自己的标准回调机制来编写代码

如果用户可能会在使用API之后加载脚本，那么Jakob在回答中提到的技巧就行了。但我甚至不确定你的目标是达到那种复杂程度

---

*编辑：老实说，我应该注意到，这有一些特殊的例外情况，但只要你只是在HTML文档中处理

标记的标准非延迟使用。

gAnalytics片段可以放在任何地方。是的，后来也提出了这个问题。这个答案的第一段有点错误。您不必等待window.onload运行依赖于外部JS的代码；所有JS都是按顺序加载和执行的（除非另有明确指示），因此实际上，您可以依靠外部JS文件中的代码来加载/执行，即使在紧跟其后的脚本标记中也是如此。你不能依赖的是页面的整个DOM都准备好了，这通常是人们等待window.onload的原因（但也有更好的方法，例如除IE之外的所有浏览器中的DOMContentLoaded事件）。感谢您的澄清，因此实际上，如果页面中有多个javascript标记，它们是按顺序加载的，而不是与页面上的其他外部内容（如图像和css）并行加载？

window.onload = function() {
  hello.say('yay');
}