Node.js---模块化

zidea

 关注

阅读 74

2022-01-08

模块化

模块化是指解决一个复杂问题时，自顶向下逐层把系统划分成若干模块的过程。对于整个系统来说，模块是可组合、分解和更换的单元。
把代码进行模块化拆分的好处：

  • 提高了代码的复用性
  • 提高了代码的可维护性
  • 可以实现按需加载

一、Node.js 中的模块化

1、Node.js 中模块的分类

Node.js 中根据模块来源的不同，将模块分为了 3 大类，分别是：

  • 内置模块（内置模块是由 Node.js 官方提供的，例如 fs、path、http 等）
  • 自定义模块（用户创建的每个 .js 文件，都是自定义模块）
  • 第三方模块（由第三方开发出来的模块，并非官方提供的内置模块，也不是用户创建的自定义模块，使用前需要先下载）

2、加载模块

        使用强大的 require() 方法，可以加载需要的内置模块、用户自定义模块、第三方模块进行使用。例如：

//加载内置的fs模块
const fs = require('fs')

//加载用户的自定义模块
const custom = require(./custom.js)

//加载第三方模块
const moment = require('moment')

注意：使用 require() 方法加载其它模块时，会执行被加载模块中的代码。
例如，现在有两个文件，一个是m1.js,里面的内容是:

//这是一个用户自定义模块
console.log('用户自定义模块')

还有一个文件是test.js,现在我们在test.js文件中，通过调用m1.js里面的内容，并将其打印：

const m1 = require('./m1')
console.log(m1)

打印的结果为：
在这里插入图片描述

3、 Node.js 中的模块作用域

        和函数作用域类似，在自定义模块中定义的变量、方法等成员，只能在当前模块内被访问，这种模块级别的访问限制，叫做模块作用域。
        例如，现在有两个文件，一个是m2.js,一个是test2.js，在m2.js里面定义一个常量和一个函数：

