ES6模块化学习

1. 回顾:node.js 中如何实现模块化

node.js 遵循了 CommonJS 的模块化规范。其中:
        导入其它模块使用 require() 方法
        模块对外共享成员使用 module.exports 对象

模块化的好处: 大家都遵守同样的模块化规范写代码,降低了沟通的成本,极大方便了各个模块之间的相互调用,利人利己。

2. 前端模块化规范的分类

在 ES6 模块化规范诞生之前,JavaScript 社区已经尝试并提出了 AMD、CMD、CommonJS 等模块化规范。
但是,这些由社区提出的模块化标准,还是存在一定的差异性与局限性、并不是浏览器与服务器通用的模块化标准,例如:
        AMD 和 CMD 适用于浏览器端的 Javascript 模块化
        CommonJS 适用于服务器端的 Javascript 模块化

太多的模块化规范给开发者增加了学习的难度与开发的成本。因此,大一统的 ES6 模块化规范诞生了!

3. 什么是 ES6 模块化规范

ES6 模块化规范是浏览器端与服务器端通用的模块化开发规范。它的出现极大的降低了前端开发者的模块化学习成本,开发者不需再额外学习 AMD、CMD 或 CommonJS 等模块化规范。

ES6 模块化规范中定义:
        每个 js 文件都是一个独立的模块 
        导入其它模块成员使用 import 关键字  
        向外共享模块成员使用 export 关键字

4. 在 node.js 中体验 ES6 模块化

node.js 中默认仅支持 CommonJS 模块化规范,若想基于 node.js 体验与学习 ES6 的模块化语法,可以按照如下两个步骤进行配置:
        ①确保安装了 v14.15.1 或更高版本的 node.js (node -v 查看node版本)
        ②在 package.json 的根节点中添加
"type": "module" 节点npm init -y 初始化包管理配置文件,注意:初始化包管理配置文件的时候,文件名不能是中文

5. ES6 模块化的基本语法

ES6 的模块化主要包含如下 3 种用法:
        ①默认导出与默认导入
        ②按需导出与按需导入
        ③直接导入并执行模块中的代码

5.1 默认导出与默认导入

①默认导出

        默认导出的语法: export default 默认导出的成员

 默认导出的注意事项每个模块中,只允许使用唯一的一次 export default,否则会报错!

②默认导入

        默认导入的语法: import 接收名称 from '模块标识符'

默认导入的注意事项:默认导入时的接收名称可以任意名称,只要是合法的成员名称即可:


③按需导出

        按需导出的语法: export 按需导出的成员

④按需导入

        按需导入的语法: import { s1 } from '模块标识符'


按需导出与按需导入的注意事项:
        每个模块中可以使用多次按需导出 
        按需导入的成员名称必须和按需导出的名称保持一致 
        按需导入时,可以使用 as 关键字进行重命名 
        按需导入可以和默认导入一起使用

⑤直接导入并执行模块中的代码

如果只想单纯地执行某个模块中的代码,并不需要得到模块中向外共享的成员。此时,可以直接导入并执行模块代码,示例代码如下:

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

一对一服务,定制化小程序:NetFarmer助力企业精准触达用户

在当今这个日新月异的数字化时代,小程序以其独特的魅力和广泛的应用场景,正逐步成为企业出海战略中的璀璨明星。NetFarmer,作为业界领先的数字化出海服务商,不仅深谙HubSpot营销自动化的精髓,更在小程序领域展现了卓越…

【UE5.3】笔记8 添加碰撞,检测碰撞

添加碰撞 打开BP_Food,添加Box Collision组件,与unity类似: 调整Box Collision的大小到刚好包裹物体,通过调整缩放和盒体范围来控制大小,一般先调整缩放找个大概大小,然后调整盒体范围进行微调。 碰撞检测 添加好碰撞…

CTF常用sql注入(二)报错注入(普通以及双查询)

