【JS|第21期】JavaScript模块化:深入解析三种文件暴露方式

日期:2024年7月6日
作者:Commas
签名:(ง •_•)ง 积跬步以致千里,积小流以成江海……
注释:如果您觉得有所帮助,帮忙点个赞,也可以关注我,我们一起成长;如果有不对的地方,还望各位大佬不吝赐教,谢谢^ - ^
1.01365 = 37.7834;0.99365 = 0.0255
1.02365 = 1377.4083;0.98365 = 0.0006

说在最前面:本文 vue3 的示例代码,在没有另外声名的情况下,均采用 <script setup> 组合式代码风格,风格统一,避免混乱,请各位新老食客放心食用哈 ^ _ ^


文章目录

  • 一、前言
  • 二、三种文件暴露方式
    • 1、分别暴露(Multiple Exports):细粒度的控制
    • 2、统一暴露 (Single Export Object):打包你的API
    • 3、默认暴露(Default Export):单一职责原则
  • 三、结语


在这里插入图片描述


一、前言

在现代 JavaScript 开发中,模块化已经成为一种不可或缺的实践。它不仅提高了代码的可维护性可读性,还促进了代码的重用JavaScript 提供了多种模块化的解决方案,其中最常用的就是 ES6模块系统。在这个系统中,我们可以通过不同的方式来暴露模块内部的 变量函数,以便在其他地方使用。今天,我们将深入探讨JavaScript 中的三种文件暴露方式,并通过实例来理解它们的工作原理。

二、三种文件暴露方式

1、分别暴露(Multiple Exports):细粒度的控制

