Question

我在结构中有两个js文件可以简化为：

JS1：

$(function() {
   function f1 {
         f2();
    }
});

JS2：

$(function() {
     function f2() {
     }
});

我是否必须在全局对象的js2中声明我的所有函数来执行此操作，还是有更简单的方法？我目前正在获取未捕获的引用错误，因为js1无法找到js2的函数。

两个脚本文件都包含在页眉中。

Answer 1

我是否必须在全局对象的js2中声明我的所有函数才能执行此操作

是

或者，至少，必须有一个全局对象，通过它可以访问它们（例如foo.bar.baz.f2）。

var foo = {};
$(function() {
     function f2() {
     }
     foo.bar = { baz: { f2: f2 } };
});

Answer 2

虽然您的问题的简单答案只是连接两个文件或将函数定义为全局变量或使用全局命名空间，但我认为提及当前最流行的解决方案也是合适的。 javascript开发。

主要是您需要阅读有关javascript模块的更多信息（最流行的格式为AMD和CommonJS）并根据它们构建您的应用。

使用诸如browserify或requirejs之类的工具，您可以获得问题的正确解决方案，并主要将您的函数包装在模块中，如下所示：

/* module f1 ( file f1.js ) */
module.exports = function() { ... }

/* module f2 ( file f2.js ) */
f1 = require('./f1');
f2 = function() { ... /* you can access f1 function here */ };

并且AMD格式将如下所示：

/* module f1 ( file f1.js ) */
define('f1', function() { ... });

/* module f2 ( file f2.js ) */
define('f2', ['f1'], function(f1) { /* you can access f1 function here */ });

以及稍后在您的HTML中，您可以简单地执行

<script src='requirejs.js'></script>
<script src='f1.js'></script>
<script src='f2.js'></script>
<script>require('f2');</script>

注意：这个答案对您的问题不是最简单的解决方案，它更适合假装。

如何在另一个js文件中使用一个js文件中的函数？

2 个答案: