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

How do I use a function from one js file inside another js file?

本文关键字：js 文件 函数 一个 另一个      更新时间：2023-09-26

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

js1: 

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

js2: 

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

我是否必须在js2的全局对象中声明我的所有函数才能做到这一点，或者是否有更简单的方法?我目前得到未捕获的引用错误，因为js1找不到js2的函数。

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

我是否必须在一个全局对象中声明js2中的所有函数来做到这一点

是的

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

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

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

主要是你需要阅读更多关于javascript模块(最流行的格式是AMD和CommonJS)，并根据它们构建你的应用程序。

使用工具，如browserify或需求，你可能会得到你的问题的适当解决方案，主要包装你的功能在模块中，像这样:

/* 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>

:这个答案不是你问题的最简单的解决方案，它更像是正确的解决方案

相关文章：