ES6学习-module语法

Module语法

CommonJS模块

let { readfile }  = require('fs')
# 等同于
let _fs = require('fs')
let readfile = _fs.readfile //这种加载称为“运行时加载”

ES6模块

import { stat, exists, readFile } from 'fs';

这种加载称为“编译时加载”或者静态加载

静态加载带来的各种好处

  1. 效率要比 CommonJS 模块的加载方式高。
  2. 能进一步拓宽 JavaScript 的语法,比如引入宏(macro)和类型检验(type system)这些只能靠静态分析实现的功能。
  3. 不再需要UMD模块格式了,将来服务器和浏览器都会支持 ES6 模块格式。
  4. 将来浏览器的新 API 就能用模块格式提供,不再必须做成全局变量或者navigator对象的属性。
  5. 不再需要对象作为命名空间(比如Math对象),未来这些功能可以通过模块提供。

import()

import命令会被 JavaScript 引擎静态分析,先于模块内的其他语句执行

importexport命令只能在模块的顶层

这样的设计,固然有利于编译器提高效率,但也导致无法在运行时加载模块。在语法上,条件加载就不可能实现。

import()函数,支持动态加载模块。

运行时执行:也就是说,什么时候运行到这一句,就会加载指定的模块。

import()返回一个 Promise 对象。

import('xxx')
.then(module => {module.default})

适用场合

  1. 按需加载
  2. 条件加载
if(a) {import('xxx').then(({a,b,c}) =>{})}
  1. 动态的模块加载
import(f())

import()也可以用在 async 函数之中。

严格模式

ES6 的模块自动采用严格模式

export 命令

export命令规定的是对外的接口,必须与模块内部的变量建立一一对应关系。

// 报错
var m = 1;
export m;

因为没有提供对外的接口。直接输出 1。1只是一个值,不是接口。

export命令可以出现在模块的任何位置,只要处于模块顶层就可以。如果处于块级作用域内,就会报错

因为处于条件代码块之中,就没法做静态优化了

import 命令

import命令输入的变量都是只读的,因为它的本质是输入接口。也就是说,不允许在加载模块的脚本里面,改写接口。

import命令具有提升效果,会提升到整个模块的头部,首先执行。

foo();
import { foo } from 'my_module';

上面的代码不会报错,因为import的执行早于foo的调用。这种行为的本质是,import命令是编译阶段执行的,在代码运行之前。

由于import是静态执行,所以不能使用表达式和变量,这些只有在运行时才能得到结果的语法结构。

// 报错
import { 'f' + 'oo' } from 'my_module';
// 报错
let module = 'my_module';
import { foo } from module;

import语句会执行所加载的模块,因此可以有下面的写法。

import 'lodash';

多次重复执行同一句import语句,那么只会执行一次,而不会执行多次。

import 'lodash';
import 'lodash';
import { foo } from 'my_module';
import { bar } from 'my_module';
// 等同于
import { foo, bar } from 'my_module';

import在静态解析阶段执行,所以它是一个模块之中最早执行的。

require('core-js/modules/es6.symbol');
require('core-js/modules/es6.promise');
import React from 'React';

模块的整体加载

import * as circle from './circle';
console.log('圆面积:' + circle.area(4));
console.log('圆周长:' + circle.circumference(14));

export default 命令

export default命令其实只是输出一个叫做default的变量,所以它后面不能跟变量声明语句。

// 正确
var a = 1;
export default a;
// 错误
export default var a = 1;
// 正确
export default 42;
// 报错
export 42;

因为export default命令的本质是将后面的值,赋给default变量,所以可以直接将一个值写在export default之后。

如果想在一条import语句中,同时输入默认方法和其他接口,可以写成下面这样。

import _, { each, forEach } from 'lodash';

export 与 import 的复合写法

export { foo, bar } from 'my_module';

在一个模块之中,先输入后输出同一个模块

foobar实际上并没有被导入当前模块,只是相当于对外转发了这两个接口,导致当前模块不能直接使用foobar

Module 的加载实现

