02_Node.js模块化

news2025/1/16 17:08:58

02_Node.js模块化

知识点自测

  1. 以下代码运行的结果是多少？

    const arr = [10, 20, 30]
const result = arr.map(val => val + 1).reduce((sum, val) => sum += val, 0)
console.log(result)

    A：60

    B：63

    <details><summary>答案</summary><ul><li>B选项正确</li></ul></details>

  1. 以下代码运行的结果是多少？

    const obj = { username: 'itheima', password: '777777' }
const { uname } = obj
console.log(uname)

    A：itheima

    B：undefined

    <details><summary>答案</summary><ul><li>A选项正确</li></ul></details>

01.模块化简介

目标

了解模块化概念和好处，以及 CommonJS 标准语法导出和导入

讲解

  1. 在 Node.js 中每个文件都被当做是一个独立的模块，模块内定义的变量和函数都是独立作用域的，因为 Node.js 在执行模块代码时，将使用如下所示的函数封装器对其进行封装

  2. 而且项目是由多个模块组成的，每个模块之间都是独立的，而且提高模块代码复用性，按需加载，独立作用域

  3. 但是因为模块内的属性和函数都是私有的，如果对外使用，需要使用标准语法导出和导入才可以，而这个标准叫 CommonJS 标准，接下来我们在一个需求中，体验下模块化导出和导入语法的使用

  4. 需求：定义 utils.js 模块，封装基地址和求数组总和的函数，导入到 index.js 使用查看效果

  5. 导出语法：

    module.exports = {
  对外属性名: 模块内私有变量
}

  6. 导入语法：

    const 变量名 = require('模块名或路径')
// Node.js 环境内置模块直接写模块名（例如：fs，path，http）
// 自定义模块：写模块文件路径（例如：./utils.js)

    变量名的值接收的就是目标模块导出的对象

  7. 代码实现

    • utils.js：导出

      /**
 * 目标：基于 CommonJS 标准语法，封装属性和方法并导出
 */
const baseURL = 'http://hmajax.itheima.net'
const getArraySum = arr => arr.reduce((sum, item) => sum += item, 0)
​
// 导出
module.exports = {
  url: baseURL,
  arraySum: getArraySum
}

    • index.js：导入使用

      /**
 * 目标：基于 CommonJS 标准语法，导入工具属性和方法使用
 */
// 导入
const obj = require('./utils.js')
console.log(obj)
const result = obj.arraySum([5, 1, 2, 3])
console.log(result)

小结

  1. Node.js 中什么是模块化?

    <details><summary>答案</summary><ul><li>每个文件都是独立的模块</li></ul></details>

  2. 模块之间如何联系呢?

    <details><summary>答案</summary><ul><li>使用特定语法，导出和导入使用</li></ul></details>

  3. CommonJS 标准规定如何导出和导入模块?

    <details><summary>答案</summary><ul><li>导出：module.exports = {},导入：require('模块名或路径')</li></ul></details>

  4. 模块名/路径如何选择?

    <details><summary>答案</summary><ul><li>内置模块：写名字。例如：fs，path，http等。自定义模块：写模块文件路径，例如：./utils.js</li></ul></details>

02.ECMAScript标准-默认导出和导入

目标

掌握 ECMAScript 标准语法中，默认导出和导入的使用

讲解

  1. CommonJS 规范是 Node.js 环境中默认的，后来官方推出 ECMAScript 标准语法，我们接下来在一个需求中，体验下这个标准中默认导出和导入的语法要如何使用

  2. 需求：封装并导出基地址和求数组元素和的函数，导入到 index.js 使用查看效果

  3. 导出语法：

    export default {
  对外属性名: 模块内私有变量
}

  4. 导入语法：

    import 变量名 from '模块名或路径'

    变量名的值接收的就是目标模块导出的对象

  1. 注意：Node.js 默认只支持 CommonJS 标准语法，如果想要在当前项目环境下使用 ECMAScript 标准语法，请新建 package.json 文件设置 type: 'module' 来进行设置

    { “type”: "module" }

  1. 代码实现：

    • utils.js：导出

      /**
 * 目标：基于 ECMAScript 标准语法，封装属性和方法并"默认"导出
 */
