2016-10-15 1 views
3

Déclarationimport * vs import {specificName} dans Typescript/ES6?

declare module "MyModule" { 

export function Foo() {...} 
export function Bar() {...} 

} 

J'ai juste besoin Foo quelque part, comment dois-je importer?

import * as MyModule from "MyModule"; 

MyModule.Foo(); 

ou

import {Foo} from "MyModule"; 
Foo() 

Lequel est meilleur qu'un autre? Y a-t-il des implications de performance pour l'importation de toutes les exportations en premier lieu?

Quelques références que je lis avant les questions d'affichage:

https://www.exratione.com/2015/12/es6-use-of-import-property-from-module-is-not-a-great-plan/

+2

Pourquoi "* comme MyModule" n'est-il pas pris en compte ici si tout ce dont vous avez besoin est "Foo"? – estus

+0

http://stackoverflow.com/questions/147454/why-is-using-a-wild-card-with-a-java-import-statement-bad –

+1

@SandeepRoy Je parle de javascript et ici ce n'est pas l'encombrement espace de nommage. –

Répondre

4

Importation seulement ce qui est nécessaire à votre code est, bien sûr, bonnes pratiques. Supposons que quelqu'un écrit un code de mille lignes important tout, puis vous essayez de l'analyser. Pensez-vous que vous sauriez facilement quelles sont les fonctions utilisées dans votre code qui sont importées ou qui ne le sont pas? Évidemment, il est douteux et mauvaise pratique.

En ce qui concerne la performance, je suppose que pas beaucoup affecté.

1

Si vous devez utiliser seulementFoo, je pense qu'il est préférable d'importer seulement Foo. Cela rend votre code plus clair, car en regardant cette importation, vous pouvez dire quels éléments de MyModule ce code utilise.

Cela n'affecte pas les performances, car vous devez lire/télécharger tout le fichier. De plus, peu importe l'option que vous choisissez lorsque vous utilisez un bundler comme Rollup.js, même si vous importez tout à partir de MyModule, l'ensemble inclura uniquement les éléments réellement utilisés dans votre code.

+0

Je ne pense pas que nous utilisions un bundler qui supporte le treehaking. –

1

La syntaxe import {} from ... rend très difficile le stubbing et l'espionnage des fonctions et nécessite normalement des bibliothèques supplémentaires telles que rewire.js. L'avertissement est que l'agitation des arbres ne fonctionne pas aussi bien. Je suis enclin à garder mes utilitaires petits et peut-être inclure seulement 2-3 fonctions par module. De cette façon, je peux utiliser la syntaxe import * as ... pour mes modules et import {} ... si possible pour les modules tiers. Minimisant ainsi le besoin de secouer les arbres.