零、区别

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. GDAL书籍

    GDAL的书籍经过快两年的编写修改,终于出版发行了,有需要的同学可以到下面的网址进行购买. 购买地址: 亚马逊:http://www.amazon.cn/GDAL%E6%BA%90%E7%A0%81% ...

  2. shell 中的特殊变量

    shell 中的特殊变量 变量名   含义 $#     参数的个数 $$     代表所在命令的PID $0     shell或shell脚本的名字 $*     以一对双引号给出参数列表 $@  ...

  3. ARM v7汇编与相关练习

    程序入口: _startc 语言入口: main@:              注释;main:           标签;伪指令:         给汇编器读的指令;.global main    ...

  4. WebStorm开发工具设置React Native智能提示

    最近在做React Native开发的时候,相信大家一般会使用WebStorm,Sublime,Atom等等开发工具.二之前搞前端的对WebStorm会很熟悉,WebStorm最新版是WebStorm ...

  5. 移植Cocos2D到Android平台的原理

    幸运的,SpriteBuilder使得适配(安卓)多种多样的屏幕尺寸变得容易起来,因为Android Xcode插件允许你使用任何Cocos2D的特性并且可以继续使用很多iOS的框架(framewor ...

  6. 打造你的开发神器——介绍Android Studio上的几个插件

    这个月因为各种事情在忙,包括赶项目,回老家,还有准备旅游的事,所以应该写不了四篇博客了.今天介绍一下关于Android Studio 的几个好用的插件,都是我在用的,它们或能帮你节省时间,或者让你心情 ...

  7. Web应用程序设计十个建议

    原文链接:  Top 10 Design Tips for Web Apps 原文日期: 2014年04月02日 翻译日期: 2014年04月11日 翻译人员: 铁锚 现代web应用通常在互联网上通过 ...

  8. Android进阶(十九)AndroidAPP开发问题汇总(三)

    Android进阶(十九)AndroidAPP开发问题汇总(三) Java解析XML的几种方式: http://inotgaoshou.iteye.com/blog/1012188 从线程返回数据的两 ...

  9. openresty+websocket+redis simple chat

    openresty 很早就支持websocket了,但是早期的版本cosocket是单工的,处理起来比较麻烦参见邮件列表讨论 websocket chat,后来的版本cosocket是双全工的,就可以 ...

  10. win32多线程学习笔记

    <多核程序设计技术> 第五章--线程api,一个使用windows事件的线程应用程序,vs2008下编译调试通过. // 线程通信机制.cpp : 定义控制台应用程序的入口点. // #i ...