const baseURL = 'http://hmajax.itheima.net'
const getArraySum = arr => arr.reduce((sum, item) => sum += item, 0)
​
// 默认导出
export default {
  url: baseURL,
  arraySum: getArraySum
}

    • index.js：导入

      /**
 * 目标：基于 ECMAScript 标准语法，"默认"导入，工具属性和方法使用
 */
// 默认导入
import obj from './utils.js'
console.log(obj)
const result = obj.arraySum([10, 20, 30])
console.log(result)

小结

  1. ECMAScript 标准规定如何默认导出和导入模块?

    <details><summary>答案</summary><ul><li>导出：export default {} 导入：import 变量名 from '模块名或路径'</li></ul></details>

  2. 如何让 Node.js 切换模块标准为 ECMAScript？

    <details><summary>答案</summary><ul><li>运行模块所在文件夹，新建 package.json 并设置 {“type”：“module”}</li></ul></details>

03.ECMAScript标准-命名导出和导入

目标

掌握 ECMAScript 标准语法中，命名导出和导入的使用

讲解

  1. ECMAScript 标准的语法有很多，常用的就是默认和命名导出和导入，这节课我们来学习下命名导出和导入的使用

  2. 需求：封装并导出基地址和数组求和函数，导入到 index.js 使用查看效果

  3. 命名导出语法：

    export 修饰定义语句

  4. 命名导入语法：

    import { 同名变量 } from '模块名或路径'

    注意：同名变量指的是模块内导出的变量名

  5. 代码示例：

    • utils.js 导出

      /**
 * 目标：基于 ECMAScript 标准语法，封装属性和方法并"命名"导出
 */
export const baseURL = 'http://hmajax.itheima.net'
export const getArraySum = arr => arr.reduce((sum, item) => sum += item, 0)
​

    • index.js 导入

      /**
 * 目标：基于 ECMAScript 标准语法，"命名"导入，工具属性和方法使用
 */
// 命名导入
import {baseURL, getArraySum} from './utils.js'
console.log(obj)
console.log(baseURL)
console.log(getArraySum)
const result = getArraySum([10, 21, 33])
console.log(result)

  6. 与默认导出如何选择：

    • 按需加载，使用命名导出和导入

    • 全部加载，使用默认导出和导入

小结

  1. Node.js 支持哪 2 种模块化标准?

    <details><summary>答案</summary><ul><li>CommonJS 标准语法（默认）</li><li>ECMAScript 标准语法</li></ul></details>

  2. ECMAScript 标准，命名导出和导入的语法?

    <details><summary>答案</summary><ul><li>导出：export 修饰定义的语句，import { 同名变量 } from '模块名或路径'</li></ul></details>

  3. ECMAScript 标准，默认导出和导入的语法？

    <details><summary>答案</summary><ul><li>导出：export default {} 导入：import 变量名 from '模块名或路径'</li></ul></details>

04.包的概念

目标

了解 Node.js 环境中包的概念

讲解

  1. 包：将模块，代码，其他资料整合成一个文件夹，这个文件夹就叫包

  2. 包分类：

    • 项目包：主要用于编写项目和业务逻辑

    • 软件包：封装工具和方法进行使用

  3. 包要求：根目录中，必须有 package.json 文件（记录包的清单信息）

  4. 包使用：在引入一个包文件夹到代码中，默认引入的是包文件节下的 index.js 模块文件里导出的对象，如果没有 index.js 文件，则会引入 package.json 里 main 属性指定的文件模块导出的对象

  5. 需求：封装数组求和函数的模块，封装判断用户名和密码长度函数的模块，形成一个软件包，并导入到 index.js 中使用查看效果

  6. 代码示例：

    • utils/lib 相关代码在素材里准备好了，只需要自己在 utils/index.js 统一出口进行导出

      /**
 * 本文件是，utils 工具包的唯一出口
 * 作用：把所有工具模块方法集中起来，统一向外暴露
 */
