ES6 导出默认函数答案

【问题标题】：ES6 export default functionES6 导出默认函数
【发布时间】：2016-06-03 04:25:14
【问题描述】：

我可以为每个文件导出多个函数吗？似乎当我这样做时，第二个函数会覆盖第一个函数，

示例：在my index.js 文件中：

export default function aFnt(){
    console.log("function a");
}
export default function bFnt(){
    console.log("function b");
}

然后当我将它导入到我的文件中时：

import aFnt from "./index";

console.log("aFnt : ",aFnt);

console.log 的结果是 bFnt

这里到底是什么情况？我必须为每个函数创建一个新文件吗？那不是很实用，有什么解决方案或解决方法吗？

【问题讨论】：

【解决方案1】：

您可以使用named export 代替默认值：

export function aFnt(){
    console.log("function a");
}
export function bFnt(){
    console.log("function b");
}

并像这样导入它：

import {aFnt, bFnt} from "./index";

【讨论】：

【解决方案2】：

madox2's 如果您想导入命名函数，答案完全有效。

如果你仍然想导入默认值，还有另一种技巧：

function a() {}

function b() {}

export default { a, b }

当你导入时：

import myObject from './index.js';

myObject.a(); // function a
myObject.b(); // function b

我希望这会有所帮助！

【讨论】：

不错的方法，谢谢鲍比，有什么不同吗？
如果您要构建一个具有许多功能的模块，这是首选
感谢您的接受！我多次看到 { myCoolFunction, myOtherCoolFunction, mySuperDuperCoolFunction } from './index'; 的一些讨厌的东西可能会变得非常笨拙
将对象导出为默认值是 ES6 中的反模式。如果您需要一个带有导出的对象，您应该使用命名导出并执行import * as myObject from './index.js';。它实现了相同的目标，但与执行静态分析和死代码消除的工具配合使用效果更好。
@loganfsmyth 是对的。这个答案不应该被接受。当您像这段代码一样将所有函数捆绑到一个默认导出对象中时，您将强制导入器导入 all 函数......使他的包比需要的大得多。当您首先只有一个功能时，您应该只使用默认导出。否则使用命名导出，这样人们就可以只获取他们需要的功能。

【解决方案3】：

有几种方法可以导出和导入对象/函数

export function first() {}
export function second() {}

在其他文件中

import { first, second} from './somepath/somefile/';

如果您想使用默认值，通常如果文件中只有一个导出，则应该是默认导出。但是如果你出于某种原因想要两个函数作为默认值，那么你必须将它们作为一个对象并将该对象导出为默认值

function first() {}
function second() {}
const funcs= {"first":first,"second":second}
export default funcs;

在其他文件中

import funcs from './somepath/somefile/';
funcs.first();funs.second();

应该是这样的。

【讨论】：