没看

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

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

相关文章

火车头采集器AI伪原创【php源码】

大家好,本文将围绕python作业提交什么文件展开说明,python123怎么提交作业是一个很多人都想弄明白的事情,想搞清楚python期末作业程序需要先了解以下几个事情。 火车头采集ai伪原创插件截图: I have a python project, whose fold…

FFmpeg常见命令行(二):FFmpeg转封装

前言 在Android音视频开发中,网上知识点过于零碎,自学起来难度非常大,不过音视频大牛Jhuster提出了《Android 音视频从入门到提高 - 任务列表》。本文是Android音视频任务列表的其中一个, 对应的要学习的内容是:如何使…

C# 2048小游戏核心算法

文章目录 01.程序结构划分02.去零03.合并04.上移05.下移/左移/右移&#xff0c;只是取数据的方向不同06.提高可读性 01.程序结构划分 02.去零 有序向量“唯一化”的思路。 /// <summary>/// 去零/// </summary>/// <param name"row">对于一行或一…

Java # Spring(1)

一、概念 1、核心技术&#xff1a;依赖注入&#xff08;DI&#xff09;&#xff0c;AOP&#xff0c;事件&#xff08;events&#xff09;&#xff0c;资源&#xff0c;i18n&#xff0c;验证&#xff0c;数据绑定&#xff0c;类型转换&#xff0c;SpEL。 2、测试&#xff1a;模…

Clash 意外退出后 chrome / google 谷歌 浏览器无法连接互联网

解决方案&#xff1a; 以管理员模式打开命令行&#xff0c;输入&#xff1a;netsh winsock reset &#xff0c;然后重启电脑 如果还不行的话&#xff0c; 在 chromevs中选中 设置>隐私和安全>安全>使用安全 dns> 使用您当前的服务提供商 即可

数据结构和算法——哈希查找冲突处理方法(开放地址法-线性探测、平方探测、双散列探测、再散列,分离链接法)

目录 开放地址法&#xff08;Open Addressing&#xff09; 线性探测&#xff08;Linear Probing&#xff09; 散列表查找性能分析 平方探测&#xff08;Quadratic Probing&#xff09; 定理 平方探测法的查找与插入 双散列探测法&#xff08;Double Hashing&#xff09…

分布式 - 消息队列Kafka:Kafka生产者发送消息的3种方式

文章目录 1. Kafka 生产者2. kafaka 命令行操作3. Kafka 生产者发送消息流程4. Kafka 生产者发送消息的3种方式1. 发送即忘记2. 同步发送3. 异步发送 5. Kafka 消息对象 ProducerRecord 1. Kafka 生产者 Kafka 生产者是指使用 Apache Kafka 消息系统的应用程序&#xff0c;它们…

Pytorch深度学习-----神经网络模型的保存与加载(VGG16模型)

系列文章目录 PyTorch深度学习——Anaconda和PyTorch安装 Pytorch深度学习-----数据模块Dataset类 Pytorch深度学习------TensorBoard的使用 Pytorch深度学习------Torchvision中Transforms的使用&#xff08;ToTensor&#xff0c;Normalize&#xff0c;Resize &#xff0c;Co…

Git介绍及常用命令详解

一、Git的概述 Git是一个分布式版本控制工具&#xff0c;通常用来对软件开发过程中的源代码文件进行管理。 Git 会跟踪我们对文件所做的更改&#xff0c;因此我们可以记录已完成的工作&#xff0c;并且可以在需要时恢复到特定或以前的版本。Git 还使多人协作变得更加容易&…

个人对前后端分离的一些看法

内容简介&#xff1a;前端开发过程中能完全不依赖后端的才是真正的前后端分离指的是工作过程中&#xff0c;前端的的代码中往往会掺杂一些后端的逻辑。后端返回了一个json对象 前端开发过程中能完全不依赖后端的才是真正的前后端分离 指的是工作过程中&#xff0c;前端的的代码…

涉及JS时实用的简洁方法