const { getArraySum } = require('./lib/arr.js')
const { checkUser, checkPwd } = require('./lib/str.js')
​
// 统一导出所有函数
module.exports = {
  getArraySum,
  checkUser,
  checkPwd
}
      ​

    • index.js 导入软件包文件夹使用（注意：这次导入的是包文件夹，不是模块文件）

      /**
 * 目标：导入 utils 软件包，使用里面封装的工具函数
 */
const obj = require('./utils')
console.log(obj)
const result = obj.getArraySum([10, 20, 30])
console.log(result)

小结

  1. 什么是包?

    <details><summary>答案</summary><ul><li>将模块，代码，其他资料聚合成的文件夹</li></ul></details>

  2. 包分为哪 2 类呢?

    <details><summary>答案</summary><ul><li>项目包：编写项目代码的文件夹，软件包：封装工具和方法供开发者使用</li></ul></details>

  3. package.json 文件的作用?

    <details><summary>答案</summary><ul><li>记录软件包的名字，作者，入口文件等信息</li></ul></details>

  4. 导入一个包文件夹的时候，导入的是哪个文件?

    <details><summary>答案</summary><ul><li>默认 index.js 文件，或者 main 属性指定的文件</li></ul></details>

05.npm软件包管理器

目标

掌握使用 npm 管理软件包

讲解

  1. npm 简介链接： 软件包管理器，用于下载和管理 Node.js 环境中的软件包

  2. npm 使用步骤：

    1. 初始化清单文件： npm init -y （得到 package.json 文件，有则跳过此命令）

      注意 -y 就是所有选项用默认值，所在文件夹不要有中文/特殊符号，建议英文和数字组成，因为 npm 包名限制建议用英文和数字或者下划线中划线

    2. 下载软件包：npm i 软件包名称

    3. 使用软件包

  3. 需求：使用 npm 下载 dayjs 软件包到本地项目文件夹中，引入到 index.js 中格式化日期打印，运行观察效果

  4. 具体使用流程图：

小结

  1. npm 软件包管理器作用？

    <details><summary>答案</summary><ul><li>下载软件包以及管理版本</li></ul></details>

  2. 初始化项目清单文件 package.json 命令?

    <details><summary>答案</summary><ul><li>npm init -y</li></ul></details>

  3. 下载软件包的命令？

    <details><summary>答案</summary><ul><li>npm i 软件包名字</li></ul></details>

  4. 下载的包会存放在哪里?

    <details><summary>答案</summary><ul><li>当前项目下的 node_modules 中，并记录在 package.json 中</li></ul></details>

06.npm安装所有依赖

目标

掌握 npm 安装所有依赖功能

讲解

  1. 我们拿到了一个别人编写的项目，但是没有 node_modules，项目能否正确运行？

    不能，因为缺少了项目需要的依赖软件包，比如要使用 dayjs 和 lodash 但是你项目里没有这个对应的源码，项目会报错的

  2. 为何没有给我 node_modules？

    因为每个人在自己的本机使用 npm 下载，要比磁盘间传递要快（npm 有缓存在本机）

  3. 如何得到需要的所有依赖软件包呢？

    直接在项目目录下，运行终端命令：npm i 即可安装 package.json 里记录的所有包和对应版本到本项目中的 node_modules

  1. 需求：请在准备好的素材项目中，安装项目所有需要的依赖软件包，并运行 index.js 代码看是否正常！

小结

  1. 当前项目中只有 package.json 没有 node_modules 怎么办?

    <details><summary>答案</summary><ul><li>当前项目目录下，打开终端，执行 npm i 安装所有依赖软件包</li></ul></details>

  2. 为什么 node_modules 不进行传递?

    <details><summary>答案</summary><ul><li>因为用 npm 下载有缓存在本机，比磁盘之间传递要快</li></ul></details>

07.npm全局软件包-nodemon

目标

掌握本地软件包和全局软件包区别，体验 nodemon 的使用

