module

每个文件就是一个模块。文件内定义的变量、函数等等都是在自己的作用域内,都是自身所私有的,对其它文件不可见。

每个文件内部都有一个module对象,它包含以下属性

  • id: 模块的识别符,通常是带有绝对路径的模块文件名
  • filename:模块的文件名,带有绝对路径
  • loaded:返回一个布尔值,表示模块是否已经完成加载
  • parent:返回一个对象,表示调用该模块的模块
  • children:返回一个数组,表示该模块要用到的其他模块
  • exports:表示模块对外输出的值

module.exports

module中有一个属性exports,即:module.exports。它是该模块对外的输出值,是一个对象。其它模块在加载该模块时,实际上加载到的数据都是由它提供的。

module.exports输出的可以是一个对象,也可以是一个函数。在引用该模块的文件内,如果接受到的是对象,可以直接访问其中的属性,如果接受到的是一个函数,也可以直接执行。

exports

exports是一个特殊的存在,它是对module.exports的指向,可以通过向exports对象中添加变量、方法等,但是不能直接将exports指向一个值,这样会切断exportsmodule.exports之间的联系。

exportmodule.exports的使用有一点需要注意,如果导出的是一个函数,只能使用module.exports

export

export用于规定模块的对外接口,可以输出变量、函数或类。export规定的对外接口必须与模块内部的变量建立一一对应关系。

  • 错误写法
	// 方式一
export 1; // 报错 // 方式二
var a = 1;
export a; // 报错 // 方式三
function fn() {}
export fn; // 报错
  • 正确写法
	// 方式一
export var a = 1; // 方式二
var a = 1;
export {a}; // 方式三
var a = 1;
export {a as a1}; // 对a重命名输出 // 方式四
export function fn() {}; // 方式五
function fn() {}
export {fn};

export default

export defaultexport的区别:

  • 使用export时,输出的内容和接收时用的变量名称必须一致,否则无法加载;使用export default,则为模块指定默认输出,同时,可以为接收到的变量指定其它名称
  • 使用export输出的变量或者函数,在import时,需要使用大括号;使用export default则不用

import

importexport配对使用,用于加载接收export输入的内容

require

require用于加载模块文件,默认加载的文件后缀名为.js

  • 如果加载的文件路径以/开头,则表示加载的是一个绝对路径
  • 如果加载的文件路径以./../开头,则表示加载的是一个相对当前位置的路径
  • 如果加载的文件路径不以以上内容开头,则加载的是一个核心模块,默认会到node_modules下寻找

小结

modulemodule.exportsexports采用的是CommonJS模块规范。exportexport default采用的是ES6模块规范。

  • module.exports输出的是值的拷贝;export是值的引用
  • module.exports在运行时加载;export是在编译时输出
    // addA.js
var a = 1;
function addA() {
a++;
}
module.exports = {
a: a,
addA: addA
}; // use addA
var addA = require('./addA.js');
console.log(addA.a); // 1
addA.addA();
console.log(addA.a); // 1 /************ 改善后 *********************/
// addA.js
var a = 1;
function addA() {
a++;
}
module.exports = {
get a() {
return a;
},
addA: addA
};
    // addA.js
export.a = 1;
export.addA = function() {
a++;
} // use addA
import {a, addA} from './addA';
console.log(a);// 1
addA();
console.log(a);// 2

参考

