es6 Module 的语法

输出变量

var firstName = 'Michael';
var lastName = 'Jackson';
var year = 1958;
export {firstName, lastName, year};

// 写法一
export var m = 1;

// 写法二
var m = 1;
export {m};

// 写法三
var n = 1;
export {n as m};

输出函数

function v1() { ... }
function v2() { ... }

export {
  v1 as streamV1,
  v2 as streamV2,
  v2 as streamLatestVersion
};

// 报错
function f() {}
export f;

// 正确
export function f() {};

// 正确
function f() {}
export {f};

import 命令 

import {firstName, lastName, year} from './profile.js';

import { lastName as surname } from './profile.js';

模块的整体加载 

export function area(radius) {
  return Math.PI * radius * radius;
}

export function circumference(radius) {
  return 2 * Math.PI * radius;
}

import { area, circumference } from './circle';

console.log('圆面积:' + area(4));
console.log('圆周长:' + circumference(14));


import * as circle from './circle';

console.log('圆面积:' + circle.area(4));
console.log('圆周长:' + circle.circumference(14));


// 第一组

export default function crc32() { // 输出
  // ...
}

import crc32 from 'crc32'; // 输入

// 第二组
export function crc32() { // 输出
  // ...
};

import {crc32} from 'crc32'; // 输入

CommonJS、AMD 和 ES6 Module 是 JavaScript 中三种不同的模块化规范,用于实现代码的模块化和复用。 1. **CommonJS**: - CommonJS 是一种同步加载模块的规范,主要用于服务器端(如 Node.js)。 - 使用 `require` 导入模块,使用 `module.exports` 或 `exports` 导出模块。 - 示例: ```javascript // 导入模块 const moduleA = require('moduleA'); // 导出模块 module.exports = { functionA: function() { // ... } }; ``` 2. **AMD (Asynchronous Module Definition)**: - AMD 是一种异步加载模块的规范,主要用于浏览器端。 - 使用 `define` 定义模块,使用 `require` 加载模块。 - 示例: ```javascript // 定义模块 define(['moduleB'], function(moduleB) { return { functionB: function() { // ... } }; }); // 加载模块 require(['moduleB'], function(moduleB) { moduleB.functionB(); }); ``` 3. **ES6 Module**: - ES6 Module 是 ECMAScript 6 引入的官方模块化规范,既适用于浏览器端也适用于服务器端。 - 使用 `import` 导入模块,使用 `export` 导出模块。 - 示例: ```javascript // 导入模块 import { functionC } from 'moduleC'; // 导出模块 export function functionC() { // ... } ``` ### 对比 - **同步 vs 异步**: CommonJS 是同步加载,适用于服务器端;AMD 是异步加载,适用于浏览器端;ES6 Module 可以在编译时进行静态分析,既支持同步也支持异步。 - **语法**: CommonJS 使用 `require` 和 `module.exports`,AMD 使用 `define` 和 `require`,ES6 Module 使用 `import` 和 `export`。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值