@lppx/nlearn 1.1.0

package/dist/src/demo/esm/01-/345/237/272/347/241/200/346/246/202/345/277/265.js

@@ -0,0 +1,226 @@
+"use strict";
+/**
+ * ESM 基础概念
+ * ============
+ * 本文件介绍 ECMAScript Modules (ESM) 的基本概念和语法
+ * 适用于 Node.js 14+ 版本
+ *
+ * ESM vs CommonJS:
+ * - ESM 是 JavaScript 的官方标准模块系统
+ * - CommonJS 是 Node.js 早期采用的模块系统
+ * - ESM 使用 import/export，CommonJS 使用 require/module.exports
+ */
+// #region 示例1: 什么是模块系统
+/**
+ * 模块系统的作用：
+ * 1. 代码组织：将代码分割成独立的文件
+ * 2. 作用域隔离：每个模块有自己的作用域
+ * 3. 依赖管理：明确模块之间的依赖关系
+ * 4. 代码复用：方便在不同地方使用相同的代码
+ */
+function explainModuleSystem() {
+    console.log(`=== 模块系统的核心概念 ===
+
+1. 模块（Module）：
+   - 一个文件就是一个模块
+   - 每个模块有独立的作用域
+   - 模块内的变量默认是私有的
+
+2. 导出（Export）：
+   - 将模块内的功能暴露给外部使用
+   - 可以导出变量、函数、类等
+
+3. 导入（Import）：
+   - 从其他模块引入需要的功能
+   - 只能使用被导出的内容
+`);
+}
+// #endregion
+// #region 示例2: ESM 与 CommonJS 的对比
+function compareModuleSystems() {
+    console.log(`=== ESM vs CommonJS 对比 ===
+
+【语法对比】
+CommonJS 导出：
+  module.exports = { ... }
+  exports.name = value
+
+ESM 导出：
+  export { ... }
+  export default ...
+
+CommonJS 导入：
+  const module = require("./module")
+  const { name } = require("./module")
+
+ESM 导入：
+  import module from "./module.js"
+  import { name } from "./module.js"
+
+【关键差异】
+1. 加载时机：
+   - CommonJS: 运行时同步加载
+   - ESM: 编译时静态分析，异步加载
+
+2. 文件扩展名：
+   - CommonJS: 可省略 .js
+   - ESM: 必须包含完整扩展名 .js 或 .mjs
+
+3. this 指向：
+   - CommonJS: this 指向 module.exports
+   - ESM: this 是 undefined
+
+4. 循环依赖：
+   - CommonJS: 返回未完成的副本
+   - ESM: 支持更好的循环依赖处理
+`);
+}
+// #endregion
+// #region 示例3: 如何在 Node.js 中启用 ESM
+function enableESMInNodejs() {
+    console.log(`=== 在 Node.js 中启用 ESM ===
+
+方法1: 使用 .mjs 扩展名
+  - 将文件命名为 .mjs
+  - Node.js 会自动将其视为 ESM 模块
+  - 示例: module.mjs
+
+方法2: 在 package.json 中设置 type
+  {
+    "type": "module"
+  }
+  - 所有 .js 文件都会被视为 ESM
+  - 如需使用 CommonJS，文件需命名为 .cjs
+
+方法3: 使用 TypeScript
+  - 在 tsconfig.json 中设置：
+    "module": "ES2020" 或 "ESNext"
+  - TypeScript 会编译为 ESM 格式
+
+注意事项：
+  - ESM 和 CommonJS 可以互操作，但有限制
+  - ESM 可以导入 CommonJS 模块
+  - CommonJS 不能直接 require ESM 模块
+`);
+}
+// #endregion
+// #region 示例4: ESM 的严格模式
+function esmStrictMode() {
+    console.log(`=== ESM 的严格模式 ===
+
+ESM 模块自动运行在严格模式下：
+1. 不需要显式声明 "use strict"
+2. 禁止使用未声明的变量
+3. 禁止删除变量、函数
+4. 函数参数名不能重复
+5. 禁止八进制字面量
+
+示例：
+// 在 ESM 中，以下代码会报错：
+// x = 10;  // ReferenceError: x is not defined
+
+// 必须先声明：
+// let x = 10;  // 正确
+`);
+}
+// #endregion
+// #region 示例5: 模块作用域
+function moduleScope() {
+    // 模块内的变量
+    const privateVar = '这是私有变量';
+    const publicVar = '这是公开变量';
+    console.log(`=== 模块作用域 ===
+
+每个模块都有独立的作用域：
+
+1. 私有变量：
+   ${privateVar}
+   - 未导出的变量只能在模块内部访问
+   - 外部无法访问
+
+2. 公开变量：
+   ${publicVar}
+   - 通过 export 导出后，外部可以导入使用
+   - 但仍然是只读的（不能重新赋值）
+
+3. 全局对象：
+   - 在 ESM 中，顶层的 this 是 undefined
+   - 不会污染全局作用域
+   - 使用 globalThis 访问全局对象
+`);
+}
+// #endregion
+// 主函数：根据参数运行指定示例
+if (require.main === module) {
+    const args = process.argv.slice(2);
+    const exampleNum = args[0] ? parseInt(args[0]) : 0;
+    if (exampleNum === 0) {
+        // 运行所有示例
+        console.log(`
+${'='.repeat(50)}
+运行所有示例
+${'='.repeat(50)}
+`);
+        explainModuleSystem();
+        console.log('\n' + '-'.repeat(50) + '\n');
+        compareModuleSystems();
+        console.log('\n' + '-'.repeat(50) + '\n');
+        enableESMInNodejs();
+        console.log('\n' + '-'.repeat(50) + '\n');
+        esmStrictMode();
+        console.log('\n' + '-'.repeat(50) + '\n');
+        moduleScope();
+        console.log('\n' + '='.repeat(50));
+    }
+    else if (exampleNum === 1) {
+        console.log(`
+运行示例 1: 什么是模块系统
+
+${'='.repeat(50)}`);
+        explainModuleSystem();
+        console.log('='.repeat(50));
+    }
+    else if (exampleNum === 2) {
+        console.log(`
+运行示例 2: ESM 与 CommonJS 的对比
+
+${'='.repeat(50)}`);
+        compareModuleSystems();
+        console.log('='.repeat(50));
+    }
+    else if (exampleNum === 3) {
+        console.log(`
+运行示例 3: 如何在 Node.js 中启用 ESM
+
+${'='.repeat(50)}`);
+        enableESMInNodejs();
+        console.log('='.repeat(50));
+    }
+    else if (exampleNum === 4) {
+        console.log(`
+运行示例 4: ESM 的严格模式
+
+${'='.repeat(50)}`);
+        esmStrictMode();
+        console.log('='.repeat(50));
+    }
+    else if (exampleNum === 5) {
+        console.log(`
+运行示例 5: 模块作用域
+
+${'='.repeat(50)}`);
+        moduleScope();
+        console.log('='.repeat(50));
+    }
+    else {
+        console.log(`可用的示例：
+  1. 什么是模块系统
+  2. ESM 与 CommonJS 的对比
+  3. 如何在 Node.js 中启用 ESM
+  4. ESM 的严格模式
+  5. 模块作用域
+
+使用方法: ts-node 01-基础概念.ts [示例编号]
+不提供编号则运行所有示例`);
+    }
+}