0x05 报错注入 适用于页面无正常回显,但是有报错,那么就可以使用报错注入 基础函数 floor() 向下取整函数 返回小于或等于传入参数的最大整数。换句话说,它将数字向下取整到最接近的整数值。 示例: floor(3.7) 返回 3 floor(-2…

Python脚本:将Word文档转换为Excel文件

引言 在文档处理中,我们经常需要将Word文档中的内容转换成其他格式,如Excel,以便更好地进行数据分析和报告。针对这一需求,我编写了一个Python脚本,能够批量处理指定目录下的Word文档,将其内容结构化并转换…

pandas,dataframe使用笔记

目录 新建一个dataframe不带列名带列名 dataframe添加一行内容查看dataframe某列的数据类型新建dataframe时设置了列名,则数据类型为object dataframe的保存保存为csv文件保存为excel文件 dataframe属于pandas 新建一个dataframe 不带列名 df pd.DataFrame() 带…

【C++】unordered系列容器的封装

你很自由 充满了无限可能 这是很棒的事 我衷心祈祷你可以相信自己 无悔地燃烧自己的人生 -- 东野圭吾 《解忧杂货店》 unordered系列的封装 1 unordered_map 和 unordered_set2 改造哈希桶2.1 模版参数2.2 加入迭代器 3 上层封装3.1 unordered_set3.2 unordered_map 4 面…

C++基础22 字符串与字符数组及其相关操作

这是《C算法宝典》C基础篇的第22节文章啦~ 如果你之前没有太多C基础,请点击👉C基础,如果你C语法基础已经炉火纯青,则可以进阶算法👉专栏:算法知识和数据结构👉专栏:数据结构啦 ​ 目…

c++重定向输出和输出(竞赛讲解)

1.命令行重定向 在命令行中指定输出文件 指令 .\重定向学习.exe > 1.txt 效果 命令行输入和输出 指令 .\重定向学习.exe < 2.txt > 1.txt 效果 代码 #include<bits/stdc++.h> using namespace std; int n; int main(){cin>>n;for(int i=0;i<n;i…

4、SSD主控

简述 主控是个片上系统&#xff0c;由硬件和固件组成一个功能完整的系统&#xff1b;上文所述的FTL就属于主控的固件范畴。主控闪存构成了整个SSD&#xff0c;在闪存确定的情况下&#xff0c;主控就反映了各家SSD的差异。实时上各家SSD的差异也主要反应在主控上&#xff0c;毕…

VMware虚拟机Ubuntu网络有线线缆已拔出问题

1、问题描述 VMware虚拟机Ubuntu不能联网&#xff0c;打开设置中&#xff0c;网络显示“有线 线缆已拔出”。 2、查看虚拟网络连接 查看主机的网络连接&#xff0c;确保虚拟网络已启用。 3、启动虚拟机网络服务 打开主机的 ‘服务’&#xff08;winr&#xff0c;运行框中输入…

46.修复HOOK对代码造成的破坏

上一个内容&#xff1a;45.使用hook点链表实现指定跳转 以 45.使用hook点链表实现指定跳转 它的代码为基础进行修改 此代码已实现无敌与秒杀功能 HOOKPOINT.h文件里的修改 #pragma oncetypedef struct CPUINFO {unsigned eflags;unsigned edi;unsigned esi;unsigned ebp;un…

PCL从理解到应用【03】KDTree 原理分析 | 案例分析 | 代码实现

前言 本文分析KDTree的原理&#xff0c;集合案例深入理解&#xff0c;同时提供源代码。 三个案例&#xff1a;K近邻搜索、半径内近邻搜索、近似最近邻搜索。方法对比&#xff0c;如下表所示&#xff1a; 特性K近邻搜索半径内近邻搜索近似最近邻搜索描述查找K个最近邻点查找指…

Linux系统(CentOS)安装Mysql5.7.x

安装准备&#xff1a; Linux系统(CentOS)添加防火墙、iptables的安装和配置 请访问地址&#xff1a;https://blog.csdn.net/esqabc/article/details/140209894 1&#xff0c;下载mysql安装文件&#xff08;mysql-5.7.44为例&#xff09; 选择Linux通用版本64位&#xff08;L…

[深度学习]卷积理解

单通道卷积 看这个的可视化就很好理解了 https://github.com/vdumoulin/conv_arithmetic/blob/master/README.md 多通道卷积 当输入有多个通道时,卷积核需要拥有相同的通道数. 假设输入有c个通道,那么卷积核的每个通道分别于相应的输入数据通道进行卷积,然后将得到的特征图对…

说明本文档目录是软件开发梳理需求常见问题QA文档,方便客户看,也方便我们的售前人员,需求分析人员,ui设计师,原型绘图人员,思维导图绘图人员查看。

https://doc.youyacao.com/117/2150 说明 本文档目录是软件开发梳理需求常见问题QA文档&#xff0c;方便客户看&#xff0c;也方便我们的售前人员&#xff0c;需求分析人员&#xff0c;ui设计师&#xff0c;原型绘图人员&#xff0c;思维导图绘图人员查看。 提示 本内容客户…

【ABB】控制器语言切换

【ABB】控制器语言切换 操作流程演示 操作流程 点击【菜单】点击【Control Panel】点击【Language】点击【Chinese】点击【OK】此时会弹出弹窗&#xff0c;点击【YES】此时控制器会重启&#xff0c;重启完成就是中文了 演示 点击【菜单】 点击【Control Panel】 点击【Langua…

4.2 投影

一、投影和投影矩阵 我们以下面两个问题开始&#xff0c;问题一是为了展示投影是很容易视觉化的&#xff0c;问题二是关于 “投影矩阵”&#xff08;projection matrices&#xff09;—— 对称矩阵且 P 2 P P^2P P2P。 b \boldsymbol b b 的投影是 P b P\boldsymbol b Pb。…

涂山璟无缘奥运会

“涂山璟无缘奥运会”在那片被浪漫与幻想包裹的剧集世界里&#xff0c;涂山璟与小夭的故事&#xff0c;如同夏日里的一缕清风&#xff0c;温柔而又坚定。当爱情以纯粹的形式展现&#xff0c;一个简单的愿望——亲手摘取湖中的海棠花&#xff0c;便成为了两人情感交流的甜蜜桥梁…

吉洪诺夫正则化随笔

前言 前几天在回顾压缩感知中的特征选择与LASSO回归发现了这个Tikhonov regularization&#xff0c;查了一下叫个如题的名字。先来浅说一下正则化这玩意&#xff1a;正则化&#xff08;Regularization&#xff09;是一种用来防止模型过拟合&#xff08;Overfitting&#xff09…

【数据库了解与学习】

1.下载所需版本安装包 1.1将所需文件压缩包以及安装包放在你选择的任意一盘&#xff0c;新建一个没有文字和空格的文件夹 1.2双击打开安装包&#xff0c;选择Custom自定义模式然后点击右下方的Next 1.4三连点击1&#xff0c;再点击箭头出现3&#xff0c;选中3出现4&#xff0c;…