JavaScript-ES6模块化内容

前端.Lee

已于 2023-02-06 22:54:21 修改

阅读量503

点赞数 2

分类专栏：前端 ES6模块化原生JS 文章标签：前端 javascript chrome json css3

于 2023-02-06 22:50:02 首次发布

本文链接：https://blog.youkuaiyun.com/LEElcg/article/details/128908812

版权

本文介绍了ES6的模块化标准，包括预声明的导入导出方式、依赖延迟声明的优缺点以及规范的路径表示法。通过实例展示了如何在HTML中使用`<script type="module">`引入模块，并提供了关于基本暴露和导入的注意事项，以及默认暴露和导入的示例。文章鼓励读者发现并提出问题，进行技术交流。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

ES6模块化简介：

ESMA组织参考了众多的社区模块化标准，终于在2015年。随着ES6发布了官方的模块化标准后成为ES6模块化。

ES6模块化具有以下特点：

1 . 使用依赖预声明的方式导入模块

1.依赖延迟声明 require

优点：某些时候可以提高效率

缺点：无法在一开始确定模块依赖关系

1. 预声明：

优点：在一开始就可以确定依赖模块关系。

缺点：某些时候，效率较低。

2 . 灵活的多种的导入导出方式。

3 . 规范的路径表示法：所有路径必须以./或者../开头。

首先，新建index.html；名称随意，可以任意起名，在此只是做演示。

注意点：需要将<script type="module" src="你的js文件路径"></script>

在这里写上type="module"的时候，浏览器会当做这个地方是以模块运行的，不然运行不起来。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 原来当做是模块运行的 -->
    <script type="module" src="./modules/test.j

最低0.47元/天解锁文章