讲解

  1. 软件包区别：

    • 本地软件包：当前项目内使用，<span style="color: red;">封装属性和方法</span>，存在于 node_modules

    • 全局软件包：本机所有项目使用，<span style="color: red;">封装命令和工具</span>，存在于系统设置的位置

  1. nodemon 作用：替代 node 命令，检测代码更改，自动重启程序

  2. 使用：

    1. 安装：npm i nodemon -g （-g 代表安装到全局环境中）

    2. 运行：nodemon 待执行的目标 js 文件

  3. 需求：使用 nodemon 命令来启动素材里准备好的项目，然后修改代码保存后，观察终端重启应用程序

小结

  1. 本地软件包和全局软件包区别?

    <details><summary>答案</summary><ul><li>本地软件包，作用在当前项目，封装属性和方法</li><li>全局软件包，本地所有项目使用，封装命令和工具</li></ul></details>

  2. nodemon 作用?

    <details><summary>答案</summary><ul><li>替代 node 命令，检测代码更改，自动重启程序</li></ul></details>

  3. nodemon 怎么用?

    <details><summary>答案</summary><ul><li>先确保安装 npm i nodemon -g</li><li>使用 nodemon 执行目标 js 文件</li></ul></details>

08.Node.js概念和常用命令总结

目标

把上面学的模块化语法，包的概念，常用命令进行总结

讲解

  1. Node.js 模块化：把每个文件当做一个模块，独立作用域，按需加载，使用特定标准语法导出和导入使用

    CommonJS 标准：一般应用在 Node.js 项目环境中

    ECMAScript 标准：一般应用在前端工程化项目中

  1. Node.js 包：把模块文件，代码文件，其他资料聚合成一个文件夹就是包

    项目包：编写项目需求和业务逻辑的文件夹

    软件包：封装工具和方法进行使用的文件夹（一般使用 npm 管理）

    • 本地软件包：作用在当前项目，封装的属性/方法，供项目调用编写业务需求

    • 全局软件包：作用在所有项目，一般封装的命令/工具，支撑项目运行

  1. Node.js 常用命令：

小结

  1. 安装本地软件包的命令是什么？

    <details><summary>答案</summary><ul><li>npm i 软件包名</li></ul></details>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/2256574.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

故障识别 | GADF-CNN-SSA-XGBoost数据分类预测/故障识别（Matlab）

故障识别 | GADF-CNN-SSA-XGBoost数据分类预测/故障识别（Matlab）

故障识别 | GADF-CNN-SSA-XGBoost数据分类预测/故障识别&#xff08;Matlab&#xff09; 目录 故障识别 | GADF-CNN-SSA-XGBoost数据分类预测/故障识别&#xff08;Matlab&#xff09;分类效果基本描述程序设计参考资料 分类效果 基本描述 格拉姆角场差&#xff08;GADF&#…
阅读更多...
OPenCV 图片局部放大

OPenCV 图片局部放大

m_image cv::imread("C:/Code/JPG/1.jpg");if (m_image.empty()) return;cv::imshow("原始图像", m_image); // TODO: 在此添加控件通知处理程序代码int width m_image.cols;int height m_image.rows;// 确定要放大的区域&#xff08;这里是图像中心部分…
阅读更多...
【C++】变长参数

【C++】变长参数

文章目录 1. 定义&#xff1a;2. C代码示例:2.1 实现方式一&#xff1a;2.2 实现方式二&#xff1a;2.3 实现方式三&#xff1a; 3. 总结3.1 使用...语法&#xff1a;3.2 使用 std::initializer_list3.3 使用变长模板参数&#xff08;Variadic Templates&#xff09; 1. 定义&a…
阅读更多...
内网穿透 natapp安装与使用

内网穿透 natapp安装与使用

前言 NATAPP是一款基于ngrok的内网穿透工具。以下是对NATAPP的详细概述&#xff1a; 基本概念 定义&#xff1a;内网穿透&#xff08;NAT穿透&#xff09;是一种技术&#xff0c;它允许具有特定源IP地址和端口号的数据包能够绕过NAT设备&#xff0c;从而被正确地路由到内网主机…
阅读更多...
TPAMI 2023：When Object Detection Meets Knowledge Distillation: A Survey

TPAMI 2023：When Object Detection Meets Knowledge Distillation: A Survey

