Comando de exportación y comando de importación de ES6

La función del módulo consta principalmente de dos comandos: exportar e importar.
Un módulo es un archivo separado y las variables de este archivo no se pueden obtener desde el exterior. Si desea obtener esta variable externamente, use exportar solo para exportar esta variable dentro del archivo y luego importe esta variable externamente.

comando de exportación

export puede exportar algunas variables, funciones, matrices, constantes, etc.
Por ejemplo, en el archivo variable.js, se definen dos variables: a y b, por lo que si desea usar las dos variables externamente, puede usar exoprt para exportar estas dos variables:

export var a = 10;
export function fo() {
    
    
  ......
};

El método de escritura anterior se puede cambiar de otra manera: (se recomienda utilizar únicamente el siguiente método, que es más intuitivo)

var a = 10;
function fo() {
    
    
  ......
};
export {
    
    a, fo};

nombre

El nombre de la variable exportada suele ser el nombre original de la variable (en el ejemplo anterior, los nombres de las variables exportadas son a y fo). Pero puedes usar la palabra clave as para cambiar el nombre:

......
export {
    
    a as v_a, fo as f_fo};

comando de importación

Ahora, para usar las variables del archivo variable.js en el archivo test.js:

import {
    
    a, fo} from './variable.js';
console.log(a);

Aquí, el comando de importación se utiliza para importar a y fo desde el archivo variable.js. Una llave aceptada directamente por importación, y el valor dentro debe ser el mismo que el exportado por exportación (es decir, el nombre mencionado en el paso anterior, este nombre debe ser el mismo).
Nota: Las variables ingresadas por el comando de importación son todas de solo lectura, porque su esencia es una interfaz de entrada. En otras palabras, no está permitido reescribir la interfaz en el script que carga el módulo.
Dado que el comando de importación se ejecuta durante la fase de compilación, incluso si se define al final, será promovido al encabezado del módulo.

nombre

De manera similar, también se puede cambiar el nombre de las importaciones usando la palabra clave as :

import {
    
    a as v_a, fo as f_fo} from './variable.js';
......

Carga total

El método descrito anteriormente es cargar uno por uno (es decir, se puede cargar selectivamente), o se puede cargar como un todo, es decir, usar un asterisco (*) para especificar un objeto y todos los valores de salida. ​​​se cargan en este objeto :

import {
    
     * as v} from './variable.js';
console.log(v.a);

exportar comando predeterminado

Al utilizar el comando de importación anterior, necesita saber cuál es el nombre de exportación. Ahora introduzca un método, independientemente del nombre de exportación, es decir, al exportar, use el valor predeterminado:

function foo() {
    
    
  ......
}
export default foo;

Luego, al importar, puede especificar un nombre usted mismo:

import customName from './variable.js';

Aquí customName es un nombre personalizado y no es necesario utilizar llaves.
Cabe señalar que la esencia de la exportación predeterminada es asignar el siguiente valor a la variable predeterminada, por lo que:

// 正确
export default 10;
// 报错
export 10;

// 正确
export var a = 1;
// 错误
export default var a = 1;

Escritura compuesta de importación y exportación.

En un módulo A, primero imoortB, luego exprtB, puedes escribir:

export {
    
     va, vb } from './B.js';

// 可以简单理解为
import {
    
     va, vb } from './B.js';
export {
    
     va, vb };

De manera similar, el método de escritura compuesto también admite el método de escritura de cambio de nombre, salida general e interfaz predeterminada:

// 接口改名
export {
    
     va as v_a, vb as v_b } from './B.js';
// 整体输出
export * from './B.js';
// 默认输出
export {
    
     default } from './B.js';

El método de escritura para cambiar la interfaz nombrada a la interfaz predeterminada es el siguiente.

export {
    
     va as default } from './B.js';

// 等同于
import {
    
     va } from './B.js';
export default va;