两个外部文件之间的 Javascript 变量

Question

我是 JS 新手，我不明白为什么这不起作用。以下内容位于名为 test1.js

的文件中

var greeting;

function randomGreeting(){
    var greet = new Array("BORING JS TEST ALERT", "EXCITING JS TEST ALERT", "AWESOME JS TEST ALERT");
    var randGreet = Math.floor(Math.random() * greet.length);

    greeting = {
        alert: greet[randGreet]
    };
}

在单独的 test2.js 文件中:

alert(greeting.alert);

在我的 HTML 中，我在正文的 onLoad 中调用了 randomGreeting()，并且在 之前加载了 test1.js test2.js，但当 test2 运行时，我仍然从控制台得到 undefined 。为什么？

Answer 1

您对 test2.js 的运行存在竞争条件，并且文档 onload 事件会在很晚之后触发。

您可以延迟警报，直到设置变量

(function(){
   if (typeof greeting == "undefined")
      return window.setTimeout(arguments.callee, 10);

   alert(greeting.alert);
}());

如果您不记得 randomGreeting，您可以将其内联

var greet = new Array("BORING JS TEST ALERT", "EXCITING JS TEST ALERT", "AWESOME JS TEST ALERT");
var randGreet = Math.floor(Math.random() * greet.length);
var greeting = {
    alert: greet[randGreet]
};

或者您可以更改脚本以使用 defer属性

<script scr="test1.js"></script>
<script scr="test2.js" defer></script>
<script>
window.onload = function(){
    alert(greeting.alert);
};
</script>