零、区别

1、require/exports 是 CommonJS 的标准,适用范围如 Node.js

2、import/export 是 ES6 的标准,适用范围如 React

一、间接获取对象

(1)require/exports

module.js

exports.name = "colin";
exports.sayHello = function() {
console.log("hello");
};
方法一 间接

getModule.js

var myModule = require('./module');
console.log(myModule.name);
myModule.sayHello();
方法二 直接

getModule.js

var { name, sayHello } = require('./module');
console.log(name);
sayHello();
方法三 别名

getModule.js

var { name: name_2, sayHello: sayHello_2 } = require('./module');
console.log(name_2);
sayHello_2();

(2)import/export

module.js

export const name = 'colin';
export function sayHello(){
console.log("hello");
}
方法一 间接 (不可用)

getModule.js

import myModule from './module'
console.log(myModule.name);
myModule.sayHello();

报错如下:

"export 'default' (imported as 'myModule') was not found in '@cp/utils/format'

方法二 直接

getModule.js

import { name, sayHello } from './module'
console.log(name);
sayHello();
方法三 别名

getModule.js

import { name as name_2, sayHello as sayHello_2 } from './module'
console.log(name_2);
sayHello_2();

二、直接获取对象

(1)require/exports

module.js

var name = "colin";
module.exports = name;

getModule.js

var name = require('./module');
console.log(name);

(2)import/export

module.js

export default name = 'colin';

getModule.js

import name from './module'
console.log(name);

三、拓展

上面介绍的都是加载 js 文件,但是也可以加载 json 文件。

下面以 require/exports 为例 (不需要加上 exports 即可直接导出)

module.json

{
"name": "a",
"age": 18
}

getModule.js

const name = require('./module');
const {name, age} = require('./module');

require/exports 和 import/export 区别的更多相关文章

  1. require/exports 与 import/export 的区别?

    文章作者:寸志链接:https://www.zhihu.com/question/56820346/answer/150724784来源:知乎 遵循的模块化规范不一样 模块化规范:即为 JavaScr ...

  2. 简单介绍export default,module.exports与import,require的区别联系

    他们都是成对使用的,不能乱用: module.exports 和 exports是属于CommonJS模块规范,对应---> require属于CommonJS模块规范 export 和 exp ...

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

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

  4. 探讨ES6的import export default 和CommonJS的require module.exports

    今天来扒一扒在node和ES6中的module,主要是为了区分node和ES6中的不同意义,避免概念上的混淆,同时也分享一下,自己在这个坑里获得的心得. 在ES6之前 模块的概念是在ES6发布之前就出 ...

  5. js中的require、define、export、import【转】

    原文链接:https://www.cnblogs.com/libin-1/p/7127481.html 为什么有模块概念 理想情况下,开发者只需要实现核心的业务逻辑,其他都可以加载别人已经写好的模块. ...

  6. Javascript在使用import 与export 区别及使用

    一.import与export的用法 1.import的几种用法 import defautName from 'modules.js'; import { export } from 'module ...

  7. export,export default和import的区别以及用法

    首先要知道export,import ,export default是什么 ES6模块主要有两个功能:export和import export用于对外输出本模块(一个文件可以理解为一个模块)变量的接口 ...

  8. ES6常用语法简介import export

    ES6常用语法简介import export let与var用法区别 //var var a = []; for (var i = 0; i < 10; i++) { a[i] = functi ...

  9. 关于node中 require 和 ES6中export 、export default的总结

    nodejs中 require 方法的加载规则 方法的加载规则 1. 优先从缓存中加载 2. 核心模块 3. 路径形式的模块 4. 第三方模块 一.优先从缓存中加载 main.js:执行加载a.js模 ...

随机推荐

  1. MySQL最佳实践

    一.核心军规         - 不在数据库做运算:cpu计算务必移至业务层         - 控制单表数据量:单表记录控制在1000w         - 控制列数量:字段数控制在20以内     ...

  2. 分布式系统中的RPC请求经常出现乱序的情况 写一个算法来将一个乱序的序列保序输出

    分布式系统中的RPC请求经常出现乱序的情况.  写一个算法来将一个乱序的序列保序输出.例如,假设起始序号是1,对于(1, 2, 5, 8, 10, 4, 3, 6, 9, 7)这个序列,输出是:  1 ...

  3. 怎样写一个与Windows10 IE11兼容的标准BHO?

    p.MsoNormal,li.MsoNormal,div.MsoNormal { margin: 0cm; margin-bottom: .0001pt; text-align: justify; f ...

  4. Dynamics CRM EntityCollection 根据实体中的某个字段为依据去除重复数据

    CRM中通过QueryExpression查询出了一个EntityCollection集,但有时会存在重复数据,QueryExpression中有个属性distinct,只要设置为true就能过滤 ...

  5. JAVA集合类——难得的总结

    本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/41346969 以下资料是在学习中总结出来的,希望对你有所帮 ...

  6. ios入门OC_UI晋级学什么?

    1. OC 语法初步, 你可能学到面向对象最近本的概念, 并且可以大致的建立几个自以为是的类,但这仅仅是开始. 你知道为什么面向对象要有3大特性么.知道他们是用到什么设计模式的么 2. 你可能学到了N ...

  7. 水晶报表中"已达到系统管理员配置的最大报表处理作业数限制"错误的处理

    错误描述:用水晶报表做报表时当多次打开报表后会经常会出现"已达到系统管理员配置的最大报表处理作业数限制. "的错误. 1.自身的问题:用完CrystalDecisions.Crys ...

  8. CSS中编写省略号代码片段

     #component-content #dtMain .dt-ul > li .component-item .component-name{ display:inline-block; ...

  9. 你可能不知道的5种 CSS 和 JS 的交互方式

    翻译人员: 铁锚 翻译日期: 2014年01月22日 原文日期: 2014年01月20日 原文链接:  5 Ways that CSS and JavaScript Interact That You ...

  10. 聊聊javaMail

    今天闲着无事 看了看用java发送邮件的相关知识 代码参考自<<精通Java Web整合开发(JSP+AJAX+Struts+Hibernate)>>(第2版) 不多说 先上图 ...