零、区别

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. H5学习之旅-H5的基本标签(2)

    H5的标签和html的标签没什么区别,主要介绍H5的基本标签 1.基础标签header和body,header的<title>元素主要是显示在标签页面里面,以及设置使用的语言和编码格式.b ...

  2. ReactJs和React Native的那些事

    介绍 1,React Js的目的 是为了使前端的V层更具组件化,能更好的复用,它能够使用简单的html标签创建更多的自定义组件标签,内部绑定事件,同时可以让你从操作dom中解脱出来,只需要操作数据就会 ...

  3. Web报表工具FineReport二次开发JS之字符串

    在报表开发过程中,有些需求可能无法通过现有的功能来实现,需要开发人员二次开发,以FineReport为例,可以使用网页脚本.API接口等进行深入的开发与控制. 考虑到JS脚本开发的使用较多,这里先先简 ...

  4. 学习tornado:模板

    第一次接触tornado的template,是在做oastub的时候,因为一位同学在handler里面硬编码了html代码,我决定引入template机制来降低逻辑与页面的耦合. 简介 tornado ...

  5. Java图形界面编程生成exe文件

    1. 先将代码打成jar,然后使用exe4j转成exe ext4j下载 链接:http://pan.baidu.com/s/1kTCIZtX 密码:pvj1 打开EXE4J Advanced Opti ...

  6. linux知识汇总

    1.     利用Ctrl+Alt+F1到Ctrl+Alt+F6在6个虚拟控制台之间切换,利用Ctrl+Alt+F7切换回图形界面. 2.     使用who命令来判断谁在系统上及其登录方式.id命令 ...

  7. Android系统修改硬件设备访问权限

    Android系统修改硬件设备访问权限 在硬件抽象层模块文件(so)文件中,提供的函数调用open函数来打开设备文件,比如/dev/gpio,如果不修改设备文件/dev/gpio的访问权限,那么应用程 ...

  8. 苹果IOS与谷歌 android系统的UI设计原则

    一.苹果为IOS的界面设计提出了六大原则: 1.整体美学 整体美学指的是一个应用的表现和行为与它的功能完美集成,传达连贯的信息. 人们关心一个应用是否提供它承诺的功能,但他们也被应用的外观和行为强烈影 ...

  9. Android ROM开发(三)——精简官方ROM并且内置ROOT权限,开启Romer之路

    Android ROM开发(三)--精简官方ROM并且内置ROOT权限,开启Romer之路 相信ROM的相关信息大家通过前几篇的学习都是有所了解了,这里就不在一一提示了,这里我们下载一个官方包,我们还 ...

  10. objc直接通过指针访问对象实例变量

    我们现在来做一件被认为是very bad的事情,如题所示:无论实例变量是私有的.保护的都可以通过地址访问到,并且还可以修改之.这可以称之为所谓的"超级键值编码". 首先上代码: # ...