Node.js 学习

news2024/11/15 22:34:55

目录

1.Node.js入门

1.1 什么是 Node.js

1.2 fs模块-读写文件

1.3 path模块-路径处理

1.4 案例-压缩前端html

1.5 认识URL中的端口号

1.6 http模块-创建Web服务

1.7 案例-浏览时钟

2.Node.js 模块化

2.1 模块化简介

2.1.1 什么是模块化？

2.1.2 CommonJS 标准导出和导入（默认）

2.2 ECMAScript标准-默认导出和导入

2.3 ECMAScript标准-命名导出和导入

2.4 包的概念

2.5 npm软件包管理器

2.6 npm安装所有依赖

2.7 npm全局软件包-nodemon

2.8 Node.js总结

1.Node.js入门

1.1 什么是 Node.js

定义：Node.js 是一个开放源代码的服务器平台，用于在服务器中执行JavaScript代码。它通常运行在服务器上而不是浏览器中。

作用：使用 Node.js 编写服务器端程序
  • ✓ 编写数据接口，提供网页资源浏览功能等等
  • ✓ 前端工程化：为后续学习 Vue 和 React 等框架做铺垫

Node.js 为何能执行 JS？

原理：Node.js 是建立在 Google 的 V8 JavaScript 引擎之上，这意味着它可以运行JavaScript代码而无需在浏览器中。这意味着开发者可以使用Javascript来编写服务器端代码，从而在客户端和服务器端都使用同一种语言和同一种编程范式，简化了开发和测试工作。

浏览器和Node.js的区别：都支持 ECMAScript 标准语法，Node.js 有独立的 API

 

可以看到Node.js，没有浏览器的BOM和DOM

如何使用 Node.js？
需求：新建 JS 文件，并编写代码后，在 node 环境下执行
命令：在 VSCode 集成终端中，输入 node xxx.js，回车即可执行

1.2 fs模块-读写文件

模块：类似插件，封装了 方法/属性
fs 模块：封装了与本机文件系统进行交互的，方法/属性
语法：
  • 1. 加载 fs 模块对象
  • 2. 写入文件内容
  • 3. 读取文件内容

实现：

注意事项：在读取文件时，成功返回的data，这里的data是buffer 16 进制数据流对象，

但是可以通过toString()方法变成字符串。

1.3 path模块-路径处理

问题：Node.js 代码中，相对路径是根据 终端所在路径 来查找的，可能无法找到你想要的文件。

解决方案：

建议：在 Node.js 代码中，使用 绝对路径。
补充：__dirname 内置变量（获取当前模块目录-绝对路径）
✓ windows： D:\备课代码\3-B站课程\03_Node.js与Webpack\03-code\03
✓ mac： /Users/xxx/Desktop/备课代码/3-B站课程/03_Node.js与Webpack/03-code/03
注意： path.join() 会使用特定于平台的分隔符，作为定界符，将所有给定的路径片段连接在一起
语法：
  • 1. 加载 path 模块
  • 2. 使用 path.join 方法，拼接路径

代码：

1.4 案例-压缩前端html

原始：

需求：把 回车符（\r）和换行符（\n）去掉后，写入到新 html 文件中
步骤：
  • 1. 读取源 html 文件内容
  • 2. 正则替换字符串
  • 3. 写入到新的 html 文件中
代码： 
// 案例 - 压缩前端 html
// 需求：把 回车符（\r）和换行符（\n）去掉后，写入到新 html 文件中
// 步骤：
// 1. 读取源 html 文件内容  public/index.html
// 2. 正则替换字符串   String.replace(pattern, replacement)  pattern 可以是正则
// 3. 写入到新的 html 文件中   dist/index.html

const fs = require('fs')
const path = require('path')

fs.readFile(path.join(__dirname, 'public/index.html'), (err, data) => {
    if (err) console.log(err)
    else {
        // 使用正则表达式替换
        const disString = data.toString().replace(/[\r\n]/g, '')
        console.log(disString)
        // 将处理过的文件写到其他位置
        fs.writeFile(path.join(__dirname, 'dist/index.html'), disString, err => {
            if (err) console.log(err)
            else console.log('写入成功')
        })
    }
})

实现后效果：

1.5 认识URL中的端口号

