require和import区别

146 篇文章 5 订阅
26 篇文章 2 订阅

相同点

 require 和 import,都是为了JS模块化使用。

require

 require是Commonjs的规范,node应用是由模块组成的,遵从commonjs的规范。

用法

// a.js

function test (args) {
  // body...
  console.log(args);	
}
 
module.exports = {
  test
}
// b.js

let { test } = require('./a.js');
 
test('this is a test.');

import

mport是es6为js模块化提出的新的语法,import (导入)要与export(导出)结合使用。

// a.js


export function test (args) {
  // body...
  console.log(args);	
}
 
// 默认导出模块,一个文件中只能定义一个
export default function() {...};
 
export const name = "lyn";
// b.js


// _代表引入的export default的内容
import _, { test, name } from './a.js';
test(`my name is ${name}`);

commonjs模块与ES6模块的区别

区别1:模块加载的时间

require:运行时加载
import:编译时加载(效率更高)【由于是编译时加载,所以import命令会提升到整个模块的头部】

test();// 代码不会报错,正常执行 因为import编译时运行会提升
import { test} from '/test'; 

区别2:模块的本质

require:模块就是对象,输入时必须查找对象属性
import:ES6 模块不是对象,而是通过 export 命令显式指定输出的代码,再通过 import 命令输入(这也导致了没法引用 ES6 模块本身,因为它不是对象)。由于 ES6 模块是编译时加载,使得静态分析成为可能。有了它,就能进一步拓宽 JavaScript 的语法,比如引入宏(macro)和类型检验(type system)这些只能靠静态分析实现的功能。

// CommonJS模块
let { exists, readFile } = require('fs');
// 等同于
let fs = require('fs');
let exists = fs.exists;
let readfile = fs.readfile;

上面CommonJs模块中,实质上整体加载了fs对象(fs模块),然后再从fs对象上读取方法

// ES6模块
import { exists, readFile } from 'fs';

上面ES6模块,实质上从fs模块加载2个对应的方法,其他方法不加载

区别2:严格模式

(1)CommonJs(require)模块默认采用非严格模式
(2)ES6 (import)的模块自动采用严格模式,不管你有没有在模块头部加上 “use strict”;
 

区别3:值

CommonJS(require) 模块输出的是一个值的拷贝,ES6 (import)模块输出的是值的引用,举例如下

// m1.js
export var foo = 'bar';
setTimeout(() => foo = 'baz', 500);
// m2.js
import {foo} from './m1.js';
console.log(foo); //bar
setTimeout(() => console.log(foo), 500); //baz

至此,安排的明明白白。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值