CJS和 ES6 的语法区别

  • CommonJS 使用 module.exports 导出模块。
  • ES6 使用 export 导出模块。

示例代码:

CommonJS(CJS)模块的导出:

// 导出模块
module.exports = {
  foo: 'bar',
  baz: function() {
    return 'qux';
  }
};

ES6 模块的导出:

// 导出模块
export const foo = 'bar';

export function baz() {
  return 'qux';
}
  • CommonJS 使用 require() 导入模块。
  • ES6 使用 import 导入模块。

示例代码:

CommonJS(CJS)模块的导入:

// 导入模块
const myModule = require('./myModule');

// 使用导入的模块
console.log(myModule.foo);
console.log(myModule.baz());

ES6 模块的导入:

// 导入模块
import { foo, baz } from './myModule';

// 使用导入的模块
console.log(foo);
console.log(baz());

默认导出方式:

  • CommonJS 可以通过 module.exports 导出一个值作为默认导出。
  • ES6 使用 export default 导出一个默认值。

示例代码:

CommonJS(CJS)模块的默认导出和导入:

// 导出默认值
module.exports = 'Hello, world!';

// 导入默认值
const myModule = require('./myModule');
console.log(myModule); // 输出:Hello, world!

ES6 模块的默认导出和导入:

// 导出默认值
export default 'Hello, world!';

// 导入默认值
import myModule from './myModule';
console.log(myModule); // 输出:Hello, world!

你可能感兴趣的:(es6,前端,javascript)