es6中export 和 export default区别

用了这么就的export和import，看多了export和export default，总结下这两者的区别。

一、两者区别

• export不能直接导出除了对象外的其他数据（function可以，但是得非匿名函数）。

// ok
export function aa() {
    console.log(111);
};
// ok
let aaa = 123;
export {
    aaa
};
// error
export '123';

• export可以多次导出，但是export default只能导出一个。

export function getA() {
    // ...
};
export function getB() {
    // ...
};

• 导入export方式的需要用{}，并且变量名称必须要一致，而导入export default方式的不需要，并且可以随便重命名。

export function getA() {
    // ...
};
对应于
import { getA } from ...

export default function() {
    console.log(11);
};
对应于
import getA from...

• 使用export 方式导出时，导入时可以import * as name from..这种方式

如果想给方法加个顶层的全局变量的话，可以这么使用。

import * as name from ....;
name.getA();
name.getB();

二、总结

其实两者最大的区别是在于import的时候，也就是前面第三点。

其中第三点是基于第四点的，第三点行的通还是依赖了es6的另外一个解构的特性：

import * as name from ....;
let { getA,getB } = name;

所以看个人喜好，使用了。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!