package/dist/src/demo/esm/02-/345/257/274/345/207/272/350/257/255/346/263/225.js

@@ -0,0 +1,281 @@
+"use strict";
+/**
+ * ESM 导出语法
+ * ============
+ * 本文件详细介绍 ESM 的各种导出方式
+ * 包括命名导出、默认导出、重导出等
+ */
+// #region 示例1: 命名导出（Named Exports）
+/**
+ * 命名导出：可以导出多个值，每个值都有自己的名称
+ * 导入时必须使用相同的名称（或使用 as 重命名）
+ */
+function demonstrateNamedExports() {
+    console.log(`=== 命名导出 ===
+
+语法形式1: 声明时导出
+  export const name = "value";
+  export function func() {}
+  export class MyClass {}
+
+语法形式2: 声明后导出
+  const name = "value";
+  function func() {}
+  export { name, func };
+
+语法形式3: 导出时重命名
+  const internalName = "value";
+  export { internalName as publicName };
+
+示例代码：
+---
+// math.js
+export const PI = 3.14159;
+export function add(a, b) { return a + b; }
+export function multiply(a, b) { return a * b; }
+---
+
+特点：
+  ✓ 可以导出多个值
+  ✓ 导入时使用花括号 {}
+  ✓ 名称必须匹配（或使用 as 重命名）
+  ✓ 支持 Tree Shaking（未使用的导出会被移除）
+`);
+}
+// #endregion
+// #region 示例2: 默认导出（Default Export）
+/**
+ * 默认导出：每个模块只能有一个默认导出
+ * 导入时可以使用任意名称
+ */
+function demonstrateDefaultExport() {
+    console.log(`=== 默认导出 ===
+
+语法形式1: 导出值
+  export default 42;
+  export default "hello";
+
+语法形式2: 导出函数
+  export default function() {}
+  export default function myFunc() {}
+
+语法形式3: 导出类
+  export default class {}
+  export default class MyClass {}
+
+语法形式4: 导出已声明的值
+  const value = 42;
+  export default value;
+
+示例代码：
+---
+// calculator.js
+export default class Calculator {
+  add(a, b) { return a + b; }
+  subtract(a, b) { return a - b; }
+}
+---
+
+特点：
+  ✓ 每个模块只能有一个默认导出
+  ✓ 导入时不使用花括号
+  ✓ 导入时可以使用任意名称
+  ✓ 适合导出模块的主要功能
+`);
+}
+// #endregion
+// #region 示例3: 混合导出
+/**
+ * 混合导出：同时使用命名导出和默认导出
+ */
+function demonstrateMixedExports() {
+    console.log('=== 混合导出 ===\n');
+    console.log('可以在同一个模块中同时使用命名导出和默认导出：\n');
+    console.log('示例代码：');
+    console.log('---');
+    console.log('// utils.js');
+    console.log('export const VERSION = "1.0.0";');
+    console.log('export function helper() {}');
+    console.log('');
+    console.log('export default class MainClass {');
+    console.log('  // 主要功能');
+    console.log('}');
+    console.log('---\n');
+    console.log('导入方式：');
+    console.log('  import MainClass, { VERSION, helper } from "./utils.js";\n');
+    console.log('使用场景：');
+    console.log('  - 模块有一个主要功能（默认导出）');
+    console.log('  - 同时提供一些辅助功能（命名导出）');
+    console.log('  - 例如：React 组件（默认）+ 工具函数（命名）\n');
+}
+// #endregion
+// #region 示例4: 重导出（Re-exports）
+/**
+ * 重导出：从其他模块导入后再导出
+ * 常用于创建统一的入口文件
+ */
+function demonstrateReExports() {
+    console.log('=== 重导出 ===\n');
+    console.log('语法形式1: 重导出所有命名导出');
+    console.log('  export * from "./module.js";\n');
+    console.log('语法形式2: 重导出特定的命名导出');
+    console.log('  export { name1, name2 } from "./module.js";\n');
+    console.log('语法形式3: 重导出并重命名');
+    console.log('  export { oldName as newName } from "./module.js";\n');
+    console.log('语法形式4: 重导出默认导出为命名导出');
+    console.log('  export { default as myName } from "./module.js";\n');
+    console.log('语法形式5: 重导出命名导出为默认导出');
+    console.log('  export { myName as default } from "./module.js";\n');
+    console.log('实际应用示例：');
+    console.log('---');
+    console.log('// components/index.js (统一入口)');
+    console.log('export { Button } from "./Button.js";');
+    console.log('export { Input } from "./Input.js";');
+    console.log('export { Modal } from "./Modal.js";');
+    console.log('');
+    console.log('// 使用时只需从一个文件导入');
+    console.log('import { Button, Input, Modal } from "./components/index.js";');
+    console.log('---\n');
+    console.log('注意事项：');
+    console.log('  - export * 不会重导出默认导出');
+    console.log('  - 重导出时不能在当前模块中使用这些值');
+    console.log('  - 适合创建 barrel 文件（桶文件）\n');
+}
+// #endregion
+// #region 示例5: 聚合导出模式
+/**
+ * 聚合导出：将多个模块的导出聚合到一个文件
+ */
+function demonstrateAggregateExports() {
+    console.log('=== 聚合导出模式 ===\n');
+    console.log('场景：有多个相关的模块，想要提供统一的导入入口\n');
+    console.log('文件结构：');
+    console.log('  utils/');
+    console.log('    ├── string.js');
+    console.log('    ├── array.js');
+    console.log('    ├── object.js');
+    console.log('    └── index.js  (聚合文件)\n');
+    console.log('各模块内容：');
+    console.log('---');
+    console.log('// string.js');
+    console.log('export function capitalize(str) { ... }');
+    console.log('export function trim(str) { ... }');
+    console.log('');
+    console.log('// array.js');
+    console.log('export function unique(arr) { ... }');
+    console.log('export function flatten(arr) { ... }');
+    console.log('');
+    console.log('// object.js');
+    console.log('export function merge(obj1, obj2) { ... }');
+    console.log('export function clone(obj) { ... }');
+    console.log('---\n');
+    console.log('聚合文件 (index.js)：');
+    console.log('---');
+    console.log('// 方式1: 分别重导出');
+    console.log('export * from "./string.js";');
+    console.log('export * from "./array.js";');
+    console.log('export * from "./object.js";');
+    console.log('');
+    console.log('// 方式2: 按命名空间组织');
+    console.log('export * as StringUtils from "./string.js";');
+    console.log('export * as ArrayUtils from "./array.js";');
+    console.log('export * as ObjectUtils from "./object.js";');
+    console.log('---\n');
+    console.log('使用方式：');
+    console.log('// 方式1: 直接导入所有函数');
+    console.log('import { capitalize, unique, merge } from "./utils/index.js";');
+    console.log('');
+    console.log('// 方式2: 按命名空间导入');
+    console.log('import { StringUtils, ArrayUtils } from "./utils/index.js";');
+    console.log('StringUtils.capitalize("hello");\n');
+}
+// #endregion
+// #region 示例6: 导出的注意事项
+function exportCaveats() {
+    console.log('=== 导出的注意事项 ===\n');
+    console.log('1. 导出的是绑定，不是值的副本：');
+    console.log('---');
+    console.log('// counter.js');
+    console.log('export let count = 0;');
+    console.log('export function increment() { count++; }');
+    console.log('');
+    console.log('// main.js');
+    console.log('import { count, increment } from "./counter.js";');
+    console.log('console.log(count);  // 0');
+    console.log('increment();');
+    console.log('console.log(count);  // 1 (值会更新)');
+    console.log('---\n');
+    console.log('2. 导入的绑定是只读的：');
+    console.log('---');
+    console.log('import { count } from "./counter.js";');
+    console.log('count = 10;  // TypeError: Assignment to constant variable');
+    console.log('---\n');
+    console.log('3. 导出语句必须在顶层：');
+    console.log('---');
+    console.log('// ❌ 错误：不能在条件语句中导出');
+    console.log('if (condition) {');
+    console.log('  export const value = 42;  // SyntaxError');
+    console.log('}');
+    console.log('');
+    console.log('// ✓ 正确：在顶层导出');
+    console.log('export const value = condition ? 42 : 0;');
+    console.log('---\n');
+    console.log('4. 不能导出未声明的变量：');
+    console.log('---');
+    console.log('// ❌ 错误');
+    console.log('export { undeclaredVar };  // ReferenceError');
+    console.log('');
+    console.log('// ✓ 正确');
+    console.log('const declaredVar = 42;');
+    console.log('export { declaredVar };');
+    console.log('---\n');
+}
+// #endregion
+function runAllExportExamples() {
+    console.log(`
+${'='.repeat(50)}
+运行所有示例
+${'='.repeat(50)}
+`);
+    demonstrateNamedExports();
+    console.log('\n' + '-'.repeat(50) + '\n');
+    demonstrateDefaultExport();
+    console.log('\n' + '-'.repeat(50) + '\n');
+    demonstrateMixedExports();
+    console.log('\n' + '-'.repeat(50) + '\n');
+    demonstrateReExports();
+    console.log('\n' + '-'.repeat(50) + '\n');
+    demonstrateAggregateExports();
+    console.log('\n' + '-'.repeat(50) + '\n');
+    exportCaveats();
+    console.log('\n' + '='.repeat(50));
+}
+// 主函数：根据参数运行指定示例
+if (require.main === module) {
+    const args = process.argv.slice(2);
+    const exampleNum = args[0] ? parseInt(args[0]) : 0;
+    const examples = [
+        { name: '所有示例', fn: runAllExportExamples },
+        { name: '命名导出', fn: demonstrateNamedExports },
+        { name: '默认导出', fn: demonstrateDefaultExport },
+        { name: '混合导出', fn: demonstrateMixedExports },
+        { name: '重导出', fn: demonstrateReExports },
+        { name: '聚合导出模式', fn: demonstrateAggregateExports },
+        { name: '导出的注意事项', fn: exportCaveats }
+    ];
+    if (exampleNum === 0) {
+        runAllExportExamples();
+    }
+    else if (exampleNum > 0 && exampleNum < examples.length) {
+        console.log(`\n运行示例 ${exampleNum}: ${examples[exampleNum].name}\n`);
+        console.log('='.repeat(50));
+        examples[exampleNum].fn();
+        console.log('='.repeat(50));
+    }
+    else {
+        console.log(`可用的示例：
+${examples.slice(1).map((ex, idx) => `  ${idx + 1}. ${ex.name}`).join('\n')}
+
+使用方法: ts-node 02-导出语法.ts [示例编号]`);
+    }
+}