当涉及到JavaScript编程时&#xff0c;有许多简洁和实用的方法可以帮助你更有效地编写代码。以下是一些常用的简洁方法&#xff1a; 箭头函数&#xff1a; 箭头函数是一种简洁的语法形式&#xff0c;适用于单行函数表达式。它可以让你更紧凑地定义匿名函数。 // 传统函数 fun…

Linux系统中的自旋锁(两幅图清晰说明)

总结&#xff1a; 多CPU下的自旋锁采取的是忙等待&#xff08;原地打转&#xff09;机制&#xff0c;虽然忙等待的线程占用了它所在的cpu&#xff0c;但其他线程仍可放到其他CPU上执行。所以自旋锁上锁和解锁之间的临界区代码要尽量的短&#xff0c;最好不要超过5行&#xff0c…

jenkins流水线

1.拉取代码 https://gitee.com/Wjc_project/yygh-parent.git2、项目编译 mvn clean package -Dmaven.test.skiptrue ls hospital-manage/target3、构建镜像 ls hospital-manage/target docker build -t hospital-manage:latest -f hospital-manage/Dockerfile ./hospital-ma…

AWD攻防学习总结(草稿状态,待陆续补充)

AWD攻防学习总结 防守端1、修改密码2、备份网站3、备份数据库4、部署WAF5、部署文件监控脚本6、部署流量监控脚本/工具7、D盾扫描&#xff0c;删除预留webshell8、代码审计&#xff0c;seay/fortify扫描&#xff0c;漏洞修复及利用9、时刻关注流量和积分信息&#xff0c;掉分时…

业绩难言乐观,皓泽电子撤回上市申请,小米等为其关联方

撰稿|行星 来源|贝多财经 8月8日&#xff0c;深圳证券交易所披露的信息显示&#xff0c;由于河南皓泽电子股份有限公司&#xff08;下称“皓泽电子”&#xff09;及其保荐人主动要求撤回申请文件&#xff0c;深交所终止了皓泽电子的发行注册程序。 据此前招股书披露&#xff…

python爬虫实战(1)--爬取新闻数据

想要每天看到新闻数据又不想占用太多时间去整理&#xff0c;萌生自己抓取新闻网站的想法。 1. 准备工作 使用python语言可以快速实现&#xff0c;调用BeautifulSoup包里面的方法 安装BeautifulSoup pip install BeautifulSoup完成以后引入项目 2. 开发 定义请求头&#xf…

Fast Tone Mapping for High Dynamic Range Images

Abstract 我们提出了一种快速、有效、灵活的色调再现方法&#xff0c;在低动态范围再现设备中保留了高动态范围场景的可视性和对比度印象。 一个单一的参数控制能见度和对比度在一个简单和优雅的方式和互动速度。 新方法使用简单&#xff0c;计算效率高。 实验表明&#xff0c…

Spring Boot Actuator未授权访问漏洞

1.问题 Spring Boot Actuator 端点的未授权访问漏洞是一个安全性问题&#xff0c;可能会导致未经授权的用户访问敏感的应用程序信息。 可是并不用太过担心&#xff0c;Spring Boot Actuator 默认暴漏的信息有限&#xff0c;一般情况下并不会暴露敏感数据。 注册中心有些功能集…

Jenkins+Docker+SpringCloud微服务持续集成

JenkinsDockerSpringCloud微服务持续集成 JenkinsDockerSpringCloud持续集成流程说明SpringCloud微服务源码概述本地运行微服务本地部署微服务 Docker安装和Dockerfile制作微服务镜像Harbor镜像仓库安装及使用在Harbor创建用户和项目上传镜像到Harbor从Harbor下载镜像 微服务持…

RK3568蓝牙程序开发过程

1、搭建蓝牙开发环境 蓝牙开发可以使用C语言开发或python语言开发&#xff0c;使用的是蓝牙开发库为bluez库。 本文开发使用python语言开发&#xff0c;安装bluez库&#xff0c;可以使用pip install PyBluez来安装。 如果安装不上的话&#xff0c;可以使用sudo apt install pyt…