//在模块作用域中定义常量username
const username = '王欢'
//在模块作用域中定义函数sayHello
function sayHello(){
	console.log('我是'+username)

在test2.js文件中导入m2.js中的内容：

const m2 = require(./m2.js)
console.log(m2)

打印结果为一个空对象

因为在test2.js模块中，无法访问m2.js中的私有成员。

4、向外共享模块作用域中的成员

如果我们想要向外共享模块作用域中的成员，就需要用到module对象。

1、 module 对象

        在每个 .js 自定义模块中都有一个 module 对象，它里面存储了和当前模块有关的信息，打印如下：

console.log(module)

在这里插入图片描述
可以发现里面有很多属性，其中
（1）path属性是指当前模块存放的路径；
（2）filename属性是指当前模块的路径及完整的名称。
（3）exports属性是一个空对象。我们可以通过该属性将向外共享成员。

2、module.exports 对象

        在自定义模块中，可以使用 module.exports 对象，将模块内的成员共享出去，供外界使用。
        外界用 require() 方法导入自定义模块时，得到的就是 module.exports 所指向的对象。
        例如定义两个模块，一个是自定义模块.js,用来存放信息，因为module.exports的值默认是一个空对象，所以我们可以像该对象上挂载属性和方法，如下：

module.exports.userName = '王欢';
module.exports.sayHello = function(){
    console.log('你好啊')
}
module.exports = {
    name:'小熊',
    sex:'女',
    age:18,
    sayHi() {
        console.log('你好啊王欢')
    }
}

一个是test1.js模块，用来导入自定义模块.js的内容：

const m = require('./自定义模块')
console.log(m)

最终打印的结果为：
在这里插入图片描述
导入成功。
        需要注意的是：使用 require() 方法导入模块时，导入的结果，永远以 module.exports 指向的对象为准。
        举个例子：有两个模块，一个001.js模块用来存放数据，如下：

//向module.exports对象上挂载属性和方法
module.exports.username = '王欢';
module.exports.sayHello = function(){
    console.log('今天在好好刷题')
}
//让module.exports指向一个全新的对象
module.exports = {
    name:'小熊',
    sayHi(){
        console.log('今天有好好学习')
    }
}

t1.js模块用来导入前一个模块的数据:

const t1 = require('./001.js')
console.log(t1)

最终打印的结果为：
在这里插入图片描述
可以发现导出的内容是module.exports指向的全新的对象。

3、exports 对象

        由于 module.exports 单词写起来比较复杂，为了简化向外共享成员的代码，Node 提供了 exports 对象。默认情况下，exports 和 module.exports 指向同一个对象。
那么它们两个是否相等呢？进行判断：

console.log(module.exports)
console.log(exports)
console.log(module.exports === exports)

在这里插入图片描述
        可知，他们是相等的。但是最终共享的结果，还是以 module.exports 指向的对象为准。
        我们现在就通过 exports 属性来挂载对象。定义两个模块，一个是003.js,用来存放信息，如下：

exports.username = '王欢';
exports.sayHello = function(){
    console.log('今天在好好刷题')
}

在定义一个t3.js来导入003.js的内容：

const t3 = require('./003')
console.log(t3)

最终打印结果为：
在这里插入图片描述

4、exports 和 module.exports 的使用误区

创建一个两个模块，一个004.js模块用来存放数据，如下：

exports.username = '王欢';
exports.age = 18;
module.exports = {
    name:'小熊',
    sex:'女'
}

一个t4.js模块用来导入前一个模块的数据:

const t4 = require('./004')
console.log(t4)

输出的结果为：
在这里插入图片描述
可以发现，最终输出的是module.exports挂载的对象，为什么会这样呢？如下图所示：因为使用require() 模块导入时，得到的永远是 module.exports 指向的对象。
在这里插入图片描述

5、Node.js 中的模块化规范

        Node.js 遵循了 CommonJS 模块化规范，CommonJS 规定了模块的特性和各模块之间如何相互依赖。
CommonJS 规定：

  • 每个模块内部，module 变量代表当前模块。
  • module 变量是一个对象，它的 exports 属性（即 module.exports）是对外的接口。
  • 加载某个模块，其实是加载该模块的 module.exports 属性。require() 方法用于加载模块。

二、npm与包

1、包

        Node.js 中的第三方模块又叫做包。不同于 Node.js 中的内置模块与自定义模块，包是由第三方个人或团队开发出来的，免费供所有人使用。由于 Node.js 的内置模块仅提供了一些底层的 API，导致在基于内置模块进行项目开发的时，效率很低。包是基于内置模块封装出来的，提供了更高级、更方便的 API，极大的提高了开发效率。
        国外有一家 IT 公司，叫做 npm, Inc. 这家公司旗下有一个非常著名的网站： https://www.npmjs.com/ ，它是全球最大的包共享平台，我们可以在里面搜索我们需要的包。该公司还提供了一个地址为 https://registry.npmjs.org/ 的服务器，来对外共享所有的包，我们可以从这个服务器上下载自己所需要的包。同时还提供了一个包管理工具，我们可以使用这个包管理工具，从 https://registry.npmjs.org/ 服务器把需要的包下载到本地使用。这个包管理工具的名字叫做 Node Package Manager（简称 npm 包管理工具），这个包管理工具随着 Node.js 的安装包一起被安装到了用户的电脑上。
        我们可以在终端中执行 npm -v 命令，来查看自己电脑上所安装的 npm 包管理工具的版本，如下：
在这里插入图片描述

2、格式化时间

1、格式化时间的传统做法

实现步骤为：

  • 创建格式化时间的自定义模块
  • 定义格式化时间的方法
  • 创建补零函数
  • 从自定义模块中导出格式化时间的函数
  • 导入格式化时间的自定义模块
  • 调用格式化时间的函数

实现代码为：

//定义格式化时间的方法
function dataFormat(dtStr){
    const dt = new Date(dtStr);
    const y = dt.getFullYear()
    const m = padZero(dt.getMonth()+1)
    const d = padZero(dt.getDate())
    const hh = padZero(dt.getHours())
    const mm = padZero(dt.getMinutes())
    const ss = padZero(dt.getSeconds())
    return `${y}-${m}-${d} ${hh}:${mm}:${ss}`
}
//定义补零操作
function padZero(n){
    return n > 9 ? n : n+'0';
}

const m = require('./dataFormat')
// console.log(m)
const dt = new Date();
const times = m.dataFormat(dt)
console.log(times)

打印结果为;
在这里插入图片描述

2、格式化时间的高级做法

实现步骤为;

  • 使用 npm 包管理工具，在项目中安装格式化时间的包 moment
  • 使用 require() 导入格式化时间的包
  • 对时间进行格式化

实现代码为 ：

const moment = require('moment')
const time = moment().format('YYYY-MM-DD HH:mm:ss')
console.log(time)

打印结果为：
在这里插入图片描述

3、在项目中安装包的命令

如果想在项目中安装指定名称的包，需要运行如下的命令：

npm install 包的完整名称

上述的装包命令，可以简写成如下格式：

npm i 包的完整名称

比如在项目中安装moment的包，我们需要在终端输入：

npm i moment

运行完成后，可以得到：
在这里插入图片描述
        并且可以发现初次装包完成后，在项目文件夹下多一个叫做 node_modules 的文件夹和 package-lock.json 的配置文件。
在这里插入图片描述
其中：
（1）node_modules 文件夹用来存放所有已安装到项目中的包。require() 导入第三方包时，就是从这个目录中查找并加载包。
（2）package-lock.json 配置文件用来记录 node_modules 目录下的每一个包的下载信息，例如包的名字、版本号、下载地址等。
在这里插入图片描述

1、安装指定版本的包

        默认情况下，使用 npm install 命令安装包的时候，会自动安装最新版本的包。如果需要安装指定版本的包，可以在包名之后，通过 @ 符号指定具体的版本，例如：

npm i moment@2.22.2

意思就是安装版本号为2.22.2的moment包。

2、包的语义化版本规范

包的版本号是以“点分十进制”形式进行定义的，总共有三位数字，例如 2.24.0
其中每一位数字所代表的的含义如下：

  • 第1位数字：大版本
  • 第2位数字：功能版本
  • 第3位数字：Bug修复版本

版本号提升的规则：只要前面的版本号增长了，则后面的版本号归零。

4、包管理配置文件

        npm 规定，在项目根目录中，必须提供一个叫做 package.json 的包管理配置文件。用来记录与项目有关的一些配置信息。例如：

  • 项目的名称、版本号、描述等
  • 项目中都用到了哪些包
  • 哪些包只在开发期间会用到
  • 那些包在开发和部署时都需要用到

1、快速创建 package.json

        在项目根目录中，创建一个叫做 package.json 的配置文件，即可用来记录项目中安装了哪些包。
npm 包管理工具提供了一个快捷命令，可以在执行命令时所处的目录中，快速创建 package.json 这个包管理配置文件：

//在执行命令所处的目录中，快速创建 package.json文件
npm init -y

需要注意的是：
（1）上述命令只能在英文的目录下成功运行！
（2）运行 npm install 命令安装包的时候，npm 包管理工具会自动把包的名称和版本号，记录到 package.json 中。
如下：
在这里插入图片描述

2、 dependencies 节点

        上述创建的package.json 文件中，有一个 dependencies 节点，专门用来记录使用 npm install 命令安装了哪些包。
比如我们现在安装一个moment包：
在这里插入图片描述
创建完成后，点开package.json文件，可以发现多了一个dependencies 节点：
在这里插入图片描述
        里面存储的就是我们所创建的包的名称和版本号。同样的，我们也可以一次创建多个包，如下：
在这里插入图片描述
此时，package.json文件中的内容为：
在这里插入图片描述
可知，将我们两个包的信息都成功添加。

3、一次性安装所有的包

        当我们拿到一个剔除了 node_modules 的项目之后，需要先把所有的包下载到项目中，才能将项目运行起来。否则就会报错。
        比如我们将前面安装的moment包在node_modules 的项目中删除后，在运行格式化时间的案例的代码时，会发现运行错误：
在这里插入图片描述
        此时我们据可以一次性安装所有的包，即运行 npm install 命令（或 npm i）一次性安装所有的依赖包：

npm install

        该指令的作用是：npm包管理工具会先读取package.json中的dependencies节点，读取到记录的所有依赖包名称和版本号后，npm包管理工具会把这些包一次性下载到项目中。
在安装了所有包后在执行代码，可以得到：
在这里插入图片描述

4、卸载包

可以运行 npm uninstall 命令，来卸载指定的包：

npm uninstall

注意：npm uninstall 命令执行成功后，会把卸载的包，自动从 package.json 的 dependencies 中移除掉。
例如，我们卸载前面创建的jquery包：

npm uninstall jquery

在这里插入图片描述
在检查 package.json文件：
在这里插入图片描述
可以发现该文件中的jquery包的信息已经被删除掉。

5、devDependencies 节点

         如果某些包只在项目开发阶段会用到，在项目上线之后不会用到，则建议把这些包记录到 devDependencies 节点中。与之对应的，如果某些包在开发和项目上线之后都需要用到，则建议把这些包记录到 dependencies 节点中。
可以使用如下的命令，将包记录到 devDependencies 节点中：

//安装指定的包，并记录到devDependencies节点中
npm i 包含 -D
//完整的写法为：
npm install 包含 --save-dev

比如我们现在将webpack包安装到 devDependencies 节点中：

npm i webpack -D

在这里插入图片描述
        在 package.json文件中，我们可以看到 devDependencies 节点中多了webpack的相关信息：
在这里插入图片描述

5、解决下包速度慢的问题

        在使用 npm 下包的时候，默认从国外的 https://registry.npmjs.org/ 服务器进行下载，此时，网络数据的传输需要经过漫长的海底光缆，因此下包速度会很慢。

1、淘宝 NPM 镜像服务器

        淘宝在国内搭建了一个服务器，专门把国外官方服务器上的包同步到国内的服务器，然后在国内提供下包的服务。从而极大的提高了下包的速度。
在这里插入图片描述

2、切换 npm 的下包镜像源

下包的镜像源，指的就是下包的服务器地址。
（1）查看当前的下包镜像源

npm config get registry

如下：
在这里插入图片描述

（2）将下包的镜像源切换为淘宝镜像源

npm config set registry=https://registry.npm.taobao.org/

如下：
在这里插入图片描述

（3）检查镜像源是否下载成功

npm config get registry

如下：
在这里插入图片描述
切换成功。

3、 nrm

        为了更方便的切换下包的镜像源，我们可以安装 nrm 这个小工具，利用 nrm 提供的终端命令，可以快速查看和切换下包的镜像源。
（1）通过npm包管理器，将nrm安装为全局可用的工具

npm i nrm -g

如下：
在这里插入图片描述
创建成功。

（2）查看所有可用的镜像源

nrm ls

如下：
在这里插入图片描述
        可以看到有很多不同的镜像源。如果我们需要切换到对应的镜像源，就可以直接输入前面的名称。

（3）将下包的镜像源切换为taobao镜像

nrm use taobao

如下：
在这里插入图片描述
应用成功。

6、包的分类

使用 npm 包管理工具下载的包，共分为两大类，分别是：

  • 项目包
  • 全局包

1、项目包

         那些被安装到项目的 node_modules 目录中的包，都是项目包。
项目包又分为两类，分别是：

  • 开发依赖包（被记录到 devDependencies 节点中的包，只在开发期间会用到）
  • 核心依赖包（被记录到 dependencies 节点中的包，在开发期间和项目上线之后都会用到）
npm i 包含-D #开发依赖包（会被记录到 devDependencies 节点下）
npm i 包含   #核心依赖包（会被记录到 dependencies 节点下）

2、全局包

         在执行 npm install 命令时，如果提供了 -g 参数，则会把包安装为全局包。
         全局包会被安装到 C:\Users\用户目录\AppData\Roaming\npm\node_modules 目录下。如下：
在这里插入图片描述
如果想要卸载全局包，则执行的代码为：

npm uninstall 包含 -g   # 卸载全局安装的包

需要注意的是：只有工具性质的包，才有全局安装的必要性。

3、i5ting_toc

        i5ting_toc 是一个可以把 md 文档转为 html 页面的小工具，使用步骤如下：
（1）将i5ting_toc安装为全局包

npm install -g i5ting_toc

如下：
在这里插入图片描述

(2)调用i5ting_toc，轻松实现md转html的功能

i5ting_toc -f 要转换的md文件路径

先指定位置到素材所在的文件下，并实现转换
在这里插入图片描述
转换效果为：
在这里插入图片描述

三、模块的加载机制

1、 优先从缓存中加载

        模块在第一次加载后会被缓存。 这也意味着多次调用 require() 不会导致模块的代码被执行多次。
        例如我们定义两个模块，一个002.js模块用来存放数据，一个test1.js用来用来导入002.js模块的数据，我们在002.js模块中写入：

console.log('王欢有在好好学习！')

在test1.js模块三次导入002.js`模块的内容;

require('./002')
require('./002')
require('./002')

最终输出的结果为:
在这里插入图片描述
        发现我们导入了三次数据，但是最终只打印了依次，这是因为：在第一次调用require时就将数据缓存了，所以后面两次在导入数据时，并没有真正被执行，

2、内置模块的加载机制

        内置模块是由 Node.js 官方提供的模块，内置模块的加载优先级最高。
例如，require('fs') 始终返回内置的 fs 模块，即使在 node_modules 目录下有名字相同的包也叫做 fs。

3、自定义模块的加载机制

        使用 require() 加载自定义模块时，必须指定以 ./ 或 ../ 开头的路径标识符。在加载自定义模块时，如果没有指定 ./ 或 ../ 这样的路径标识符，则 node 会把它当作内置模块或第三方模块进行加载。
例如我们将上面的test1.js模块的第一个导入的 ./去掉，就会发现：
在这里插入图片描述
导出失败。
        同时，在使用 require() 导入自定义模块时，如果省略了文件的扩展名，则 Node.js 会按顺序分别尝试加载以下的文件：
（1）按照确切的文件名进行加载
（2）补全 .js 扩展名进行加载
（3）补全 .json 扩展名进行加载
（4）补全 .node 扩展名进行加载
（5）加载失败，终端报错
例如：我们新建几个文件，分别为：
在这里插入图片描述
在里面分别写入如下数据：
在这里插入图片描述

在新建一个模块003.js,用来导入数据：

const m = require('./test')
console.log(m)

输出的结果为：
在这里插入图片描述
如果我们将test3模块删除，会执行：
在这里插入图片描述
再将test.js文件删除，则：
在这里插入图片描述
再将test.json文件删除，则有：
在这里插入图片描述
虽然报错了，但是仍然是以test3.node方式运行。
再将test3.node删除，则：
在这里插入图片描述
程序报错。

4、第三方模块的加载机制

        如果传递给 require() 的模块标识符不是一个内置模块，也没有以 ‘./’ 或 ‘../’ 开头，则 Node.js 会从当前模块的父目录开始，尝试从 /node_modules 文件夹中加载第三方模块。
如果没有找到对应的第三方模块，则移动到再上一层父目录中，进行加载，直到文件系统的根目录。
例如，假设在 'C:\Users\itheima\project\foo.js' 文件里调用了 require('tools')，则 Node.js 会按以下顺序查找：
C:\Users\itheima\project\node_modules\tools
C:\Users\itheima\node_modules\tools
C:\Users\node_modules\tools
C:\node_modules\tools

5、目录作为模块

        当把目录作为模块标识符，传递给 require() 进行加载的时候，有三种加载方式：
（1）在被加载的目录下查找一个叫做 package.json 的文件，并寻找 main 属性，作为 require() 加载的入口
（2）如果目录里没有 package.json 文件，或者 main 入口不存在或无法解析，则 Node.js 将会试图加载目录下的 index.js 文件。
（3）如果以上两步都失败了，则 Node.js 会在终端打印错误消息，报告模块的缺失：Error: Cannot find module 'xxx'
        例如创建一个testm的文件夹，在该文件夹创建一个package.json文件，一个a.js文件，一个index.js文件。在这里插入图片描述
并在文件夹外面创建一个test4.js文件用于测试。各部分里面的内容为：
在这里插入图片描述

测试结果如下：
在这里插入图片描述
如果将package.json文件删除，则有：
在这里插入图片描述
        即如果目录里没有 package.json 文件，或者 main 入口不存在或无法解析，则 Node.js 将会试图加载目录下的 index.js 文件。

相关推荐

Node.js---内置模块

千行 80 0 0

Node.js--模块化

素锦时年_1b00 78 0 0

【Node.js】模块化

豆丁趣 22 0 0

Node.js -- 模块化

架构大数据双料架构师 26 0 0

Node.js------模块化

一枚路过的程序猿 18 0 0

Node.js模块化教程

探头的新芽 224 0 0

Node.js-模块化（二）

双井暮色 31 0 0

【Node.js】module 模块化

野见 34 0 0

Node.js 模块化原理探究

无愠色 80 0 0

模块化的基本概念丨Node.js模块化

香小蕉 133 0 0

精彩评论（0）

0 0 举报