DevPath · Aprenda a programar ESPTEN

JavaScript moderno (ES6+)

Módulos: import e export

Módulos de JavaScript

À medida que um programa cresce, é uma boa ideia dividi-lo em arquivos separados. Os módulos permitem que um arquivo compartilhe (export) código e que outro o use (import).

Exportar

// arquivo: matematica.js
export function somar(a, b) {
  return a + b;
}
export const PI = 3.1416;

Também existe a exportação padrão (uma principal por arquivo):

// arquivo: saudacao.js
export default function saudar(nome) {
  return "Olá, " + nome;
}

Importar

// arquivo: app.js
import { somar, PI } from "./matematica.js"; // nomeadas (com chaves)
import saudar from "./saudacao.js";          // padrão (sem chaves)

console.log(somar(2, 3)); // 5
console.log(saudar("Ana"));

Por que eles importam?

Esta lição é conceitual: os módulos precisam de vários arquivos reais, então aqui você só verá a sintaxe. É a base de qualquer projeto moderno!

Exemplos

Como o código ficaria (não executável aqui)

// Isto ilustra a sintaxe; no editor não há outros arquivos.
function somar(a, b) {
  return a + b;
}
// Em um projeto real: export function somar(a, b) { ... }
console.log(somar(2, 3)); // 5
Coloque isto em prática

O DevPath é um curso prático: aqui você lê a teoria; no app você a coloca em prática com exercícios que rodam de verdade, offline.

Comece grátis no app →
← Optional chaining e nullish coalescingVer o módulo →