javascript同步Import,同步调用外部js的方法

JavaScript同步Import是一种将外部JavaScript文件同步导入到当前JavaScript文件中的方法。这种方法可以让外部JavaScript文件中的函数和变量永久地集成到当前JavaScript文件中。以下是使用该方法的完整攻略：

1. 创建一个外部的JavaScript文件

首先，您需要在与当前JavaScript文件相同的目录中创建一个外部JavaScript文件。您可以使用任何文本编辑器编写代码，此处不作过多讲解。

下面是一个例子，假设您在当前目录中已有一个名为"external.js"的Javascript文件。

//示例代码
function sum(a,b){
    return a+b;
}

function mult(a,b){
    return a*b;
}

2. 在主JavaScript文件中进行同步Import

接下来，您需要在主JavaScript文件中使用同步导入的语法来将外部JavaScript文件导入到此文件中。您可以使用<script type="module">标签来实现此目的。

<!-- 在HTML文件中加入如下的代码，引入外部JS文件 -->
<script type="module" src="./external.js"></script>

<!-- 在JS文件中使用 external.js 中的函数 -->
<script type="module">
    console.log( sum(1,2) );   //输出 3
    console.log( mult(3,4) );  //输出 12
</script>

示例说明

以上代码中，<script type="module" src="./external.js"></script>标签可将外部JavaScript文件同步导入到当前主JavaScript文件中。导入后，您就可以使用该文件中的函数和变量来编写代码。

接下来，我们使用如下代码在<script type="module">下面的JavaScript内容中使用从外部JavaScript文件中导入的函数。

console.log( sum(1,2) );   //输出 3
console.log( mult(3,4) );  //输出 12

运行上述代码时，您将看到3和12被输出。

示例说明2

我们继续用另一个小例子说明该功能。此处的external.js文件中，我们定义了一个名为generateUUID的函数，该函数能够生成唯一的通用唯一标识符（UUID）。

// external.js
export function generateUUID(){
    let d = new Date().getTime();
    let uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
        let r = (d + Math.random()*16)%16 | 0;
        d = Math.floor(d/16);
        return (c=='x' ? r : (r&0x3|0x8)).toString(16);
    });
    return uuid;
}

下面是如何在主JavaScript文件中使用该函数的代码。

<!-- 在HTML文件中加入如下的代码，引入外部JS文件 -->
<script type="module" src="./external.js"></script>

<!-- 在JS文件中使用 external.js 中的函数 -->
<script type="module">
    console.log( generateUUID() );   //输出一个字符串如： "3b1477ae-c4e0-4558-8ed6-edef6d5ce7fd"
</script>

在上述代码中，我们使用generateUUID()函数生成了一个唯一的字符串，并通过console.log打印输出。

总结

使用同步导入的方法，我们可以非常方便地将外部JavaScript文件中的函数和变量导入到当前主JavaScript文件中，并对这些方法进行使用。