不同的JS命名空间声明

JavaScript中的命名空间（Namespace）是一种组织代码的方式，用于避免全局作用域下的变量/函数命名冲突。以下是常见的命名空间声明方式及其特点、应用场景和示例：

1. 对象字面量（Object Literal）

基础概念：通过对象封装属性和方法，模拟命名空间。 优势：简单直观，适合小型项目。 缺点：无法实现私有成员，所有内容可被外部访问。

const MyNamespace = {
  value: 10,
  greet() {
    console.log("Hello from MyNamespace!");
  }
};
MyNamespace.greet(); // 调用方法

2. IIFE（立即调用函数表达式）

基础概念：通过闭包创建私有作用域，返回公共接口。 优势：支持私有变量，避免污染全局作用域。 应用场景：模块化开发、库/框架封装。

const MyNamespace = (function() {
  const privateVar = "Secret";
  return {
    publicMethod() {
      console.log(privateVar); // 可访问私有变量
    }
  };
})();
MyNamespace.publicMethod(); // "Secret"

3. ES6 模块（Module）

基础概念：通过 export 和 import 实现模块化。 优势：官方标准，支持静态分析、按需加载。 类型：

• 命名导出：export const name = 'value';
• 默认导出：export default function() {} 应用场景：现代前端项目（React/Vue等）。

// math.js
export const add = (a, b) => a + b;

// app.js
import { add } from './math.js';
console.log(add(1, 2)); // 3

4. 动态命名空间（动态扩展）

基础概念：运行时动态添加属性到命名空间对象。 优势：灵活扩展，适合插件系统。 缺点：需注意覆盖风险。

const MyNamespace = MyNamespace || {};
MyNamespace.newMethod = function() { /* ... */ };

5. 类模拟命名空间（Class）

基础概念：用类静态成员模拟命名空间。 优势：结合面向对象特性，支持继承。

class MyNamespace {
  static value = 42;
  static greet() {
    console.log("Static method");
  }
}
MyNamespace.greet(); // "Static method"

常见问题与解决

Q1: 命名冲突如何解决？

• 原因：全局作用域下同名变量被覆盖。
• 解决：使用IIFE或模块化隔离作用域。

Q2: 如何实现私有成员？

• 方法：通过闭包（IIFE）或ES2022的 # 私有字段。

class MyNamespace {
  #secret = "Private";
  getSecret() { return this.#secret; }
}

Q3: 模块化与命名空间的区别？

• 模块化：文件级作用域，显式导入导出。
• 命名空间：逻辑分组，可通过对象或闭包实现。

总结

• 简单场景：对象字面量。
• 复杂封装：IIFE + 闭包。
• 现代项目：ES6模块。
• 动态扩展：动态属性追加。

根据项目规模和协作需求选择合适的方式即可。