ES6模块化
目录
一、什么是 ES6 模块化规范
二、ES6 模块化的基本语法
2.1默认导出
2.1默认导入
2.1 注意事项
2.2按需导出
2.2按需导入
2.2按需导出与按需导入的注意事项
2.3直接导入并执行模块中的代码
一、什么是 ES6 模块化规范
ES6 模块化规范是浏览器端与服务器端通用的模块化开发规范。它的出现极大的降低了前端开发者的模块化学习成本,开发者不需再额外学习 AMD、CMD 或 CommonJS 等模块化规范。
ES6 模块化规范中定义:
- 每个 js 文件都是一个独立的模块
- 导入其它模块成员使用 import 关键字
- 向外共享模块成员使用 export 关键字
二、ES6 模块化的基本语法
- 默认导出与默认导入
- 按需导出与按需导入
- 直接导入并执行模块中的代码
2.1默认导出
默认导出的语法: export default 默认导出的成员
// es6_export.js 文件
// 定义模块私有成员 num1
let num1 = 10 // 定义模块私有成员 mum2
let num2 = 20 // 定义模块私有方法 show()
function show(){} // 使用 export default 默认导出语法,向外共享 num1 和 show 两个成员。
export default {num1,show
}
2.1默认导入
默认导入的语法: import 接收名称 from '模块标识符'
// es6_import.js 文件
// 从 es6_export.js 模块中导入 export default 向外共享的成员。
// 并使用 result 成员进行接收
import result from './es6_export.js'// 打印输入的结果
console.log(result)
//{ num1: 10, show: [Function: show] }
2.1 注意事项
每个模块中,只允许使用唯一的一次 export default,否则会报错!
默认导入时的接收名称可以任意名称,只要是合法的成员名称即可。
2.2按需导出
按需导出的语法: export 按需导出的成员
// 定义模块私有成员 num1,并向外按需导出变量
export let num1 = 10 // 定义模块私有成员 mum2,并向外按需导出变量
export let num2 = 20 // 定义模块私有方法 show(),并向外按需导出方法
export function show(){}
2.2按需导入
按需导入的语法: import { s1 } from '模块标识符'
// 导入模块成员
import {num1,num2,show} from './es6_export.js'// 打印输入的结果
console.log(num1)
console.log(num2)
console.log(show)
// 10
// 20
// [Function: show]
2.2按需导出与按需导入的注意事项
- 每个模块中可以使用多次按需导出
- 按需导入的成员名称必须和按需导出的名称保持一致
- 按需导入时,可以使用 as 关键字进行重命名
- 按需导入可以和默认导入一起使用
2.3直接导入并执行模块中的代码
如果只想单纯地执行某个模块中的代码,并不需要得到模块中向外共享的成员。此时,可以直接导入并执行模 块代码,示例代码如下:
// es6_export.js
// 在当前模块中执行一个 for 循环
for(let i = 0; i < 3; i++){console.log(i)
}// es6_import.js
// 直接导入并执行模块代码,不需要得到模块向外共享的成员
import './es6_export.js'//输出结果:
// 0
// 1
// 2
相关文章:
ES6模块化
目录 一、什么是 ES6 模块化规范 二、ES6 模块化的基本语法 2.1默认导出 2.1默认导入 2.1 注意事项 2.2按需导出 2.2按需导入 2.2按需导出与按需导入的注意事项 2.3直接导入并执行模块中的代码 一、什么是 ES6 模块化规范 ES6 模块化规范是浏览器端与服务器端通用的…...
201809-3 CCF 元素选择器 满分题解(超详细注释代码) + 解题思路(超详细)
问题描述 解题思路 根据题意可以知道在查询中可以分为两种情况 第一种是查询一个标签选择器或者id选择器(可以称为一级查询) 第二种就是存在大于两级的查询(可以称为多级查询) 显然第一种查询需要存储每一种元素在内容中所有出现…...
证书拓展域(1)
证书拓展定义了数字证书的标准拓展,每个拓展域GB/T 16264.8-200X中定义的一个OID相关。 这些OID都是id-ce的成员,其定义如下: id-ce OBJECT IDENTIFIER :: { joint-iso-ccitt(2) ds(5) 29 }1.证书策略 certificatePolicies 1.1 定义 本…...
浅谈ChatGPT 和 对AI 的思考
新世纪以来,人工智能作为一个非常热门话题,一直收到大众的广泛的关注。从一开始的图像的分类,检测,到人脸的识别,到视频分析分类,到事件的监测,到基于图片的文本生成,到AI自动写小说…...
NCRE计算机等级考试Python真题(十二)
第十二套试题1、以下关于程序设计语言的描述,错误的选项是:A.Python语言是一种脚本编程语言B.汇编语言是直接操作计算机硬件的编程语言C.程序设计语言经历了机器语言、汇编语言、脚本语言三个阶段D.编译和解释的区别是一次性翻译程序还是每次执行时都要翻…...
Java并发类库提供的线程池有哪几种? 分别有什么特点?
第21讲 | Java并发类库提供的线程池有哪几种? 分别有什么特点? 我在专栏第 17 讲中介绍过线程是不能够重复启动的,创建或销毁线程存在一定的开销,所以利用线程池技术来提高系统资源利用效率,并简化线程管理,…...
企业微信如何群发消息到客户群?
为提升工作效率,工作中,企业常常会借助企业微信的群发功能一键发送多个客户。那么企业微信如何群发消息呢? 其中成员个人支持群发消息到客户群,企业也可以创建内容提醒成员进行执行群发。 管理员支持在管理端或在手机端创建企业…...
【信号与系统笔记】第一章 绪论
1.1信号传输系统 信息传输的任务 将带有信息的信号,通过某种系统由发送者传送给接收者。 通信系统的组成 转换器:把消息转换为电信号或者把电信号还原成消息信道:信号传输的通道,广义上来说。发射机和接收机也可以是信道的一部分…...
[神经网络]DETR目标检测网络
一、概述 相较于传统目标检测,DETR是一种纯端到端的网络。它不再需要NMS(非极大值抑制,用于去除多余的预测框)和生成anchor。 DETR提出了一个新的目标函数(二分图匹配),这个函数可以强制网络输出一个独一无二的预测值&…...
【服务器管理】connection refused问题解决
简述 在配置服务器的时候,遇到了这个问题。我当时明明已经搭建好了服务,但是我在客户端比如手机上,却怎么都连不上服务器。看日志的话显示的是connection refuesed timeout 这种情况,大概率是服务器的端口没有被打开。 我们只需…...
2023_华为OD机试真题_Python_047_整理扑克牌
整理扑克牌 题目描述 给定一组数字,表示扑克牌的牌面数字,忽略扑克牌的花色,请按如下规则对这一组扑克牌进行整理: 步骤1. 对扑克牌进行分组,形成组合牌,规则如下: 当牌面数字相同张数大于等于4时,组合牌为“炸弹”;3张相同牌面数字 + 2张相同牌面数字,且3张牌与2…...
吐血整理,自动化测试pytest测试框架,资深测试带你少走弯路......
目录:导读前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结(尾部小惊喜)前言 Pytest框架详解 py…...
SAP BASE64加密及解密
简介:BASE64是一种编码方法,它是一种基于用64个可打印字符来表示二进制数据的表示方法,主要应用于数据存储,传输,打印它是用64个可打印字符表示二进制所有数据方法。由于2的6次方等于64,所以可以用每6个位元…...
【页面无响应】Web页面经常无响应前端如何定位与优化(已解決)
【写在前面】客户现场应用我们的系统时候,发现用着用着就出现1个页面无响应现象,给客户带来极其不好的体验,尤其是当重要工作汇报演示时,就给我看无响应,浏览器崩溃?这样对产品的发展无疑是致命的伤&#x…...
隐私计算 FATE - 多分类神经网络算法测试
一、说明 本文分享基于 Fate 使用 横向联邦 神经网络算法 对 多分类 的数据进行 模型训练,并使用该模型对数据进行 多分类预测。 二分类算法:是指待预测的 label 标签的取值只有两种;直白来讲就是每个实例的可能类别只有两种 (0 或者 1)…...
Codeforces Round 853 (Div. 2)
Codeforces Round 853 (Div. 2) C. Serval and Toxels Arrays 思路: 求任意两个组合的元素个数。 注意到,其实每个元素都是独立的。他在任意组合的出现情况组成的贡献是可以分开讨论的。我们讨论元素x。假设x在m1个数组中出现了cnt次(一个…...
Ka频段需要更多带宽?
随着全球连接需求的增长,许多卫星通信(satcom)系统日益采用Ka频段,对数据速率的要求也水涨船高。目前,高性能信号链已经能支持数千兆瞬时带宽,一个系统中可能有成百上千个收发器,超高吞吐量数据速率已经成为现实。 另…...
初学pyinstaller打包过程中的一些问题
记录一下使用pyinstaller打包过程中的一些问题: 不安装虚拟环境打包,直接打包,一般不会出现什么问题,但是打包的exe很大,把所有模块和依赖库也一起打包了。 建议使用虚拟环境打包,安装必要的包࿰…...
第七章:Java常用类
第七章:Java常用类 7.1:字符串相关的类 String的特性 String表示是字符串,使用一对""引起来表示。 String声明为final的,不可被继承。 String实现了Serializable、Comparable接口,表示字符是支持序列化和…...
Apk加固后多渠道打包
之前一直使用360加固宝进行apk的加固打包,可以一键加固并打多渠道打包。但是,现在360加固宝收费了,在进行加固,多渠道打包,就得一步一步自己操作了,会很繁琐。所以,本文使用 360加固美团Wallet …...
国防科技大学计算机基础课程笔记02信息编码
1.机内码和国标码 国标码就是我们非常熟悉的这个GB2312,但是因为都是16进制,因此这个了16进制的数据既可以翻译成为这个机器码,也可以翻译成为这个国标码,所以这个时候很容易会出现这个歧义的情况; 因此,我们的这个国…...
OpenLayers 可视化之热力图
注:当前使用的是 ol 5.3.0 版本,天地图使用的key请到天地图官网申请,并替换为自己的key 热力图(Heatmap)又叫热点图,是一种通过特殊高亮显示事物密度分布、变化趋势的数据可视化技术。采用颜色的深浅来显示…...
Linux链表操作全解析
Linux C语言链表深度解析与实战技巧 一、链表基础概念与内核链表优势1.1 为什么使用链表?1.2 Linux 内核链表与用户态链表的区别 二、内核链表结构与宏解析常用宏/函数 三、内核链表的优点四、用户态链表示例五、双向循环链表在内核中的实现优势5.1 插入效率5.2 安全…...
论文解读:交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架(二)
HoST框架核心实现方法详解 - 论文深度解读(第二部分) 《Learning Humanoid Standing-up Control across Diverse Postures》 系列文章: 论文深度解读 + 算法与代码分析(二) 作者机构: 上海AI Lab, 上海交通大学, 香港大学, 浙江大学, 香港中文大学 论文主题: 人形机器人…...
【网络安全产品大调研系列】2. 体验漏洞扫描
前言 2023 年漏洞扫描服务市场规模预计为 3.06(十亿美元)。漏洞扫描服务市场行业预计将从 2024 年的 3.48(十亿美元)增长到 2032 年的 9.54(十亿美元)。预测期内漏洞扫描服务市场 CAGR(增长率&…...
解锁数据库简洁之道:FastAPI与SQLModel实战指南
在构建现代Web应用程序时,与数据库的交互无疑是核心环节。虽然传统的数据库操作方式(如直接编写SQL语句与psycopg2交互)赋予了我们精细的控制权,但在面对日益复杂的业务逻辑和快速迭代的需求时,这种方式的开发效率和可…...
SpringTask-03.入门案例
一.入门案例 启动类: package com.sky;import lombok.extern.slf4j.Slf4j; import org.springframework.boot.SpringApplication; import org.springframework.boot.autoconfigure.SpringBootApplication; import org.springframework.cache.annotation.EnableCach…...
网络编程(UDP编程)
思维导图 UDP基础编程(单播) 1.流程图 服务器:短信的接收方 创建套接字 (socket)-----------------------------------------》有手机指定网络信息-----------------------------------------------》有号码绑定套接字 (bind)--------------…...
企业如何增强终端安全?
在数字化转型加速的今天,企业的业务运行越来越依赖于终端设备。从员工的笔记本电脑、智能手机,到工厂里的物联网设备、智能传感器,这些终端构成了企业与外部世界连接的 “神经末梢”。然而,随着远程办公的常态化和设备接入的爆炸式…...
代理篇12|深入理解 Vite中的Proxy接口代理配置
在前端开发中,常常会遇到 跨域请求接口 的情况。为了解决这个问题,Vite 和 Webpack 都提供了 proxy 代理功能,用于将本地开发请求转发到后端服务器。 什么是代理(proxy)? 代理是在开发过程中,前端项目通过开发服务器,将指定的请求“转发”到真实的后端服务器,从而绕…...
