Importando una Única Exportación de un Módulo en ES6

En ES6 (ECMAScript 6), también conocido como ES2015, la gestión de módulos en JavaScript se mejoró considerablemente. Un concepto clave de esta mejora es la capacidad de exportar e importar funciones, objetos o valores desde y hacia módulos, permitiendo una mejor estructura y organización del código.

Para importar correctamente una única exportación de un módulo en ES6, la sintaxis correcta sería import myExport from 'module'. En esta declaración, "myExport" es el nombre de la exportación que se quiere importar y "'module'" es la ruta del módulo donde reside la exportación.

Examinemos una ilustración práctica de cómo funciona esto:

Supongamos que tenemos un archivo module.js que contiene una función que queremos exportar:

// module.js
export default function sayHello() {
  console.log('Hello, world!');
}

Para importar y utilizar la función sayHello en otro archivo JavaScript:

// main.js
import sayHello from './module';

sayHello();

Cuando ejecutamos main.js, veremos en la consola el mensaje 'Hello, world!'.

Es importante notar que, cuando importamos una única exportación como en el ejemplo anterior, estamos importando la exportación predeterminada del módulo. Un módulo puede tener solo una exportación predeterminada y se importa sin las llaves {}.

Sin embargo, un módulo puede tener varias exportaciones nombradas, que deben importarse entre llaves {}. Por ejemplo:

// module.js
export function func1() { ... }
export function func2() { ... }

Y se importarían de la siguiente manera:

// main.js
import { func1, func2 } from './module';

func1();
func2();

Por tanto, siempre es bueno entender tanto la exportación predeterminada como las nombradas para utilizarlas según las necesidades del código que estemos desarrollando.