URL： 统一资源定位符，简称网址，用于访问服务器里的资源
端口号：标记服务器里不同功能的 服务程序
端口号范围：0-65535 之间的任意整数

平常我们没加端口号也能访问到数据，是因为 http 协议，默认访问 80 端口。

Web 服务程序 ：用于提供网上信息浏览功能
注意：0-1023 和一些特定端口号被占用，我们自己编写服务程序请避开使用

1.6 http模块-创建Web服务

需求：创建 Web 服务并响应内容给浏览器
步骤：
  • 1. 加载 http 模块，创建 Web 服务对象
  • 2. 监听 request 请求事件，设置响应头和响应体
  • 3. 配置端口号并启动 Web 服务
  • 4. 浏览器请求 http://localhost:3000 测试
  • （localhost：固定代表本机的域名）

代码：

// 需求：创建 Web 服务并响应内容给浏览器
// 步骤：
// 1. 加载 http 模块，创建 Web 服务对象
// 2. 监听 request 请求事件，设置响应头和响应体
// 3. 配置端口号并启动 Web 服务
// 4. 浏览器请求 http://localhost:3000 测试
// （localhost：固定代表本机的域名）

// 加载 http 模块，创建 Web 服务对象
const http = require('http')
const server = http.createServer()
// 监听 request 请求事件，设置响应头和响应体
server.on('request', (req, res) => {
    // 设置text/plain;charset=utf-8 , 请求体才可以显示中文
    res.setHeader('Content-Type', 'text/plain;charset=utf-8')
    // 请求体
    res.end('欢迎使用node.js 和 http模块创建的 Web 服务')
})

// 配置端口号并启动 Web 服务
server.listen(3000, () => {
    console.log('Web 启动成功')
    
})

1.7 案例-浏览时钟

需求：基于 Web 服务，开发提供 网页资源 的功能。
浏览时钟

步骤：
  • 1. 基于 http 模块，创建 Web 服务
  • 2. 使用 req.url 获取请求资源路径，判断并读取 index.html 里字符串内容返回给请求方
  • 3. 其他路径，暂时返回不存在的提示
  • 4. 运行 Web 服务，用浏览器发起请求测试 http://localhost:8080/index.html

代码：

/**
 * 目标：基于 Web 服务，开发提供网页资源的功能
 * 步骤：
 *  1. 基于 http 模块，创建 Web 服务
 *  2. 使用 req.url 获取请求资源路径，并读取 index.html 里字符串内容返回给请求方
 *  3. 其他路径，暂时返回不存在提示
 *  4. 运行 Web 服务，用浏览器发起请求
 */

// 1. 基于 http 模块，创建 Web 服务
const http = require('http')
const server = http.createServer()
const fs = require('fs')
const path = require('path')
const { error, log } = require('console')

// 2. 使用 req.url 获取请求资源路径，并读取 index.html 里字符串内容返回给请求方
server.on('request', (req, res) => {
  // req.url得到的是资源路径
  if (req.url === '/index.html') {
    fs.readFile(path.join(__dirname, 'dist/index.html'), (error, data) => {
      if (error) console.log(error)
      else {
        const resource = data.toString()
        res.setHeader('Content-Type', 'text/html;charset=utf-8')
        res.end(resource)
      }
    })
  } else {
    // 3. 其他路径，暂时返回不存在提示
    res.setHeader('Content-Type', 'text/html;charset=utf-8')
    res.end('不存在提示')
  }
})

// 4. 运行 Web 服务，用浏览器发起请求
server.listen(8080, () => {
  console.log('Web 服务启动成功')

})

2.Node.js 模块化

2.1 模块化简介

2.1.1 什么是模块化？

定义：在Node.js中，每个文件都被视为一个单独的模块。

概念：项目是由很多个模块文件组成的
好处：提高代码复用性，按需加载， 独立作用域

使用：需要标准语法导出和导入进行使用。

2.1.2 CommonJS 标准导出和导入（默认）

使用：
  • 1. 导出：module.exports = {}
  • 2. 导入：require('模块名或路径')
模块名或路径：
  • ✓ 内置模块：直接写名字（例如：fs，path，http）
  • ✓ 自定义模块：写模块文件路径（例如：./utils.js）

演示：

2.2 ECMAScript标准-默认导出和导入

