commonJs和es6的区别

本文详细介绍了CommonJS和ES6模块在导入导出方式、加载机制、值的拷贝与引用等方面的差异。CommonJS适用于Node.js环境,通过`require`进行同步加载,而ES6模块则采用静态导入`import`,支持按需加载。此外,CommonJS导出的是值的拷贝,ES6模块导出的是值的引用。了解这些差异对于理解和优化JavaScript项目的模块化至关重要。
摘要由CSDN通过智能技术生成

commonJs 示例

// 导入
const valid = require('./utils/index')
console.log(valid.isEmail('8738365456@199.com'))

// 导出sayHi方法,exports变量指向module.exports
exports.sayHi = function (user) {
	console.log('hi,'+ user)
}

exports.exports = {} // 表示当前模块对外输出的接口,其他文件加载该模块,就是读取module.exports。

es6 示例

// 导入
import {isEmail, isMobile} from './utils/index'

// 导出
export function sayHi = (user) => {
    console.log('hi,'+ user)
}

export default = {} // 默认导出,一个js模块里面只能有一个
  • CommonJS 模块输出的是一个值的拷贝, 引入后使用不会受到原文件的影响,ES6 模块输出的是值的引用。
  • CommonJS 模块是运行时加载,ES6 模块是编译时输出接口。
  • CommonJs 是单个值导出,ES6 Module可以导出多个(解构)。
  • CommonJs 是动态语法(require)可以写在判断里,ES6 Module 静态语法(import)只能写在顶层。
  • CommonJs是同步加载的,一般在服务端使用,如果在浏览器使用需要使用browserify等编译工具;es6的import可以按需加载。

好文参考:

  1. https://blog.csdn.net/weixin_33275327/article/details/89176902
  2. https://segmentfault.com/a/1190000023349541
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值