写点什么

ECMAScript 6 模块简介

  • 2013 年 8 月 14 日
  • 本文字数:1225 字

    阅读完需:约 4 分钟

任何平台的其中一个重要特性, 除了需要支持代码库外就是模块。直到现在,Javascript 还不支持原生的模块化。结果是,各种解决方案都将模块添加到类库中,比如 CommonJS modules (部分由 node.js 实现)和 require.js 。然而,作为下一代的 Javascript(官方称为 ECMAScript 6),模块终于被作为重要组成部分加入其中。Axel Rauschmayer 写了一篇介绍 ECMAScript 6 模块的文章,解析了它们是什么以及如何使用,并且如果目前想使用的话采用的方法(使用转换编译器)。
Axel 指出了 ES6 模块的设计目标如下:
ECMAScript 6 (ES6) 模块的目标是创建的格式能让 CJS( CommonJS 规范)和 AMD( Asynchronous Module Definition,异步模块定义)的用户都能满意。为此,它们的语法是 CJS 那样紧凑。在另一方面,它们的动态能力比不上 CJS(例如,你不能用正常的语法去有条件加载模块)。这有两个主要的优点:

  • 如果尝试导入未导出的将会得到编译时的错误
  • 可以很容易异步导入 ES6 的模块。

ES6 的模块标准由两部分组成:

  1. 声明式语法(导入和导出用)。
  2. 编程式 API 加载器:设置模块如何加载以及如何有条件地加载模块。

ES6 模块不再需要开发人员去将整个 JavaScript 文件的尴尬地包装成一个对象或函数闭报,这和以前大多数异步模块装载器在浏览器中的做法一样。相反,可以在最顶层进行定义,而只有函数和显式定义的导出变量将可以暴露给模块的消费者:

复制代码
<strong>var</strong> privateVar = "this is a variable private to the module";
<strong>export var</strong> publicVar = "and this one is public";
<strong>export function</strong> returnPrivateVar() {
<strong>return</strong> privateVar;
};

假设将上面的代码保存在 mymodule.js 中,我们现在可以用两种方法导入,或者是通过导入指定函数和变量,或者通过导入模块作为模块的对象:

复制代码
<strong>import</strong> { returnPrivateVar, publicVar } <strong>from</strong> 'mymodule';
console.log(returnPrivateVar());

或者是:

复制代码
<strong>import</strong> 'mymodule' <strong>as</strong> mm;
console.log(mm.returnPrivateVar());

新的模块标准也支持对模块的内嵌定义和动态模块加载。可以阅读 Axel 的文章也了解更多相关信息。

如果想在目前尝试新的模块语法,可以有一些方法可供选择:

  • es6-module-transpiler 将 ES6 模块编译为 AMD 规范或者 CommonJS 规范的模块
  • ES6 module loader 则能支持动态加载 ES6 风格的模块
  • require-hm 是一个 require.js 的插件能支持加载 ES6 模块
  • Traceur 是 Google 的转换编译器,目的在于支持许多 Javascript 的特性包括 ES6 模块
  • TypeScript 是微软的可选择的 Javascript 的一个版本,也支持 ES6 模块

查看英文原文: ECMAScript 6 Modules: What Are They and How to Use Them Today


感谢马国耀对本文的审校。

给InfoQ 中文站投稿或者参与内容翻译工作,请邮件至 editors@cn.infoq.com 。也欢迎大家通过新浪微博( @InfoQ )或者腾讯微博( @InfoQ )关注我们,并与我们的编辑和其他读者朋友交流。

2013 年 8 月 14 日 02:528969
用户头像

发布了 81 篇内容, 共 18.0 次阅读, 收获喜欢 2 次。

关注

评论

发布
暂无评论
发现更多内容

【LeetCode】三数之和Java题解

HQ数字卡

算法 LeetCode 7月日更

让AI抛弃“小作坊”,拥抱“工业化”:盘古大模型究竟是什么?

脑极体

自建开发工具系列-Webkit内存动量监控UI(四)

Tim

UI JSX

从0到1:用脚做一个路由器漏洞实例

网络安全学海

运维 网络安全 信息安全 渗透测试· SQL注入

用太极拳讲分布式理论,真舒服!

悟空聊架构

分布式 事务 CAS Base 7月日更

打通“任督二脉”:Android 应用安装优化实战

vivo互联网技术

android 打包APK so文件

蚂蚁矿池系统软件开发方案

推荐系统的人工调控策略(三十五)

数据与智能

人工智能 商业价值 推荐系统

一篇并不起眼的Kafka面试题

王知无

【Flutter 专题】88 初识状态管理 Bloc (三)

阿策小和尚

Flutter 小菜 0 基础学习 Flutter Android 小菜鸟 7月日更

松华说|如何快速熟悉和上手业务

松花皮蛋me

架构之:serverless架构

程序那些事

系统架构 软件架构 架构设计

在线ASCII流程图编辑器工具

入门小站

工具

ARTS 日常打卡 - 7

pjw

linux服务器开发人员必须要彻底理解的关于【Linux】IO的线程模型

Linux服务器开发

reactor 网络编程 epoll Linux服务器开发 IO模型

Reactive Spring实战 -- 响应式MySql交互

binecy

MySQL 响应式编程 Reactive Spring

🏆【SpringBoot技术专题】「Cache缓存组件」Redis缓存使用技巧及注解大全

浩宇天尚

redis cache Sprint Boot 7月日更

架构训练营模块一作业

Honey拯救世界

架构实战营

登录验证那些事儿

江湖一点雨

Token Cookie JWT session处理方案 单点登录

Ansible Role

耳东@Erdong

ansible 7月日更 ansible role

Flink生产环境TOP难题与优化,阿里巴巴藏经阁YYDS

王知无

Xshell 如何导入 PuTTYgen 生成的 key

HoneyMoose

Rust从0到1-智能指针-RefCell<T>

rust 智能指针 smart pointer RefCell<T>

代理

卢卡多多

代理 代理原理 7月日更

Linux之文件属性详解

入门小站

Linux

如何优雅的实现一个Client

Apologize

Java 设计模式 代码设计 client

支点交易所APP系统开发介绍

给AI时代装配“新大脑”:数据密集型超算带来了哪些变革?

脑极体

共1575道,内卷把我逼成“收集王”汇总十家大厂面试题后,产出Java“完美圣经”

Java架构师迁哥

两天搞定一个BUG

IT蜗壳-Tango

7月日更

我被InfoQ写作平台签约啦

xcbeyond

程序人生 签约计划

ECMAScript 6 模块简介-InfoQ