module、export、require、import的使用的更多相关文章

  1. ES6 模块化(Module)export和import详解 export default

    ES6 模块化(Module)export和import详解 - CSDN博客 https://blog.csdn.net/pcaxb/article/details/53670097 微信小程序笔记 ...

  2. ES6 Module export与import复合使用

    export与import复合使用 基本语法 export {...} from '文件'; 等价于 import {...} from "文件": export {...} 先加 ...

  3. module.exports,exports,export和export default,import与require区别与联系【原创】

    还在为module.exports.exports.export和export default,import和require区别与联系发愁吗,这一篇基本就够了! 一.首先搞清楚一个基本问题: modu ...

  4. module.exports,exports,export和export default,import与require区别与联系

    还在为module.exports.exports.export和export default,import和require区别与联系发愁吗,这一篇基本就够了! 一.首先搞清楚一个基本问题: modu ...

  5. export,export default,module.exports,import,require之间的区别和关联

    module.exports Node 应用由模块组成,采用 CommonJS 模块规范.根据这个规范,每个文件就是一个模块,有自己的作用域.在这些文件里面定义的变量.函数.类,都是私有的,对外不可见 ...

  6. ES6学习笔记<五> Module的操作——import、export、as

    import export 这两个家伙对应的就是es6自己的 module功能. 我们之前写的Javascript一直都没有模块化的体系,无法将一个庞大的js工程拆分成一个个功能相对独立但相互依赖的小 ...

  7. ES6学习笔记(十九)Module 的语法-export和import

    1.概述 历史上,JavaScript 一直没有模块(module)体系,无法将一个大程序拆分成互相依赖的小文件,再用简单的方法拼装起来.其他语言都有这项功能,比如 Ruby 的require.Pyt ...

  8. 探索 模块打包 exports和require 与 export和import 的用法和区别

    菜单快捷导航: CommonJS 之 exports和require用法 ES6 Module 之 export 和 import 用法 CommonJS和ES6 Module的区别 循环依赖 和 解 ...

  9. export和import实现模块化

    export和import实现模块化 阅读目录 ES6的模块化的基本规则或特点: 下面列出几种import和export的基本语法: ES6导入的模块都是属于引用: 循环依赖的问题: 浏览器兼容: 参 ...

  10. export、export default、module.export区别

    在es6里面定义模块,导出模块时可以使用export.export default 这2者区别: 在同一个文件里面可以有多个export, 一个文件里面只能有1个export default //a. ...

随机推荐

  1. js中变量base64加密传输

    首先对base64进行定义: var Base64 = { _keyStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz01 ...

  2. Hibernate哪点事?

    1.为什么在Hibernate的实体类中要提供一个无参数的构造器这一点非常重要?每个Hibernate实体类必须包含一个 无参数的构造器, 这是因为Hibernate框架要使用Reflection A ...

  3. Python学习笔记004_字典_集合

    >>> # 字典 用大括号表示, 它是影射类型,相当于java中的Map >>> >>> dict1 = {'李宁': '一切皆有可能', '耐克 ...

  4. Django中的信号及其用法

    Django中提供了"信号调度",用于在框架执行操作时解耦. 一些动作发生的时候,系统会根据信号定义的函数执行相应的操作 Django中内置的signal Model_signal ...

  5. 轻松把你的项目升级到PWA

    什么是PWA PWA(Progressive Web Apps,渐进式网页应用)是Google在2015年推出的项目,致力于通过web app获得类似native app体验的网站. 优点 1.无需客 ...

  6. JVM菜鸟进阶高手之路十(基础知识开场白)

    转载请注明原创出处,谢谢! 最近没有什么实战,准备把JVM知识梳理一遍,先以开发人员的交流来谈谈jvm这块的知识以及重要性,依稀记得2.3年前用solr的时候老是经常oom,提到oom大家应该都不陌生 ...

  7. angular directive自定义指令

    先来看一下自定义指令的写法 app.directive('', ['', function(){ // Runs during compile return { // name: '', // pri ...

  8. Excel的实用函数

    在介绍Excel函数前先说明两个概念:公式和函数. 公式:由用户自行设计对工作表进行计算和处理的计算式,以等号"="开始,其内部可以包括函数.引用.运算符和常量. 函数:即是预先定 ...

  9. TOP命令详解(负载情况)

    简介 top命令是Linux下常用的性能分析工具,能够实时显示系统中各个进程的资源占用状况,类似于Windows的任务管理器. top显示系统当前的进程和其他状况,是一个动态显示过程,即可以通过用户按 ...

  10. Sum It Up 广搜

    Sum It Up Time Limit:1000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u Submit St ...