摘要 目标检测&#xff08;Object Detection&#xff0c;OD&#xff09;是计算机视觉中的一项关键任务&#xff0c;多年来涌现出了众多算法和模型。尽管当前 OD 模型的性能有所提升&#xff0c;但它们也变得更加复杂&#xff0c;由于参数规模庞大&#xff0c;在工业应用中并不…
阅读更多...
怎么样能使Ubuntu的文件浏览器显示当前目录的路径，而不是只显示一个文件名？

怎么样能使Ubuntu的文件浏览器显示当前目录的路径，而不是只显示一个文件名？

默认情况下Ubuntu的文件浏览器是只显示当前目录的目录名的&#xff0c;这很不便我们查看路径或直接利用路径进行定位&#xff0c;那么怎么样能使Ubuntu的文件浏览器显示当前目录的路径呢&#xff1f; 两种方法&#xff1a; 第1种-临时方法 按下快捷键 Ctrl L&#xff0c;导航…
阅读更多...
Uniapp Android SpringBoot3 对接支付宝支付（最新教程附源码）

Uniapp Android SpringBoot3 对接支付宝支付（最新教程附源码）

Uniapp Android SpringBoot3 对接支付宝支付&#xff08;最新教程附源码&#xff09; 1、效果展示2、后端实现2.1 引入支付宝SDK依赖 pom.xml2.2 配置 application.yml2.3 支付宝相关代码2.3.1 AlipayConfig.java2.3.2 ZfbPayConfig.java2.3.3 支付接口2.3.4 支付回调处理接口&…
阅读更多...
阿里云ECS服务器域名解析

阿里云ECS服务器域名解析

阿里云ECS服务器域名解析&#xff0c;以前添加两条A记录类型&#xff0c;主机记录分别为www和&#xff0c;这2条记录都解析到服务器IP地址。 1.进入阿里云域名控制台&#xff0c;找到域名 ->“解析设置”->“添加记录” 2.添加一条记录类型为A,主机记录为www&#xff0c…
阅读更多...
【MySQL】mysql服务器架构

【MySQL】mysql服务器架构

目录 1、背景2、mysql服务器架构解释3、总结 1、背景 简单理解一下mysql的服务器架构。 2、mysql服务器架构解释 mysql的架构图如下&#xff1a; 主要分为三部分&#xff1a;客户端、服务端、存储引擎。接下来我们来解释一下各个部分&#xff1a; 客户端 用来连接mysql服务…
阅读更多...
BERT模型的输出格式探究以及提取出BERT 模型的CLS表示，last_hidden_state[:, 0, :]用于提取每个句子的CLS向量表示

BERT模型的输出格式探究以及提取出BERT 模型的CLS表示，last_hidden_state[:, 0, :]用于提取每个句子的CLS向量表示

说在前面 最近使用自己的数据集对bert-base-uncased进行了二次预训练&#xff0c;只使用了MLM任务&#xff0c;发现在加载训练好的模型进行输出CLS表示用于下游任务时&#xff0c;同一个句子的输出CLS表示都不一样&#xff0c;并且控制台输出以下警告信息。说是没有这些权重。…
阅读更多...
基于LSTM的A股股票价格预测系统(torch) ：从数据获取到模型训练的完整实现

基于LSTM的A股股票价格预测系统(torch) ：从数据获取到模型训练的完整实现

1. 项目简介 本文介绍了一个使用LSTM&#xff08;长短期记忆网络&#xff09;进行股票价格预测的完整系统。该系统使用Python实现&#xff0c;集成了数据获取、预处理、模型训练和预测等功能。 这个代码使用的是 LSTM (Long Short-Term Memory) 模型&#xff0c;这是一种特殊的…
阅读更多...
【ArcGIS微课1000例】0134：ArcGIS Earth实现二维建筑物的三维完美显示

【ArcGIS微课1000例】0134：ArcGIS Earth实现二维建筑物的三维完美显示

文章目录 一、加载数据二、三维显示三、三维符号化一、加载数据 加载配套实验数据（0134.rar中的建筑物，2d或3d都可以），方法如下：点击添加按钮。 点击【Add Files】，在弹出的Open对话框中，选择建筑物，点击确定，完成添加。 默认二维显示： 二、三维显示 右键建筑物图层…
阅读更多...
汽车EEA架构:发展历程

