BT

如何利用碎片时间提升技术认知与能力? 点击获取答案

ECMAScript 6 模块简介

| 作者 Zef Hemel 关注 0 他的粉丝 ,译者 廖煜嵘 关注 0 他的粉丝 发布于 2013年8月15日. 估计阅读时间: 4 分钟 | Google、Facebook、Pinterest、阿里、腾讯 等顶尖技术团队的上百个可供参考的架构实例!

任何平台的其中一个重要特性,除了需要支持代码库外就是模块。直到现在,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文件的尴尬地包装成一个对象或函数闭报,这和以前大多数异步模块装载器在浏览器中的做法一样。相反,可以在最顶层进行定义,而只有函数和显式定义的导出变量将可以暴露给模块的消费者:

var privateVar = "this is a variable private to the module";
export var publicVar = "and this one is public";

export function returnPrivateVar() {
   return privateVar;
};

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

import { returnPrivateVar, publicVar } from 'mymodule';
console.log(returnPrivateVar());

或者是:

import 'mymodule' as 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)关注我们,并与我们的编辑和其他读者朋友交流。

评价本文

专业度
风格

您好,朋友!

您需要 注册一个InfoQ账号 或者 才能进行评论。在您完成注册后还需要进行一些设置。

获得来自InfoQ的更多体验。

告诉我们您的想法

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我
社区评论

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

讨论

登陆InfoQ,与你最关心的话题互动。


找回密码....

Follow

关注你最喜爱的话题和作者

快速浏览网站内你所感兴趣话题的精选内容。

Like

内容自由定制

选择想要阅读的主题和喜爱的作者定制自己的新闻源。

Notifications

获取更新

设置通知机制以获取内容更新对您而言是否重要

BT