Meglio esportare un oggetto contenente una funzione, o semplicemente esportare più funzioni in ES6 (Esiste una convenzione?)

Question

Questa è una questione di convenzione. Sono nuovo di ES6, ma sto cercando di utilizzare il sistema dei moduli. È preferibile/più comune esportare più funzioni da un singolo file o esportare un singolo oggetto contenente queste funzioni.

Esempio:

utils.js

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

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

e usarlo in questo modo:

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; 

In un file utils contenente le funzioni 50-100, sembra che il secondo modo sarebbe il chiaro vincitore. Ma c'è solo qualcosa che mi sembra sbagliato, e non so perché.

Answer 1

Andando avanti, è probabilmente meglio per esportare più funzioni, come tree shaking permette module bundlers per eliminare codice morto in base al fatto che è stato importato oppure no.

Se si esporta un oggetto di grandi dimensioni, non è sempre possibile utilizzare l'analisi statica per indicare quali funzioni devono essere mantenute e quali possono essere eliminate in modo sicuro.

Se si esportano più funzioni con nome, il modulo di raggruppamento può analizzare l'AST e quindi autorizzare in modo sicuro le funzioni che si stanno effettivamente importando.

Answer 2

Se avete come dici 50-100 funzioni che si desidera esporre attraverso i utils File allora direi andare con le esportazioni di nome

export function add() {} 

perché altrimenti ogni volta che l'importazione di utils prenderebbe posizionare importerebbe tutte le funzioni. Questo potrebbe essere ciò che vuoi a volte ma molto probabilmente ci sarà solo una manciata di funzioni utilizzabili per ogni dato modulo. Se si desidera che tutte le funzioni siano un semplice import * as utils from './utils';, è sufficiente.

Tuttavia, non c'è nulla che non dica che è possibile utilizzare entrambi i modelli se si vuole proteggerlo in sicurezza.

export function add() {}; 

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

Sopra è sia valido che abbastanza comune pure.

Ricordare appena da Babel 6.x quando si sviluppa una libreria utilizzando export default verrà effettivamente prodotto un oggetto (nel modo corretto) contenente una proprietà default su cui verrà collegato l'oggetto esportato.

import utils from './utils'; 

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