es6模块

news2024/11/23 15:22:09

目录

一、语法说明

二、示例代码

三、运行测试


一.语法说明

JavaScript 现在有两种模块。一种是 ES6 模块,简称 ESM;另一种是 CommonJS 模块,简称 CJS。CommonJS 模块是 Node.js 专用的,与 ES6 模块不兼容。语法上面,两者最明显的差异是,CommonJS 模块使用require()module.exports,ES6 模块使用importexport。ES6 模块不是对象,而是通过export命令显式指定输出的代码,再通过import命令输入。

写法1:

export default A1 ​

import a1 from "./1.js"​

写法2:

export {A1,A2}
​
import {A1,A2} from "./1.js"
​
import {A1 as a1,A2 as a2} from "./1.js"
​
import * as obj from "./1.js"

export function A1(){
    console.log("A1")
}
export function A2(){
    console.log("A2")
}
​
​
import {A1,A2} from "./1.js"
​
import {A1 as a1,A2 as a2} from "./1.js"
​
import * as obj from "./1.js"

混合写法:

export {A1}
export default A2 ​ 

import A2,{A1} from "./1.js"

新增的写法 

//var.js

let arr=["all","race","allSettled","any"]

export {

    arr

}

//met.js

export default promiseAll

export * as MethodsName from './var'

//index.js

import promiseAllFun,{MethodsName} from './met'

node.js中的写法

//1.js

module.exports={

A,

b}

或者

exports.A=A

exports.B=B

let obj=require('1.js')

let AA=obj.A

let BB=obj.B

二、示例代码

 如下图,新建一个src/module文件夹,在该文件下新建index.js、met.js、com.js和var.js四个文件。

  1. index.js为模块的入口文件
  2. met.js为业务逻辑文件
  3. com.js为封装的通用方法文件 
  4. var.js为数据文件

 index.js

import promiseAllFun,{MethodsName} from './met'
console.log(`MethodsName`, MethodsName);
promiseAllFun(MethodsName.arr[2])

met.js

import {
    p1,
    p2,
    p3
} from './com'


let promiseAll=(methods)=>{
    Promise[methods]([p1(), p2(), p3()]).then((res) => {
        console.log(`%cPromise[${methods}]执行成功了`, "color: green;font-size:16px", res)
    })
    .catch((error) => {
        console.log(`%cPromise[${methods}]执行失败了----catch`,"color: red;font-size:16px", error)
    })
}

export default promiseAll
export * as MethodsName from './var'

com.js

let p1 = () => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve("p1---执行了")
        }, 10000);
    })
}
let p2 = () => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve("p2---执行了")
        }, 1000);
    })
}
let p3 = () => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            //resolve("p3---执行了")
            reject("p3---失败了")
        }, 6000);
    })
}

export {
    p1,
    p2,
    p3
}

var.js

let arr=["all","race","allSettled","any"]

export {
    arr
}

三、运行测试

把com.js和var.js中的代码导出,在met.js中引入com.js和var.js,然后再met.js使用并导出,最后在index.js中导入并使用met.js和var.js导出的代码。 如下图:

com.js

 var.js

 met.js

 index.js

 

源码地址:https://github.com/1t1824d/es6_module_class_promise_await_demo/tree/master

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

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

相关文章

XE开发Linux应用(二)-Webservice

新建一个工程。选择如图。继续输入服务名然后就生成对应的单元。增加linux 平台。完善对应的单元代码{ Invokable implementation File for Txaliontest which implements Ixaliontest }unit xaliontestImpl;interfaceuses Soap.InvokeRegistry, System.Types, Soap.XSBuiltIns…

Hive常用内置函数、窗口函数及自定义函数

文章目录一、字符串函数二、数值函数三、日期函数四、其余常用函数五、窗口函数5.1、语法5.2、常用窗口函数六、自定义函数6.1、自定义UDF函数6.2、自定义UDTF函数6.3、将自定义函数导入hive中6.3.1、将项目打成jar包6.3.2、将jar包传入hive目录6.3.3、在hive中加载jar包6.3.4、…

C++回顾(二十五)—— map/multimap容器

25.1 map/multimap的简介 map是标准的关联式容器,一个map是一个键值对序列,即(key,value)对。它提供基于key的快速检索能力。map中key值是唯一的。集合中的元素按一定的顺序排列。元素插入过程是按排序规则插入,所以不能指定插入位置。map的…

BN,LN,IN,GN的理解和用法

绿色区域表示将该区域作用域(四种方法都贯穿了w,h维度),即将该区域数值进行归一化,变为均值为0,标准差为1。BN的作用区域时N,W,H,表示一个batch数据的每一个通道均值为0,标准差为1;LN则是让每个数据的所有channel的均值…

新一代跨平台云备份工具Duplicacy

什么是 Duplicacy ? Duplicacy 是一款云备份软件,通过 Duplicacy 可以将视频,图片,文件,注册表等数据备份到云端。Duplicacy 通过客户端加密和最高级别的重复数据删除功能,将您的文件备份到许多云存储。 安…

SQL查漏补缺

有这么一道题,先看题目,表的内容如下 显示GDP比非洲任何国家都要高的国家名称(一些国家的GDP值可能为NULL)。 错误的查询: SELECT name FROM bbcWHERE gdp > ALL (SELECT gdp FROM bbc WHERE region Africa)正确的查询: SE…

