ES6 Module (模块)

Module基本用法

  • 通过 Module 的 export 与 import 来分割代码,集中相同的代码,优化逻辑

提示

注意:浏览器中使用时需要指定 type="module"

如果开发js插件需要在 package.json 中增加 "type": "module"

<script type="module" src=""></script>
  • ES6的模块自动采用 严格模式

export命令

  • 可以直接在任何变量或者函数前面加上一个 export 关键字,就可以将它导出
// export.js
export var name = 'Michael';
export function multiply (x, y) {
  return x * y;
};
// 或者
var name = 'Michael';
function multiply (x) {
  return x * x;
}
export { name, multiply };
  • export 输出的变量就是本来的名字,但是可以使用as关键字重命名
function v1 () {
  // ... some code
}
function v2 () {
  // ... some code
}
export {
  v1 as streamV1,
  v2 as streamV2,
  v2 as streamLatestVersion
};
  • 默认导出,指定一个变量作为默认值导出。默认导出的时候不需要指定一个变量名,它默认就是文件名
// myFunc.js
export default function () {
  // ... some code
};

import命令

  • 使用export命令定义了模块的对外接口以后,其他JS文件就可以通过import命令加载这个模块(文件)
// import.js
import { multiply } from './export';

multiply(5)  // 25
  • import 命令要使用as关键字,将输入的变量重命名
import { name as surname } from './export';
  • 用星号(*)指定一个对象,所有输出值都加载在这个对象上面
import * as test from './export';

test.name  // 'Michael'
  • 加载默认导出,
import myFunc from 'myFunc';

模块的继承

export * from 'myFunc';
export var e = 2.71828182846;
记录一些遇到的css问题

记录一些遇到的css问题

记录一些遇到的css问题,不同的设备对css的支持不一样,可能出现不同的效果

ES6 Map

ES6 Map

Map 类似于对象,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键

  • Map构造函数接受数组(任何具有 Iterator 接口、且每个成员都是一个双元素的数组的数据结构)作为参数