ES6的模块化规范和CommonJS的模块化规范的差异
ES6 在语言标准的层面上,实现了模块功能,而且实现得相当简单,旨在成为浏览器和服务器通用的模块解决方案。其模块功能主要由两个命令构成:export 和 import。export命令用于规定模块的对外接口,import命令用于输入其他模块提供的功能。
/** 定义模块 math.js **/
var n = 1;
function add(){
return 2+3
}
export {
n,
add
}
/** 引用模块 main.js**/
import { n , add } from './math.js'
如上例所示,使用import命令的时候,用户需要知道所要加载的变量名或函数名。其实ES6还提供了export default命令,为模块指定默认输出,对应的import语句不需要使用大括号。这也更趋近于ADM的引用写法。
/** export default 定义输出 math.js**/
//输出
export default { basicNum, add };
/** 引用模块 main.js**/
//引入
import math from ‘./math‘;
alert(math.n);
math.add();
}
CommonJS
Node.js是commonJS规范的主要实践者,它有四个重要的环境变量为模块化的实现提供支持:module、exports、require、global。实际使用时,用module.exports定义当前模块对外输出的接口(不推荐直接用exports),用require加载模块。
//定义模块 math.js
var n = 0;
function add(a, b) {
return a + b;
}
module.exports = { //在这里写上需要向外暴露的函数、变量
add: add,
n: n
}
/** 引入模块 require **/
//引用自定义的模块时,参数包含路径,可省略.js
var math = require(‘./math‘);
math.add(2, 5);
//引用核心模块时,不需要带路径
var http = require(‘http‘);
http.createService(...).listen(3000);
import 时候的路径问题(新手容易碰到)
- 开始玩的时候,总是出现 cannot find module 问题,原来 在 import 的时候 如果不使用相对路径或者绝对路径,node默认会去node_modules/文件夹下去找,例如:
import * as obj from 'nav'
// node 会试着去寻找 node_modules/nav.js 文件,如果没有找到会接着找 nav 文件夹,如果文件夹存在,会找文件夹内的index.js文件,找不到就会报错
// 正确写法
import * as obj from './exports'
ES6的模块化规范和CommonJS的模块化规范的差异的更多相关文章
- javascript模块化编程:CommonJS和AMD规范
AMD规范,异步模块定义.与CommonJS规范齐名并列. 作用都是利于JavaScript的模块化编程. 模块化编程的好处就是: 1.可重用 2.独立 3.能解决加载的依赖性问题 4.能解决重复加载 ...
- 前端模块化小总结—commonJs,AMD,CMD, ES6 的Module
随着前端快速发展,需要使用javascript处理越来越多的事情,不在局限页面的交互,项目的需求越来越多,更多的逻辑需要在前端完成,这时需要一种新的模式 --模块化编程 模块化的理解:模块化是一种处理 ...
- ES6入门十二:Module(模块化)
webpack4打包配置babel7转码ES6 Module语法与API的使用 import() Module加载实现原理 Commonjs规范的模块与ES6模块的差异 ES6模块与Nodejs模块相 ...
- 前端模块化IIFE,commonjs,AMD,UMD,ES6 Module规范超详细讲解
目录 为什么前端需要模块化 什么是模块 是什么IIFE 举个栗子 模块化标准 Commonjs 特征 IIFE中的例子用commonjs实现 AMD和RequireJS 如何定义一个模块 如何在入口文 ...
- 一览js模块化:从CommonJS到ES6
本文由云+社区发表 模块化是指把一个复杂的系统分解到一个一个的模块. 模块化开发的优点: (1)代码复用,让我们更方便地进行代码管理.同时也便于后面代码的修改和维护. (2)一个单独的文件就是一个模块 ...
- Javascript模块化编程系列三: CommonJS & AMD 模块化规范描述
CommonJS Module 规范 CommonJS 的模块化规范描述在Modules/1.1.1 中 目前实现此规格的包有: Yabble,CouchDB,Narwhal (0.2), Wakan ...
- Javascript模块化编程之CommonJS,AMD,CMD,UMD模块加载规范详解
JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发? 模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问 题进行系 ...
- JS 模块化- 05 ES Module & 4 大规范总结
1 ES Module 规范 ES Module 是目前使用较多的模块化规范,在 Vue.React 中大量使用,大家应该非常熟悉.TypeScript 中的模块化与 ES 类似. 1.1 导出模块 ...
- js模块化入门与commonjs解析与应用
JS模块化的基本原理 commonjs规范 commonjs在前端模块化中的基本使用 AMD与CMD规范剖析博客链接 一.JS模块化基本原理 在JS没有提出来模块化的时候,开发JS项目比较简单,同时也 ...
随机推荐
- MyEclipse出现红色感叹号解决办法
今天在做数据库连接练习的时候自己创建的工程突然出现了一个红色的感叹号,然后运行自己写的代码的时候出现找不到主类的错误!!! 我还以为是自己不小心写错了,然后让编译器自动生成代码也出现了一样的问题... ...
- Java中从键盘输入的三种方法
import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; import ...
- C/C++语言的语法基础
数据类型指明变量或表达式的状态和行为,数据类型决定了数的取值范围和允许执行的运算符集.c++语言数据类型可以分为两大类:基本类型和引用类型.基本类型是指不能再分解的数据类型,其数据在函数的调用中是以传 ...
- vim操作备忘录
vim操作备忘录 vim 备忘录 vim的书籍虽然看不不少,可是老是容易忘记,主要是自己操作总结过少,这个博客就主要用来记录一些比较常见的术语和操作,以防止自己再次忘记. <leader> ...
- WC2016自测
挑战NPC 原题链接 爆搜20分,贪心10分,网络流30分 //挑战NPC #include <cstdio> #include <cstring> #include < ...
- Python基于Flask框架配置依赖包信息的项目迁移部署小技巧
一般在本机上完成基于Flask框架的代码编写后,如果有接口或者数据操作方面需求需要把代码部署到指定服务器上. 一般情况下,使用Flask框架开发者大多数都是选择Python虚拟环境来运行项目,不同的虚 ...
- homebrew 无法安装提示不能在根目录下使用
首先提示一点:能谷歌绝对不要百度解决问题. 1.昨天百度了一天,都都没有找到解决方案.因为昨天是20161130日,我的蓝灯FQ软件的流量使用光了.悲催- 2.今天是20161201日,我可以免费使用 ...
- 科普 TLS 1.3—新特性与开启方式
TLS 1.3 协议针对安全强化及效率提升等方面进行了大量修改,相继推出 20 多个草案版本,即将完成最终的标准化.标准完成后,OpenSSL 组织将推出 OpenSSL 1.1.1 版本,对 TLS ...
- elasticsearch-5.1.1使用snapshot接口备份索引
如果ES是集群,那么需要使用共享存储,支持的存储有:a.shared file systemb.S3c.HDFS 我使用的是第一种,NFS共享文件系统.这里要说一下权限问题,ES一般是使用 elast ...
- Phpstrom操作Git从服务器端克隆代码到本地
1.第一步点开Git 2.添加项目的路径 第一个框是你所在的项目路径,后缀名是.git,这里我用的是HTTPS的方式(还有一种是SSH) 第二是你要克隆到所在目录,我的是在Apache下面的htdoc ...