最好导出包含函数的对象,或者只导出ES6中的多个函数(是否存在约定？)

Question

这是一个惯例问题.我是ES6的新手,但我正在尝试使用模块系统.从单个文件导出多个函数或导出包含这些函数的单个对象是首选/更常见的.

例:

utils.js

export function add(num1, num2) {
  return num1 + num2;
}

export function minus(num1, num2) {
  return num1 - num2;
}

并像这样使用它:

import {add, minus} from 'utils.js';

VS

utils.js

const utils = {
  add: (num1, num2) => {
    return num1 + num2;
  },

  minus: (num1, num2) => {
    return num1 - num2;
  }
}

export default utils;

在包含50-100个函数的utils文件中,第二种方式似乎是明显的赢家.但是对我来说只有一些感觉不对的东西,我不知道为什么.

Answer 1

展望未来,导出多个功能可能更好,因为树摇动允许模块捆绑器根据是否已导入来消除死代码.

如果导出一个大对象,则无法始终使用静态分析来确定需要保留哪些函数以及哪些函数可以安全地丢弃.

如果导出多个命名函数,则模块捆绑器可以分析AST,然后将您实际导入的函数安全地列入白名单.

Answer 2

如果您有通过utils文件公开的50-100个函数,那么我会说使用命名的导出

export function add() {}

因为否则每次导入utils时都会导入所有函数.这可能是你有时想要的,但最有可能的是,对于任何给定的模块,只有少数可用的函数.如果你想要所有的功能import * as utils from './utils';就足够了.

但是,如果您想要安全防范它,那么没有什么不能说您可以使用这两种模式.

export function add() {};

const utils = {
   add: add
};
export default utils; 

以上是有效的,也很常见.

只记得使用Babel 6.x时,使用export defaultwill实际生成一个对象(正确的方法),其中包含一个default属性,导出的对象将附加到该属性上.

import utils from './utils';

console.log(utils);
// { default: yourUtilsObject }