如何从一个js文件调用函数到另一个

Question

我在 HTML 中定义了一个模块类型的函数。我需要从同一个 HTML 文件中包含的另一个 js 文件调用该函数。当我从 js 文件中调用一个函数时，它被称为引用错误。

这是我的 HTML 文件中的内容：

<script src="../src/viewer.js"></script>
<script type="module" src="../pravintest/player.js"></script>

在 viewer.js 文件中，我有一个代码，我在其中调用 player.js 中的函数 crossdatacheck(param)。

这是我的 player.js 文件：

 import * as THREE from './threejs/build/three.module.js';
        import { GUI } from './threejs/examples/jsm/libs/dat.gui.module.js';
        import { OrbitControls } from './threejs/examples/jsm/controls/OrbitControls.js';
        import { NRRDLoader } from './threejs/examples/jsm/loaders/NRRDLoader.js';
        import { VolumeRenderShader1 } from './threejs/examples/jsm/shaders/VolumeShader.js';
        import { WEBGL } from './threejs/examples/jsm/WebGL.js';


        var renderer,
            scene,
            camera,
            controls,
            material,
            volconfig,
            cmtextures;

         function crossdatacheck(data) {
        console.log(data);
         }

我想从 viewer.js 文件中调用这个函数。

当我从 viewer.js 调用函数时出现错误 -> reference error: crossdatacheck function is not defined in viewer.js 谁能向我建议我该怎么做？

Answer 1

模块有自己的作用域，顶级var 语句和function 声明不会创建全局变量。 （这很好，全局变量有问题）。

处理这个问题：

1. export要在模块外使用的变量
2. 更改加载viewer.js的<script>，使其作为模块加载
3. 删除加载player.js的<script>
4. 从 player.js 中导入您想与 viewer.js 中的 import 语句一起使用的变量