默认标准使用：
  • 1. 导出：export default {}
  • 2. 导入：import 变量名 from '模块名或路径'
     

这里的变量名就是export default 里面的对象。 

注意事项： Node.js 默认支持 CommonJS 标准语法
如需使用 ECMAScript 标准语法，在运行模块所在文件夹新建 package.json 文件，
并设置 { "type" : "module" }

2.3 ECMAScript标准-命名导出和导入

命名标准使用：
  • 1. 导出：export 修饰定义语句
  • 2. 导入：import { 同名变量 } from '模块名或路径‘
如何选择：
  • 按需加载，使用命名导出和导入
  • 全部加载，使用默认导出和导入

2.4 包的概念

包：将 模块，代码，其他资料 聚合成一个文件夹。
包分类：
  • ✓ 项目包：主要用于编写项目和业务逻辑
  • ✓ 软件包：封装工具和方法进行使用

要求：根目录中，必须有 package.json 文件（记录包的清单信息）
package.json 文件的作用？
        ➢ 记录 软件包的名字 ，作者， 入口 文件等信息
注意：导入软件包时，引入的默认是 index.js 模块文件 / main 属性指定的模块文件
需求：封装数组求和函数的模块，判断用户名和密码长度函数的模块，形成成一个 软件包。
分析执行过程：
lib文件夹下的 js 都是封装了属性和方法，方便开发者调用，但是该软件包引入时只会去访问该包的 （ 默认是 index.js 模块文件 / main 属性指定的模块文件 ），该文件为唯一入口，因此需要把所有封装的再封装一遍，提供调用者使用。

演示：

2.5 npm软件包管理器

定义 ： npm（“Node Package Manager” 的缩写）是Node.js 标准的软件包管理器，用来下载和管
理Node.js包依赖。

使用：
  • 1. 初始化清单文件 ：npm init -y（得到 package.json 文件，有则略过此命令）
    • package.json 是 Node.js 项目的核心文件，它包含了项目的元数据、依赖项、脚本等重要信息。
  • 2. 下载软件包 ：npm i 软件包名称
  • 3. 使用软件包

npm - 安装所有依赖

原理：

引入软件包： const dayjs = require("dayjs");

 

2.6 npm安装所有依赖

问题：项目中不包含 node_modules，能否正常运行？
答案：不能，缺少依赖的本地软件包（里面包含引入软件包的源码）
问题：为什么一般拷贝别人的项目是很多都没有  node_modules 文件？
原因：因为，自己用 npm 下载依赖比磁盘传递拷贝要快得多
解决：项目终端输入命令： npm i   ，因为   package.json 存在软件包以及版本，因此可以恢复
node_modules 文件。

2.7 npm全局软件包-nodemon

软件包区别：
  • ➢ 本地软件包：当前项目内使用，封装属性和方法，存在于 node_modules
  • ➢ 全局软件包：本机所有项目使用，封装命令和工具，存在于系统设置的位置
nodemon 作用：替代 node 命令，检测代码更改，自动重启程序

使用：
  • 1. 安装：npm i nodemon -g（-g 代表安装到全局环境中）
  • 2. 运行：nodemon 待执行的目标 js 文件

2.8 Node.js总结

Node.js 包：
概念：把模块文件，代码文件，其他资料聚合成一个文件夹
项目包：编写项目需求和 业务逻辑 的文件夹
软件包： 封装工具和方法 进行使用的文件夹（一般使用 npm 管理）
  • ✓ 本地软件包：作用在当前项目，一般封装的属性/方法，供项目调用编写业务需求
  • ✓ 全局软件包：作用在所有项目，一般封装的命令/工具，支撑项目运行

常用命令：

​​​​​​​

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

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

相关文章

C++_类和对象（中、下篇）—— const成员函数、取地址运算符的重载、深入构造函数、类型转换、static成员、友元

C++_类和对象（中、下篇）—— const成员函数、取地址运算符的重载、深入构造函数、类型转换、static成员、友元

目录 三、类和对象（中） 6、取地址运算符重载 1、const成员函数 2、取地址运算符的重载 四、类和对象（下） 1、深入构造函数 2、类型转换 3、static成员 4、友元 三、类和对象（中） 6、取地址运算…
阅读更多...
从数据仓库到数据中台再到数据飞轮：我了解的数据技术进化史

