es6 模块的语法概述
概述
历史上,JavaScript 一直没有模块(module)体系,无法将一个大程序拆分成互相依赖的小文件,再用简单的方法拼装起来。其他语言都有这项功能,比如 Ruby 的require
、Python 的import
,甚至就连 CSS 都有@import
,但是 JavaScript 任何这方面的支持都没有,这对开发大型的、复杂的项目形成了巨大障碍。
在 ES6 之前,社区制定了一些模块加载方案,最主要的有 CommonJS 和 AMD 两种。前者用于服务器,后者用于浏览器。ES6 在语言标准的层面上,实现了模块功能,而且实现得相当简单,完全可以取代 CommonJS 和 AMD 规范,成为浏览器和服务器通用的模块解决方案。
ES6 模块的设计思想,是尽量的静态化,使得编译时就能确定模块的依赖关系,以及输入和输出的变量。CommonJS 和 AMD 模块,都只能在运行时确定这些东西。比如,CommonJS 模块就是对象,输入时必须查找对象属性。
// CommonJS模块
let { stat, exists, readFile } = require('fs');
// 等同于
let _fs = require('fs');
let stat = _fs.stat;
let exists = _fs.exists;
let readfile = _fs.readfile;
上面代码的实质是整体加载fs
模块(即加载fs
的所有方法),生成一个对象(_fs
),然后再从这个对象上面读取 3 个方法。这种加载称为“运行时加载”,因为只有运行时才能得到这个对象,导致完全没办法在编译时做“静态优化”。
ES6 模块不是对象,而是通过export
命令显式指定输出的代码,再通过import
命令输入。
// ES6模块
import { stat, exists, readFile } from 'fs';
上面代码的实质是从fs
模块加载 3 个方法,其他方法不加载。这种加载称为“编译时加载”或者静态加载,即 ES6 可以在编译时就完成模块加载,效率要比 CommonJS 模块的加载方式高。当然,这也导致了没法引用 ES6 模块本身,因为它不是对象。
由于 ES6 模块是编译时加载,使得静态分析成为可能。有了它,就能进一步拓宽 JavaScript 的语法,比如引入宏(macro)和类型检验(type system)这些只能靠静态分析实现的功能。
除了静态加载带来的各种好处,ES6 模块还有以下好处。
- 不再需要
UMD
模块格式了,将来服务器和浏览器都会支持 ES6 模块格式。目前,通过各种工具库,其实已经做到了这一点。 - 将来浏览器的新 API 就能用模块格式提供,不再必须做成全局变量或者
navigator
对象的属性。 - 不再需要对象作为命名空间(比如
Math
对象),未来这些功能可以通过模块提供。
本章介绍 ES6 模块的语法,下一章介绍如何在浏览器和 Node 之中,加载 ES6 模块。
es6 模块的语法概述相关推荐
- es6 模块的语法严格模式
严格模式 ES6 的模块自动采用严格模式,不管你有没有在模块头部加上"use strict";. 严格模式主要有以下限制. 变量必须声明后再使用 函数的参数不能有同名属性,否则报错 ...
- ES6 模块加载export 、import、export default 、import() 语法与区别,笔记总结
ES6模块加载export .import.export default .import() 语法与区别 在 ES6 之前,社区制定了一些模块加载方案,最主要的有 CommonJS 和 AMD 两种. ...
- ES6模块体系及DDN区块链设计开发规范
ES6模块体系及DDN开发规范 概述 得益于 ES6 和 TS的模块体系,DDN区块链可以快速拆解和迭代.没有这些模块化的基础,我们后面所有的工作都会受阻,可插拔.可视化.可配置等功能就成了一句空话, ...
- es6 混合commjs_详谈commonjs模块与es6模块的区别
到目前为止,已经实习了3个月的时间了.最近在面试,在面试题里面有题目涉及到模块循环加载的知识.趁着这个机会,将commonjs模块与es6模块之间一些重要的的区别做个总结.语法上有什么区别就不具体说了 ...
- ES6模块的import和export用法总结
ES6之前已经出现了js模块加载的方案,最主要的是CommonJS和AMD规范.commonjs主要应用于服务器,实现同步加载,如nodejs.AMD规范应用于浏览器,如requirejs,为异步加载 ...
- 模块打包之CommonJS与ES6模块比较初探
Time: 20190920 模块是具有特定功能的组成单元,不同模块负责不同的工作,然后会以某种方式联系到一起,形成完整的程序逻辑. CommonJS CommonJS是2009年社区提出的,包含模块 ...
- 商城项目介绍以及ES6的新语法
0.学习目标 了解电商行业 了解乐优商城项目结构 能独立搭建项目基本框架 能参考使用ES6的新语法 1.了解电商行业 学习电商项目,自然要先了解这个行业,所以我们首先来聊聊电商行业 1.1.项目分类 ...
- Servlet和MySQL基本语法概述
Servlet概述 什么是Servlet? Servlet是由SUN公司提供的一门动态Web资源开发技术 静态Web资源:不同的人,在不同的条件下访问后看到的是相同的效果,这样的资源叫做静态Web资源 ...
- ES6模块加载方案 CommonJS和AMD ES6和CommonJS
目录 CommonJS CommonJS和AMD的对比 ES6和CommonJS 改成ES6 exports和module.exports CommonJS 每个文件就是一个模块,有自己的作用域.在一 ...
最新文章
- C指针原理(28)-垃圾回收-内存泄露
- linux快捷命令怎么拼日期,liunx常用命令,快捷键
- python数据科学-多变量数据分析
- boost context上下文切换
- 计算机一级wps视频教程,计算机一级WPS
- vsftp服务器mysql认证_基于mysql控制vsftp的用户认证机制
- 《痞子衡嵌入式半月刊》 第 2 期
- 增长量计算n+1原则_我是如何快速做资料分析的?(二)
- 使用老毛子在腾讯云DNSpod上实现DDNS
- 微信小游戏上线发布全流程详解
- 跟我学c++中级篇——decay
- 想天浏览器:推荐国内主流浏览器TOP10
- 如何学习一种开发框架
- Java 集合之SortedSet和SortedMap
- unity射线检测高速飞行的子弹是否打到敌人
- 【基本算法】 位运算:二进制状态压缩
- 【Elasticsearch源码】 写入分析
- Enterprise Architect使用
- 美团技术:降低软件复杂性的原则和方法!
- python unittest框架_python unittest框架理解与总结
热门文章
- APP One Link ,android and ios qrcode merge as One QRCode and one short link
- python 中locals() 和 globals()
- 领导再也不会因为模型刷新不出来批评我啦---论IE扩内存(转载)
- 教你怎样做好计划 将愿望慢慢实现
- dell台式机进入安全模式_打造未来高效办公体验 华为首款商用台式机正式发布...
- 浅谈iOS中的蓝牙技术(一) GameKit framework
- React Native商城项目实战04 - 封装TabNavigator.Item的创建
- SQL SERVER 内存分配及常见内存问题(1)——简介
- 笔记2014-08-26
- 最简单的基于FFmpeg的AVfilter例子(水印叠加)