模块的优点
在模块顶部创建的变量不会自动被添加到全局共享作用域。
导出
导出方式一
export const PI = 3.14;
export const obj = {
name: 'lee',
age: 18
}
export function sum (a, b) {
return a+b;
}
导出方式二
const obj = {
name: 'lee',
age: 18
}
const PI = 3.14;
function sum (a, b) {
return a+b;
}
export {obj, PI, sum}
导入
分别导入
import {obj, PI, sum} from './file.js'
console.log(sum(1, 2)); // 3
导入整个模块
import * as file from './file.js'
console.log(file.sum(1, 2)); // 3
重命名
导出重命名
function sum (a, b) {
return a+b;
}
export {sum as add}
import {add} from './file.js'
导入重命名
function sum (a, b) {
return a+b;
}
export {sum}
import {sum as add} from './file.js'
默认值
导出默认值
导出默认值方式一
function sum (a, b) {
return a+b;
}
export default sum;
导出默认值方式二
function sum (a, b) {
return a+b;
}
export {sum as default}
导入默认值
import sum from './file.js'
导出默认和非默认
export const PI = 3.14;
export default function sum (a, b) {
return a+b;
}
默认必须排在非默认之前
import sum, {PI} from './file.js'
与require的区别
require
Require是CommonJS的语法,CommonJS的模块是对象,输入时必须查找对象属性。
// CommonJS模块
let { stat, exists, readFile } = require('fs');
// 等同于
let _fs = require('fs');
let stat = _fs.stat;
let exists = _fs.exists;
let readfile = _fs.readfile;
1、整体加载fs模块(即加载fs所有方法),生成一个对象"_fs",然后再从这个对象上读取三个方法,是赋值过程并且是运行时才执行,也就是异步加载。只有运行时才能得到这个对象,不能在编译时做到静态化。
2、可以理解为一个全局方法,因为它是一个方法所以意味着可以在任何地方执行。
import
ES6 模块的设计思想,是尽量的静态化,使得编译时就能确定模块的依赖关系,以及输入和输出的变量。相较而言,性能更优。
import { stat, exists, readFile } from 'fs';
1、从fs加载“stat, exists, readFile” 三个方法,其他方法不加载。是解构过程并且是编译时执行。
2、必须写在文件的顶部。