从数据仓库到数据中台再到数据飞轮：我了解的数据技术进化史

这里写目录标题 前言数据仓库：数据整合的起点数据中台：数据共享的桥梁数据飞轮：业务与数据的双向驱动结语 前言 在当今这个数据驱动的时代，企业发展离不开对数据的深度挖掘和高效利用。从最初的数据仓库，到后来的数据…
阅读更多...
docker可视化管理工具推荐！docker.ui

docker可视化管理工具推荐！docker.ui

正式介绍之前，可以看下这款工具的截图，开源地址在文末提供： docker.ui：一个可视化的docker管理工具 docker是一个开源的容器平台，可以让开发者和运维人员快速地构建、运行和部署应用。 docker的优势在于它可以实现应…
阅读更多...
Cpp类和对象(上)(3)

Cpp类和对象(上)(3)

文章目录 前言一、面向过程与面向对象初步认识二、类的引入三、类的定义四、类的访问限定符及类的封装类的访问限定符类的封装 五、类的作用域(类域)六、类的实例化七、类对象模型如何计算类对象的大小类对象的存储方式猜测 八、this指针this指针的引出this指针的特性 九、C语言…
阅读更多...
dcmtk在MWLSCP会忽略对于字符集的匹配

dcmtk在MWLSCP会忽略对于字符集的匹配

版本信息 dcmtk v3.6.4 2018-11-29 发现的原因 在我将dcmtk的wlmscpfs当作MWLSCP使用的时候，我在SCU端为了防止过来的数据中存在不识别的字符集，对于收到的数据数据进行了字符集的过滤，但是发现过滤没有生效。 确保数据源 首先需要确认数…
阅读更多...
pywebview 中错误使用async

pywebview 中错误使用async

错误代码 正确示例 完整代码 前端代码 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>pywebview …
阅读更多...
哈希表数据结构学习

哈希表数据结构学习

哈希表数据结构学习 哈希表基本概念哈希方法单值哈希与多值哈希哈希冲突1. 开放寻址法&#xff08;Open Addressing&#xff09;2. 链地址法&#xff08;Chaining&#xff09;3. 再哈希法&#xff08;Rehashing&#xff09;4. 建立公共溢出区&#xff08;Overflow Area&#xf…
阅读更多...
OpenHarmony（鸿蒙南向开发）——标准系统方案之瑞芯微RK3568移植案例(下)

OpenHarmony（鸿蒙南向开发）——标准系统方案之瑞芯微RK3568移植案例(下)

往期知识点记录&#xff1a; OpenHarmony&#xff08;鸿蒙南向开发&#xff09;——轻量系统STM32F407芯片移植案例 OpenHarmony&#xff08;鸿蒙南向开发&#xff09;——Combo解决方案之W800芯片移植案例 OpenHarmony&#xff08;鸿蒙南向开发&#xff09;——小型系统STM32M…
阅读更多...
『功能项目』窗口可拖拽脚本【59】

『功能项目』窗口可拖拽脚本【59】

本章项目成果展示 我们打开上一篇58第三职业弓弩的平A的项目&#xff0c; 本章要做的事情是给坐骑界面挂载一个脚本让其显示出来的时候可以进行拖拽 创建脚本&#xff1a;DraggableWindow.cs using UnityEngine; using UnityEngine.EventSystems; public class DraggableWindo…
阅读更多...
使用three.js+vue3完成无人机上下运动

使用three.js+vue3完成无人机上下运动

效果图如上 代码&#xff1a; <template><div class"drones"><div ref"dronesContainer" class"drones-container"></div></div></template><script setup>import { ref, onMounted, onUnmounted, …
阅读更多...
性能再升级，华为Mate 70 Pro曝光，设计新颖且配置遥遥领先

性能再升级，华为Mate 70 Pro曝光，设计新颖且配置遥遥领先

在智能手机市场竞争日益激烈的今天&#xff0c;各大厂商都在努力提升自家产品的性能和设计。 华为作为中国领先的手机品牌&#xff0c;一直备受关注。 近日&#xff0c;有关华为Mate 70 Pro的曝光信息引发了广泛关注&#xff0c;据悉&#xff0c;这款新机将在性能、设计和配置…
阅读更多...
vue和thinkphp路由伪静态配置