C++ 11 pair

class pair 可将两个 value视为一个单元。C标准库内多处用到了这个 class 。尤其是容器 map、multimap、unordered_map和 unordered_multimap就是使用 pair 来管理其以 key/value pair形式存在的元素。任何函数如果需要返回两个 value,也需要用到 pair,例…

Windows使用Stable Diffusion时遇到的各种问题和知识点整理(更新中...)

Stable Diffusion安装完成后,在使用过程中会出现卡死、文件不存在等问题,在本文中将把遇到的问题陆续记录下来,有兴趣的朋友可以参考。 如果要了解如何安装sd,则参考本文《Windows安装Stable Diffusion WebUI及问题解决记录》。如…

九龙证券|盘前直接腰斩,银行巨头紧急“拔网线”!美股银行股又崩了?

见证历史了,又有一家银行巨子倒下? 美股银行股团体暴降 上一交易日暴降超60%的硅谷银行持续面对腥风血雨。盘前,硅谷银行跌幅超50%,随后,公司宣布盘前暂停交易,等待刊发消息。 而最新消息显现&#xff0c…

Spring Cloud Gateway 超时、CORS配置 | Spring Cloud 17

一、Http超时配置 Spring Cloud Gateway 可以为所有路由配置 Http 超时(响应和连接),并为每个特定路由覆盖设置。 1.1 全局超时 配置全局 http 超时: connect-timeout必须以毫秒为单位指定。response-timeout必须指定为 java.…

[qiankun+nuxt]子应用请求本地文件报错404

前言 目前公司的前端架构是qiankunnuxt做的微前端项目 问题说明 在子应用中,前端需要模拟一些数据,方便后期演示调整而不需要重新打包 所以将一些数据存储到了本地的json文件中,但是获取时报了404的错误,找不到该文件。 页面报错…

Springboot是什么

目录 为什么会要用springboot 1、之前 2、现在 springboot优点 springboot四大核心 自动装配介绍 1、自动装配作用是什么 2、自动装配原理 springboot starter是什么 1、starter作用 2、比如:我们想搭建java web框架 3、starter原理 SpringBootApplica…

ROS小车研究笔记3/11/2023:多点导航及其源码实现

多点导航操作 打开导航launch文件 roslaunch turn_on_wheeltec_robot navigation.launch rviz 在rviz里,选择publish point在地图上点击标记目标点。在标记多个目标点后小车会按标记顺序依次在各个目标点中往返 多点导航对于话题MarkerArray。需要在rviz中使marke…

网页基本标签、图像标签、链接标签、块内元素和块元素、列表标签、表格标签

一、网页基本标签 标题标签 段落标签 未写段落标签前,文本没有按照想要的格式排列显示 写段落标签后: 每句都是一段,所以句与句距离比较宽 换行标签 同一段,只是把文字换行,所以比较紧凑 水平线标签 字体样式标签 …

【深度学习】神经网络和深度学习--卷积和池化的作用

深度学习通常指训练大型深度的神经网络的过程。 与传统的神经网络模型相比,深度学习模型在结构上与之非常相似;不同的是,深度学习模型的“深度”更大,“深度”的体现就是神经网络层数多,神经网络每一层的结点数多。 本…

# 关于Docker容器中时间时区问题的测试

关于Docker容器中时间时区问题的测试 文章目录关于Docker容器中时间时区问题的测试1 基础知识1.1 /etc/localtime1.2 /etc/timezone2 我在gitlab中遇到的问题与解决方法3 ubuntu官方镜像时区相关问题的测试3.0 官方原版测试3.1 不设置任何参数测试3.2 只设置TZ"Asia/Shang…

Spring Cloud Gateway 监控、多网关实例路由共享 | Spring Cloud 18

一、监控 Actuator是Spring Boot提供的用来对应用系统进行监控的功能模块,借助于Actuator开发者可以很方便地对应用系统某些监控指标进行查看、统计等。 Actuator的核心是端点Endpoint。 Endpoint可以让我们监视应用程序并与其交互。Spring Boot包含许多内置端点…

rapidcsv 写csv文件实例

csv实质是一个文本文件&#xff0c;可以使用rapidcsv写文件操作&#xff0c;如下实例&#xff1a; 第一行实质是从-1行开始&#xff0c;列是从0开始 #include "rapidcsv.h" #include <string> using namespace std; void CMFCApplication1Dlg::OnBnClickedBu…

【flask】URL和视图映射

目录 首页 传参 URL数据类型 get传参 首页 url与视图函数的映射是通过app.route()装饰器实现的。 只有一个斜杠代表的是根目录——首页。 传参 URL传参是通过<参数名称>的形式进行传递。URL中有几个参数&#xff0c;在视图函数中也要指定几个参数 from flask im…

WattOS:一个稳又快的轻量级 Linux 发行版

导读Linux 领域里的每个人不是听说过就是使用过某个轻量级的 Linux 发行版。大家都知道我们不断追求的是&#xff1a;占用内存少&#xff0c;配置资源要求低&#xff0c;包含一个轻量级的桌面环境&#xff08;或者窗口管理器&#xff09;&#xff0c;并且提供和其他发行版相似的…