Node_JS 2-01_05模块化

早期的网页中没有一个实质的模块化规范

我们实现模块化的方式，就是最初的通过script标签来引入js文件

问题：1、无法选择要引入模块的哪些内容

2、在复杂的模块场景下非常容易出错

...

于是，我们急需在js中引入一个模块化的解决方案

---

在node中，默认支持的模块化规范叫CommonJS

在CommonJS中，一个js文件就是一个模块

---

CommonJS规范

引入模块：使用require()函数来引入模块

引入自定义模块时：模块名要以./或../开头 、扩展名可以省略

在CommonJS中，如果省略了js文件的扩展名，node会自动为文件补全扩展名

注： ./m1.js 如果没有js 会寻找./m1.json

引入核心模块：直接写核心模块名字，也可也在核心模块前添加 node：

const m1 = require("./m1")
const path=require("node:path")
const m2 = require("./m2.cjs")
const hello = require("./hello") // ./hello/index.js

---

原理：所有的CommonJS的模块都会被包装到一个函数中

        (function(exports, require, module, __filename, __dirname){ })

__filename表示当前模块的绝对路径

console.log(__filename);

当前模块所在目录的路径

console.log(__dirname);

---

模块化

m3.js

module.exports = {
    name:"孙悟空",
    age:18,
    gender:"男"
}

模块化.js

const { name, age, gender } = require("./m3")
console.log(name, age, gender);

输出结果：
孙悟空 18 男

---

默认情况下，node中模块化标准是CommonJS

要想使用ES的模块化，可以采用以下两种：

            1、使用mjs作为扩展名

            2、修改package.json将模块化规范设置为ES模块

当我们设置了"type":"module" 当前项目下所有的js文件都默认为es module

---

m4.js

// 向外部导出内容
export let a = 10
export const b = "孙悟空"
export const c = { name: "猪八戒" }

// 设置默认导出 一个模块中只能有一个默认导出
// export default function sum(a, b) {
//     return a + b
// }

let d = 20
export default d

导入m4模块，es模块不能省略扩展名（官方标准）

import { a, b, c } from "./m4.mjs"
console.log(m4.c);

通过as来指定别名

import { a, b as hello, c } from "./m4.mjs"
console.log(m4.c);

开发时尽量避免import * 的情况

import * as m4 from "./m4.mjs"
console.log(m4.c);

导入模块的默认导出，默认导出的内容，可以随意命名

import sum, { a, b, c } from "./m4.mjs"
console.log(sum, a);

通过ES模块化，导入的内容都是常量，es模块都是运行在严格模式下的

ES模块化，在浏览器中同样支持，但是通常不会直接使用，都会结合打包工具使用

import { a, b, c } from "./m4.mjs"
console.log(a);

c.name="沙和尚"
console.log(c);

---

核心模块，是node中自带的模块，可以在node中直接使用

window 是浏览器的宿主对象，node中没有

globle 是node中的全局对象，作用类似于window

ES标准下，全局对象的标准名应该是 globalThis

console.log(globalThis);

---

核心模块

process：表示当前node进程，通过该对象可以获取进程的信息，或者对进程做各种操作

如何使用：1、process 是一个全局变量，可以直接使用

2、有哪些属性和方法：

process.exit()：结束当前进程,终止node

process.nextTick(callback[,...args])：将函数插入到 tick队列中

tick队列中的代码，会在下一次事件循环之前执行，在微任务队列和宏任务队列中的任务之前执行

执行顺序：调用栈、tick队列、微任务队列、 宏任务队列

setTimeout(()=>{
    console.log(1); //宏任务队列
})

queueMicrotask(()=>{
    console.log(2); //微任务队列
})

process.nextTick(()=>{
    console.log(3); //tick队列
})

console.log(4); // 调用栈

---