vue和thinkphp路由伪静态配置

vue路由伪静态配置&#xff1a; location / { try_files $uri $uri/ /index.html; } thinkphp 路由伪静态配置 location ~* (runtime|application)/{ return 403; } location / { if (!-e $request_filename){ rewrite ^(.*)$ /index.php?s$1 last; break; } }
阅读更多...
【Java】基础语法介绍

【Java】基础语法介绍

目录 一、注释 二、标识符与关键字 三、输入和输出 3.1 输出 3.2 输入 四、数据类型 3.1 基本数据类型 3.2 引用数据类型 3.3 var关键字 五、运算符 六、分支和循环 5.1 分支 5.2 循环 七、类和对象 6.1 类的定义与对象的创建 6.2 空对象 6.3 类的属性 6.4 类…
阅读更多...
优化下载性能：使用Python多线程与异步并发提升下载效率

优化下载性能：使用Python多线程与异步并发提升下载效率

文章目录 📖 介绍 📖🏡 演示环境 🏡📒 文章内容 📒📝 普通请求下载📝 使用多线程加速下载📝 使用异步编程加速下载📝 总结 📝⚓️ 相关链接 ⚓️📖 介绍 📖 你是否因为下载速度慢而感到焦虑？特别是在下载大型文件时，等待进度条慢慢移动的感觉真的很…
阅读更多...
【Head-DETR系列（7）】DETR 代码分析

【Head-DETR系列（7）】DETR 代码分析

在nuscens数据集上&#xff0c; Results and Models BackboneModelLr schdMem (GB)Inf time (fps)box APConfigDownloadR-50DETR150e7.940.1configmodel | log 我们先看检测器 /mmdetection-2.28.2/mmdet/models/detectors/detr.py def forward_train(self,img,img_metas,gt_…
阅读更多...
利基网站收入报告（更新至十月）

利基网站收入报告（更新至十月）

欢迎来到我的利基网站收入报告。这是我揭露当月我所有网站收入情况的地方。目前&#xff0c;我主要专注于一个核心网站&#xff0c;其余的不是重心&#xff0c;有些可能会在不久的将来出售。 为什么我分享我的利基网站收入报告&#xff1f; 需要旧报告&#xff1f; 2023年10月…
阅读更多...
JSON包新提案：用“omitzero”解决编码中的空值困局

JSON包新提案：用“omitzero”解决编码中的空值困局

Go标准库是Go号称“开箱即用”的重要因素&#xff0c;而标准库中的encoding/json包又是标准库最常用的Go包。虽然其性能不是最好的&#xff0c;但好在由Go团队维护&#xff0c;对JSON规范兼容性好&#xff0c;且质量很高。但json包也不是没有“瑕疵”的&#xff0c;Go官方继mat…
阅读更多...
6款SSL证书实用工具，格式转换/CSR生成等全都免费使用！

6款SSL证书实用工具，格式转换/CSR生成等全都免费使用！

俗话说“工欲善其事&#xff0c;必先利其器”&#xff0c;SSL证书作为保护网站数据传输安全的重要部分&#xff0c;我们在申请、签发、部署安装SSL证书的时候&#xff0c;可能会涉及到CSR文件生成、获取证书链、转换证书格式等需求&#xff0c;这时候有对应的工具就可提高工作效…
阅读更多...
基于SpringBoot的考研助手系统+LW参考示例

基于SpringBoot的考研助手系统+LW参考示例

系列文章目录 1.基于SSM的洗衣房管理系统原生微信小程序LW参考示例 2.基于SpringBoot的宠物摄影网站管理系统LW参考示例 3.基于SpringBootVue的企业人事管理系统LW参考示例 4.基于SSM的高校实验室管理系统LW参考示例 5.基于SpringBoot的二手数码回收系统原生微信小程序LW参考示…
阅读更多...
干货| Python代码性能优化总结

干货| Python代码性能优化总结

代码优化原则 本文会介绍不少的 Python 代码加速运行的技巧。在深入代码优化细节之前&#xff0c;需要了解一些代码优化基本原则。 这里插播一条粉丝福利&#xff0c;如果你正在学习Python或者有计划学习Python&#xff0c;想要突破自我&#xff0c;对未来十分迷茫的&#xf…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023