javascript - ejemplos - Módulos ES6: exporta una sola clase de métodos estáticos O múltiples métodos individuales

javascript class properties

Question

Estoy usando módulos ECMAScript6. ¿Cuál es la forma correcta de exportar / importar múltiples métodos desde un módulo de las siguientes opciones?

Clase única de métodos estáticos:

//------ myClass.js ------

export default class myClass {

  static myMethod1() {
    console.log(''foo''); 
  }

  static myMethod2(args...) {
    console.log(''bar''); 
  }  

}

//------ app.js ------

import myClass from ''myClass'';
myClass.myMethod1();    //foo

Múltiples métodos exportados:

//------ myMethods.js ------

export function myMethod1() {
    console.log(''foo'');
}

export function myMethod2() {
    console.log(''bar'');
}

//------ app.js ------
import {myMethod1, myMethod2} from ''myMethods'';
myMethod1()    //foo;


//OR
import * as myMethods from ''myMethods'';
myMethods.myMethod1()    //foo;

1) Exportación: una clase de métodos estáticos se siente como un "olor a código", pero exportar de manera similar todo individualmente se siente un poco detallado. ¿Es simplemente la preferencia del desarrollador o hay implicaciones de rendimiento aquí?

2) Importar: la sintaxis ''* as'' es mi método preferido, ya que le permite utilizar la notación de puntos (que hace referencia tanto al módulo como al método) ayudando a la legibilidad del código. ¿Esto tiene implicaciones de rendimiento cuando solo puedo estar usando 1 de los métodos?

Answer 1

Una clase de métodos estáticos se siente como un "olor a código"

Si de hecho. ¡No necesitas una estructura de class aquí! Simplemente exporte un objeto "módulo" normal:

//------ myMethods.js ------

export default {
  myMethod1() {
    console.log(''foo''); 
  },
  myMethod2(args...) {
    console.log(''bar''); 
  }  
};

Sin embargo, recomiendo su segundo enfoque con múltiples exportaciones.

exportar todo individualmente se siente un poco detallado

Bueno, no necesitas ninguna estructura de envoltura, por lo que diría que es menos repetitivo. Solo tiene que etiquetar explícitamente todo lo que desea exportar, lo cual no es algo malo.

* as sintaxis es mi método preferido, ya que le permite usar la notación de puntos (haciendo referencia tanto al módulo como al método) para facilitar la legibilidad del código.

Esa es una preferencia muy personal y depende del tipo de código que esté escribiendo. A veces, la concisión es superior, pero la capacidad de hacer referencia explícita al módulo también puede ser útil. Tenga en cuenta que las importaciones de espacio de nombres usando * as y los objetos importados por defecto son muy similares aquí, aunque solo las exportaciones con nombre le permiten hacer referencia directa a ellas mediante import {myMethod1, myMethod2} . Así que mejor deje la elección a aquellos que importan su módulo.

¿Tiene esto alguna implicación de rendimiento?

No mucho. Las implementaciones actuales de ES6 todavía no apuntan a optimizaciones de rendimiento de todos modos.

En general, los identificadores estáticos son más fáciles de resolver y optimizar que los accesos a propiedades ^[1] , múltiples exportaciones con nombre e importaciones parciales en teoría podrían hacer que JIT sea más rápido y, por supuesto, los archivos más pequeños necesitan menos tiempo para cargarse si las exportaciones no utilizadas se eliminan durante la agrupación. Ver here para más detalles. Difícilmente habrá diferencias notables de rendimiento, debe usar lo que sea mejor mantenible.

_{[1]: los espacios de nombres del módulo ( import * as ns ) también son estáticos, incluso si ns.… parece un acceso de propiedad dinámico}