JavaScript Named Export

​

Syntax Variations

export const MAX_RETRIES = 3;
export let currentStatus = 'idle';
export function initialize() {}
export class DataParser {}

const timeout = 5000;
function parse() {}
class Formatter {}

export { timeout, parse, Formatter };

const internalName = 'System';
function internalProcess() {}

export { 
  internalName as ExternalName, 
  internalProcess as process 
};

​

Import Mechanics

// Standard named import
import { MAX_RETRIES, initialize } from './module.js';

// Aliased named import (renaming the binding locally)
import { ExternalName as SystemName } from './module.js';

// Namespace import (groups all named exports into a single module object)
import * as ModuleAPI from './module.js';

​

Technical Characteristics

• Live Bindings: Named exports do not export values by copy; they export live references to the bindings. If the exporting module mutates an exported variable, the importing module will immediately reflect that updated value. However, the imported binding is strictly read-only from the consumer’s side.
• Static Structure: Export statements must be declared at the top level of the module scope. They cannot be nested inside functions, if statements, or loops. This strict static structure allows the JavaScript engine to perform static analysis, enabling features like tree-shaking (dead code elimination) during the build process.
• Hoisting: Because ES6 modules are statically analyzed before execution, named exports are resolved during the parsing phase. The physical location of the export statement within the file does not affect the availability of the binding to importing modules.