首先,我们来了解 分别暴露 (Multiple Exports 的概念。这种方式允许我们在模块中定义多个export语句,每个语句对应一个需要暴露的变量或函数。这样做的好处是,我们可以非常精确地选择哪些成员对外可见。

让我们看一个简单的例子,假设我们有一个名为 math.js 的模块,它包含了两个数学函数:

// math.jsexport function add(a

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/43545.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

新手小白报考学习PMP会遇到哪些“坑”?

PMP考试的陷阱实际上与其他大型证书考试差不多&#xff0c;主要是在选择培训机构和各种收费方面会遇到一些坑。 首先&#xff0c;并不是每个人都能经历这些坑&#xff0c;因为PMP考试有一定的门槛。 作为引进国外的考试&#xff0c;报名都有中英文之分&#xff0c;所以先来看…

STM32的 DMA(直接存储器访问) 详解

STM32的DMA&#xff08;Direct Memory Access&#xff0c;直接存储器存取&#xff09;是一种在单片机中用于高效实现数据传输的技术。它允许外设设备直接访问RAM&#xff0c;不需要CPU的干预&#xff0c;从而释放CPU资源&#xff0c;提高CPU工作效率&#xff0c;本文基于STM32F…

[极客大挑战 2019]RCE ME

[极客大挑战 2019]RCE ME <?php error_reporting(0); if(isset($_GET[code])){$code$_GET[code];if(strlen($code)>40){die("This is too Long.");}if(preg_match("/[A-Za-z0-9]/",$code)){die("NO.");}eval($code); } else{highlight_f…

(附源码)c#+winform实现远程开机(广域网可用)

实现逻辑 利用UDP协议发送特定格式的魔术包&#xff0c;以远程唤醒具有特定MAC地址的目标计算机。目标计算机的BIOS和网络配置需要支持Wake-on-LAN&#xff08;WOL&#xff09;功能&#xff0c;并且需要在目标计算机上配置正确的网络唤醒设置。 源码在最后 准备工作 进入Bio…

知识图谱入门笔记

自学参考&#xff1a; 视频&#xff1a;斯坦福CS520 | 知识图谱 最全知识图谱综述 详解知识图谱的构建全流程 知识图谱构建&#xff08;概念&#xff0c;工具&#xff0c;实例调研&#xff09; 一、基本概念 知识图谱&#xff08;Knowledge graph&#xff09;&#xff1a;由结…

Redis管理禁用命令

在redis数据量比较大时&#xff0c;执行 keys * &#xff0c;fluashdb 这些命令&#xff0c;会导致redis长时间阻塞&#xff0c;大量请求被阻塞&#xff0c;cpu飙升&#xff0c;严重可能导致redis宕机&#xff0c;数据库雪崩。所以一些命令在生产环境禁止使用。 Redis 禁用命令…

【C语言】指针(3):探索-不同类型指针变量

目录 一、字符指针变量 二、数组指针变量 三、二维数组传参的本质 四、函数指针变量 4.1 函数指针变量 4.2 函数指针变量的使用 4.3 函数指针变量的拓展 五、函数指针数组 六、转移表的应用 通过深入理解指针&#xff08;1&#xff09;和深入理解指针&#xff08;2&am…

67.SAP FICO-凭证类型学习

目录 SAP凭证类型 凭证类型的作用 - OBA7 SAP默认的凭证类型更改 FI相应事务代码默认凭证类型 - OBU1 对FB50、60、70默认凭证类型的更改 - OBZO 后勤货物移动默认凭证类型 - OMBA 发货凭证类型 收货凭证类型 自动移动凭证类型 存货盘点凭证类型 发票默认的凭证类…

数据结构--二叉树相关习题5(判断二叉树是否是完全二叉树 )

1.判断二叉树是否是完全二叉树 辨别&#xff1a; 不能使用递归或者算节点个数和高度来判断。 满二叉树可以用高度和节点来判断&#xff0c;因为是完整的。 但是完全二叉树前面是满的&#xff0c;但是最后一层是从左到右连续这种 如果仍然用这种方法的话&#xff0c;如下图…

暑期备考2024小学生古诗文大会:吃透真题和知识点(持续)

2024年上海市小学生古诗文大会的自由报名初赛将于10月19日&#xff08;星期六&#xff09;正式开始&#xff0c;还有3个多月的时间。 为帮助孩子们备考&#xff0c;我持续分享往年上海小学生古诗文大会真题&#xff0c;这些题目来自我去重、合并后的1700在线题库&#xff0c;每…

加密与安全_密钥体系的三个核心目标之完整性解决方案

文章目录 Pre机密性完整性1. 哈希函数&#xff08;Hash Function&#xff09;定义特征常见算法应用散列函数常用场景散列函数无法解决的问题 2. 消息认证码&#xff08;MAC&#xff09;概述定义常见算法工作原理如何使用 MACMAC 的问题 不可否认性数字签名&#xff08;Digital …

SketchUp Pro 2024:现代科技之诗意体验

在那遥远的唐朝&#xff0c;李白曾以诗酒为伴&#xff0c;游历山川&#xff0c;挥洒才情。而今&#xff0c;若李白穿越时空&#xff0c;手握现代科技之利器——SketchUp Pro 2024&#xff0c;定会以诗意之笔&#xff0c;描绘这款软件的神奇与魅力。 初识SketchUp Pro 2024 初…

k8s record 20240708

一、PaaS 云平台 web界面 资源利用查看 Rancher 5台 CPU 4核 Mem 4g 100g的机器 映射的目录是指docker重启后&#xff0c;数据还在 Rancher可以创建集群也可以托管已有集群 先docker 部署 Rancher&#xff0c;然后通过 Rancher 部署 k8s 想使用 kubectl 还要yum install 安…

ATA-8035射频功率放大器在声动力疗法中的应用

声动力疗法是一种基于声波能量的治疗方法&#xff0c;广泛应用于医疗和美容领域。它利用高强度聚焦的声波来实现切割、破碎或加热组织&#xff0c;以治疗各种疾病和美容问题。在声动力疗法中&#xff0c;射频功率放大器起着至关重要的作用&#xff0c;它负责提供足够的能量来激…

达梦数据库的系统视图v$auditrecords

达梦数据库的系统视图v$auditrecords 在达梦数据库&#xff08;DM Database&#xff09;中&#xff0c;V$AUDITRECORDS 是专门用来存储和查询数据库审计记录的重要系统视图。这个视图提供了对所有审计事件的访问权限&#xff0c;包括操作类型、操作用户、时间戳、目标对象等信…

详解 | 什么是GeoTrust

GeoTrust是一家全球知名的数字证书颁发机构&#xff08;Certificate Authority&#xff0c;简称CA&#xff09;&#xff0c;专注于提供SSL/TLS证书和其他相关的网络安全产品。 1、历史背景&#xff1a; GeoTrust成立于2001年&#xff0c;最初作为一个独立的公司运营。2006年&a…

js+spring boot实现简单前后端文件下载功能

jsboot项目实现自定义下载 一、前端页面 1、先导入axios的js包 2、注意axios响应的格式&#xff1a;result.data.真实的数据内容 3、这里请求的url就是你boot项目的getMapping的url&#xff0c;保持一致即可 4、如果想在后端设置文件名&#xff0c;那么后端生成后&#xf…

安卓应用开发学习:腾讯地图SDK应用改进,实现定位、搜索、路线规划功能集成

一、引言 我的上一篇学习日志《安卓应用开发学习&#xff1a;通过腾讯地图SDK实现定位功能》记录了利用腾讯地图SDK实现手机定位功能&#xff0c;并能获取地图中心点的经纬度信息。这之后的几天里&#xff0c;我对《Android App 开发进阶与项目实战》一书第九章的内容深入解读…

【深度学习实战(44)】Anchor based and Anchor free(无锚VS有锚)

1 anchor-based 深度学习目标检测通常都被建模成对一些候选区域进行分类和回归的问题。在单阶段检测器中&#xff0c;这些候选区域就是通过滑窗方式产生的 anchor&#xff1b;在两阶段检测器中&#xff0c;候选区域是 RPN 生成的 proposal&#xff0c;但是 RPN 本身仍然是对滑窗…

leetcode--层数最深叶子节点的和

leetcode地址&#xff1a;层数最深叶子节点的和 给你一棵二叉树的根节点 root &#xff0c;请你返回 层数最深的叶子节点的和 。 示例 1&#xff1a; 输入&#xff1a;root [1,2,3,4,5,null,6,7,null,null,null,null,8] 输出&#xff1a;15 示例 2&#xff1a; 输入&#xff…