汽车EEA架构:发展历程

1.发展历程的基本逻辑 汽车电子电气的发展历程中&#xff0c;其使用的基本逻辑是IPO(Input-Processing-Output)模型&#xff0c;如下图1所示&#xff1a; 图 1 那什么是IPO模型了&#xff1f;我们从控制器的原理入手解释IPO模型,控制器的主要用途如下&#xff1a; 根据给定的逻…
阅读更多...
python拆分Excel文件

python拆分Excel文件

按Sheet拆分Excel 或 按照某一列的不同值拆分Excel。文档样式如下&#xff1a; 结果&#xff1a;红色是按照Sheet名拆出的&#xff0c;蓝色和橙色是某个Sheet按照某列的不同值拆分的。 代码&#xff1a; # -*- coding: utf-8 -*- """ 拆分excel文件——按照…
阅读更多...
存内架构IR-DROP问题详解-电容电导补偿

存内架构IR-DROP问题详解-电容电导补偿

一、总述 电容、电导补偿作为大规模数字电路的关键设计理念&#xff0c;是 CIM 架构优化的核心技术。在 CIM 中&#xff0c;平衡电容或电导并实现计算的精准映射&#xff0c;对能效提升和计算精度保障具有关键作用。本文基于近期文献探讨电容、电导补偿在 CIM 中的具体补偿策…
阅读更多...
汽车网络安全 -- IDPS如何帮助OEM保证车辆全生命周期的信息安全

汽车网络安全 -- IDPS如何帮助OEM保证车辆全生命周期的信息安全

目录 1.强标的另一层解读 2.什么是IDPS 2.1 IDPS技术要点 2.2 车辆IDPS系统示例 3.车辆纵深防御架构 4.小结 1.强标的另一层解读 在最近发布的国家汽车安全强标《GB 44495》，在7.2节明确提出了12条关于通信安全的要求，分别涉及到车辆与车辆制造商云平台通信、车辆与车辆…
阅读更多...
【数字化】华为企业数字化转型-认知篇

【数字化】华为企业数字化转型-认知篇

导读&#xff1a;企业数字化转型的必要性在于&#xff0c;它能够帮助企业适应数字化时代的需求&#xff0c;提升运营效率&#xff0c;创新业务模式&#xff0c;增强客户互动&#xff0c;从而在激烈的市场竞争中保持领先地位并实现可持续发展。通过学习华为企业数字化转型相关理…
阅读更多...
用C#开发程序进行ASCII艺术制作

用C#开发程序进行ASCII艺术制作

我一直很喜欢 ASCII 艺术&#xff0c;而我对制作 ASCII 艺术的热情促使我探索 .NET 框架中的 GDI。在本文中&#xff0c; 我将向您展示如何通过三个简单的步骤从 JPEG/Bitmap 图像生成 ASCII 艺术。 1、加载并调整图像大小。 2、读取每个像素&#xff0c;获取其颜色并将其转换…
阅读更多...
第23周：机器学习及文献阅读

第23周：机器学习及文献阅读

目录 摘要 Abstract 一、理论知识 1、逻辑提升 2、分类任务 3、10倍交叉验证法 二、文献阅读 1、模型方法——MLT &#xff08;1&#xff09;特征选择 &#xff08;2&#xff09;决策树剪枝 2、分类任务——逻辑回归 3、实验部分 数据集的选取 代码实践 模型…
阅读更多...
2020年国赛高教杯数学建模E题校园供水系统智能管理解题全过程文档及程序

2020年国赛高教杯数学建模E题校园供水系统智能管理解题全过程文档及程序

2020年国赛高教杯数学建模 E题 校园供水系统智能管理 原题再现 校园供水系统是校园公用设施的重要组成部分&#xff0c;学校为了保障校园供水系统的正常运行需要投入大量的人力、物力和财力。随着科学技术的发展&#xff0c;校园内已经普遍使用了智能水表&#xff0c;从而可以…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023