Node.js入门笔记(包含源代码)以及详细解析

这篇具有很好参考价值的文章主要介绍了Node.js入门笔记(包含源代码)以及详细解析。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

Node.js 入门笔记源码

01、如何在终端中执行js 文件

  • 目标:将下面的代码语句在中断中执行

    • 代码演示:
`console.log('Hello World')

for (let i = 0;i < 3;i++) {

  console.log(6)

}`
  • 方法:在文件上右击打开在终端中执行,然后输入node空格 输入需要执行的文件名字
02、基于 fs 模块读写文件内容
  • 目标:使用fs模代码操作文件在终端中的读写操作

  • + 1、加载 fs 模块对象

    • 2、写入文件内容-----》writeFile文件中没有文件会自动帮我们创建
    • 3、读取文件
    • 代码演示:

@@

// 1、加载 fs 模块对象
const fs = require('fs')

// 2、写入文件内容
    // 2.1:test.txt为文件路径名字
    // 2.2:写入的内容
    // 2.3:回调函数,返回错误打印出来, 否则成功
fs.writeFile('test.txt','Hello World',(err) => {
    if(err) console.log(err)
    else console.log('写入成功')
})


// 3、读取文件
fs.readFile('test.txt',(err,data) => {
    if (err) console.log(err)
    // else console.log(data)      //<Buffer 48 65 6c 6c 6f 20 57 6f 72 6c 64>
    else console.log(data.toString())  //toString() 转为字符串形式
})
  • 执行结果为:

    写入成功
    Hello World

03、path模块-路径问题

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

  • 因此,建议在Node.js代码中,使用绝对路径(也就是需要在终端执行的代码内容)

  • __dirname 内置变量 (动态获取当前模块目录-绝对路径

    **path.join()**会使用特定于平台的分隔符,作为定界符,将所有给定的路径片段连接在一起

语法:1.加载path模块

​ 2.使用path.join(__dirname, 目标文件的路径)方法,拼接路径

  • 代码演示
  • 错误例子
//1、 引入 fs 模块  通过终端读取文件内容
// const fs = require('fs')
// fs.readFile('test.txt',(err,data) => {
//     if (err) console.log(err)
//     else console.log(data.toString())  //执行成功,将十六进制转换为字符串形式返回结果
// })
// 这里使用相对路径就发生报错error

  • 正确示例
  • path.join()方法里面,第一个参数就是__dirname 当前所在文件的文件夹地址(终端的位置) ,第二个就是目标文件的路径
// 2、解决方式:只有采用绝对路径
        // 1、引入 fs 模块
        const fs = require('fs')
        // 2、引入 path 模块对象
        const path = require('path')
        // 3、调用path.join()方法  配合 __dirname  组成目标文件的绝对路径
        console.log(__dirname)
        fs.readFile(path.join(__dirname,'../test.txt'),(err,data) => {
            if (err) console.log(err)
            else console.log(data.toString())
        })

04、基于node.js 压缩前端文件
  • 目标:把回车符(\r) 和 换行符(\n)去掉后,写入到新html文件中。

实现方法:

  1. 读取源html文件内容

    • 源html文件 === (public文件夹下面的index.html文件) 未经过压缩的源代码
  2. 正则替换字符串

  3. 写入到新的html文件中

    • 新的html文件 === (dist文件夹下面的index.html文件) 经过node使用正则压缩后的代码
// 读取public文件夹里面的前端源代码
// 1.引入读取模块fs
const fs = require('fs')
// 2.拼接路径获取绝对路径
const path = require('path')
// 3、 __dirname当前文件夹所在的地址   进行查找文件
fs.readFile(path.join(__dirname,'public/index.html'),(err,data) => {
  if (err) console.log(err)
  else {
    // 4、将返回的内容转为字符串显示
    const htmlStr = data.toString()

    // 5、进行字符串替换 正则查找全局
    // replace()是一个字符串方法,用于将指定的字符或子串替换为新的字符或子串。
    const resultStr = htmlStr.replace(/[\r\n]/g,'')
    console.log(resultStr)
    // 6、写入到新的  html 文件中
    fs.writeFile(path.join(__dirname,'dist/index.html'),resultStr,err => {})   //writeFile文件中没有文件会自动帮我们创建
    if (err) console.log(err)
    else {
      console.log('写入成功')
    }
  }
})
05、URL中的端口号

1.URL:简称网址,用于访问服务器里的资源

2. http://hmajax.itheima.net:80/api/province ==> 这里面:80就是 端口号

3.端口号范围:0~65535之间的任意整数 端口号默认为:80(注意1023之前的端口号是特定的被系统占用不可使用)

06、http模块-创建Web服务
  • 实现步骤:

    1、加载http模块,创建Web服务对象

    2、监听require请求事件,设置响应头和响应体

    3、配置端口号并启动Web服务

    4、浏览器请求 http://localhost:3000则是我们的创建的web服务对象

  • 代码示例
// 1、加载http模块,创建Web服务对象
const http = require('http')
const server = http.createServer()//调用http里面的方法
// 2、监听require请求事件,设置响应头和响应体
server.on('request',(req,res) => {
    // 设置响应头-内容类型-普通文本以及中文编码格式
    res.setHeader('Content-Type','text/plain;charset=utf-8')  //这里都是固定的内容类型
    // 设置响应体内容,结束本次请求与相应
    res.end('欢迎使用 Node.js 和 http 模块创建的 Web服务')
})

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

  • 代码详细说明

    • 这段代码是使用Node.js的http模块创建一个简单的Web服务,以下是对代码的逐行解释:

      1. 第一行代码const http = require('http'),加载了Node.js的http模块,并将其赋值给变量http,以便后续使用该模块提供的功能。
      2. 第二行代码const server = http.createServer(),调用http模块中的createServer()方法创建一个HTTP服务器对象,并将其赋值给变量server。此时的服务器对象还没有进行具体的请求处理配置。
      3. 第四行代码server.on('request', (req, res) => { ... }),通过server对象的on方法监听request事件,该事件会在有客户端请求到达服务器时触发。回调函数接收两个参数:req表示请求对象,res表示响应对象。
      4. 在回调函数中,通过res.setHeader('Content-Type', 'text/plain;charset=utf-8')设置响应头,将内容类型设为普通文本以及中文编码格式。
      5. 接着,通过res.end('欢迎使用 Node.js 和 http 模块创建的 Web服务')设置响应体内容,并结束本次请求与相应。
      6. 最后一行代码server.listen(3000, () => { ... }),通过server对象的listen方法配置服务器监听的端口号为3000,并启动Web服务。当服务器成功启动后,回调函数会被执行,输出一条信息表示服务器启动成功。

      综上,这段代码创建了一个简单的Web服务,监听在本地主机的3000端口上。当有请求到达时,会返回固定的欢迎消息。你可以通过访问http://localhost:3000来查看Web服务的响应。

07、基于Web服务,开发提供网页资源的功能

基于Web服务,开发提供网页资源的功能

    • 目标:基于 Web 服务,开发提供网页资源的功能
    • 步骤:
      1. 基于 http 模块,创建 Web 服务
      1. 使用 req.url 获取请求资源路径,并读取 index.html 里字符串内容返回给请求方
      1. 其他路径,暂时返回不存在提示
      1. 运行 Web 服务,用浏览器发起请求
  • 代码示例
// 1. 基于 http 模块,创建 Web 服务
const fs = require('fs')
const path = require('path')
const http = require('http')
const server = http.createServer()
server.on('request',(req,res) => {      //req为代表客户端发送的HTTP请求对象。res为代表服务端发送的HTTP响应对象
  // 2、使用 req.url 获取请求资源路径,并读取 index.html 里字符串内容返回给请求方
  if (req.url === '/index.html')  {
    fs.readFile(path.join(__dirname,'dist/index.html'),(err,data) => {
      if (err) console.log(err)
      else {
        // 设置响应内容的类型为html超文本字符串 ,让浏览器解析成标签网页等
        res.setHeader('Content-Type','text/html;charset=utf-8')
        res.end(data.toString())
      }
    })
  } else {
    // 3. 其他路径,暂时返回不存在提示
    res.setHeader('Content-Type','text/html;charset=utf-8')
    res.end('你要访问的资源路径不存在')
  }
  
})
server.listen(8080,() => {
  console.log('Web 服务启动成功')
})

代码解析

  • 这段代码的详细原理如下:

    1. 首先,引入了httpfspath模块,并通过http.createServer()创建了一个HTTP服务器对象,并将其赋值给server变量。同时,使用server.on('request', (req, res) => { ... })监听request事件,传入回调函数处理请求。
    2. 在回调函数中,首先通过req.url获取到客户端请求的资源路径。如果资源路径为/index.html,则进入条件判断块。
    3. 在条件判断块中,使用fs.readFile()方法读取指定路径下的index.html文件内容。其中,通过path.join(__dirname, 'dist/index.html')构建出index.html的完整路径。在回调函数中,判断是否有读取错误,若有错误则输出错误信息;若没有错误,则设置响应头的Content-Typetext/html;charset=utf-8,表示响应内容类型为HTML文档,然后通过res.end(data.toString())将读取到的文件内容作为响应体发送给客户端。
    4. 如果资源路径不是/index.html,则执行默认的else分支,设置响应头的Content-Typetext/html;charset=utf-8,并通过res.end('你要访问的资源路径不存在')返回一个提示消息给客户端。
    5. 最后,通过server.listen(8080, () => { ... })配置服务器监听的端口号为8080,并在服务器成功启动后输出一条提示信息。

    总结来说,这段代码创建了一个简单的HTTP服务器,当客户端请求的资源路径为/index.html时,会读取指定路径下的index.html文件内容并返回给客户端,否则返回一个资源不存在的提示消息。通过监听request事件和处理回调函数,实现了对不同请求路径的处理和响应。最后,通过server.listen()方法指定监听的端口号,并在服务器成功启动后输出启动成功的提示信息。

  • 关于request监听函数中的req和res的详细解释

    • 在Node.js的http模块中,reqres是通常用于表示HTTP请求对象和HTTP响应对象的变量名。

      • req(或者常见的缩写)是request的缩写,代表客户端发送的HTTP请求对象。它包含了与请求相关的各种信息,如请求方法、URL、请求头、请求参数等。通过req对象,我们可以获取和解析客户端发送的请求数据,以便在服务器端进行处理和响应。
      • res(或者常见的缩写)是response的缩写,代表服务端发送的HTTP响应对象。它用于设置和发送服务端的响应给客户端。通过res对象,我们可以设置响应的状态码、响应头、响应体内容等。最终,将响应发送给客户端,完成HTTP请求-响应周期。

      在HTTP请求过程中,客户端发送请求给服务器,服务器接收到请求后创建一个req对象来表示该请求。然后,服务器处理请求并生成相应的内容,将其存放在一个res对象中,并通过网络将res对象发送给客户端。

      所以,reqres分别代表了客户端发送的HTTP请求对象和服务端返回的HTTP响应对象,在开发Web应用时,我们可以使用这两个对象来实现对请求的处理和对响应的配置。文章来源地址https://www.toymoban.com/news/detail-621530.html

到了这里,关于Node.js入门笔记(包含源代码)以及详细解析的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • php 系列题目,包含查看后端源代码

    1.字符串和数字比较,字符串回被转换成数字。 \\\"admin\\\" ==0(true) admin被转换成数字,由于admin是字符串,转换失败,变成0 int(admin)=0,所以比较结果是ture 2.混合字符串转换成数字,看字符串的第一个 “1admin” == 1 ‘’2admin“ == 2  3.字符串开头以xex开头,x代表数字。会被转换成科

    2024年02月11日
    浏览(55)
  • 麻雀算法SSA,优化VMD,适应度函数为最小包络熵,包含MATLAB源代码

    针对大家评论区给出的很多问题,作者一直都有关注,因此在这里又写了一篇文章,而且思路与这篇文章有不同之处,至于具体的不同之处放在下一篇文章了,大家感兴趣的可以移步观看,下一篇文章可以说是 作者的呕心力作。 (4条消息) 白鲸优化算法优化VMD参数,并提取特

    2024年02月09日
    浏览(84)
  • 【区块链 | 智能合约】Ethereum源代码(2)- go-ethereum 客户端入口代码和Node分析

    上篇提到用 make geth 来编译geth客户端。我们来看看make file做了什么: 执行了 ci.go 里面做了两件事情 1,ln -s命令在build/_workspace/ 目录上生成了go-etherum的一个文件镜像,不占用磁盘空间,与源文件同步更新 2

    2024年02月03日
    浏览(42)
  • 【UE Unreal Camera】【保姆级教程二】【包含源代码】手把手教你通过UE获取摄像头帧数据

       【UE Unreal Camera】【保姆级教程二】【包含源代码】手把手教你通过UE获取摄像头帧数据~ c6ebbaddb1aff.png)   在UE 摄像头教程一中,我们已经通过Unreal自带的媒体播放器打开了摄像头,并且将摄像头的数据展示在了游戏画面中。当然这只是最基本的功能,一般情况下,我们

    2024年02月01日
    浏览(54)
  • Java基础阶段项目 ---- 拼图游戏(含讲解以及源代码)

    此项目为java基础的阶段项目,此项目涉及了基础语法,面向对象等知识,具体像语法基础如判断,循环,数组,字符串,集合等…; 面向对象如封装,继承,多态,抽象类,接口,内部类等等…都有涉及。此项目涉及的内容比较多,作为初学者可以很好的将前面的知识串起来。此项目拿来练手以

    2024年02月09日
    浏览(41)
  • 改进的北方苍鹰算法优化VMD参数,最小包络熵、样本熵、信息熵、排列熵(适应度函数可自行选择,一键修改)包含MATLAB源代码...

    今天给大家带来一期由改进的北方苍鹰算法(SCNGO)优化VMD的两个参数。 同样以西储大学数据集为例,选用105.mat中的X105_BA_time.mat数据中1000个数据点。没有数据的看这篇文章。西储大学轴承诊断数据处理,matlab免费代码获取 选取四种适应度函数进行优化,以此确定VMD的最佳k和

    2024年02月15日
    浏览(104)
  • 【计算机视觉】YOLOv8的测试以及训练过程(含源代码)

    YOLOv8是来自Ultralytics的最新的基于YOLO的对象检测模型系列,提供最先进的性能。 利用以前的 YOLO 版本,YOLOv8模型更快、更准确,同时为训练模型提供统一框架,以执行: 物体检测 实例分割 图像分类 Ultralytics为YOLO模型发布了一个全新的存储库。它被构建为 用于训练对象检测

    2024年02月13日
    浏览(43)
  • 【Java项目介绍和界面搭建】拼图小游戏完结——源代码分析以及资料上传

    目录 以后工作的时候拿到一个需求之后: 1,所需要的技术点 2,分析业务逻辑 项目实现步骤: 添加组件 绑定事件: 分析业务逻辑 分析所需要的技术点 在这个界面中,我们需要哪些技术点: 整个的菜单就是JMenuBar 功能,关于我们:JMenu 更换图片:JMenu 重新游戏,重新登录

    2024年03月11日
    浏览(63)
  • FFmpeg的HEVC解码器源代码学习笔记-1

    一直想写一个HEVC的码流解析工具,看了雷神264码流解析工具,本来想尝试模仿写一个相似的265码流分析工具,但是发现265的解码过程和结构体和264的不太一样,很多结构体并没有完全暴露出来,没有想到很好的方法获得量化参数,运动向量等这些信息。想着从头学习一下ff

    2024年02月22日
    浏览(44)
  • 停车共享小程序的+springboot+vue.js附带文章和源代码设计说明文档ppt

    🌞 博主介绍 :✌CSDN特邀作者、985计算机专业毕业、某互联网大厂高级全栈开发程序员、码云/掘金/华为云/阿里云/InfoQ/StackOverflow/github等平台优质作者、专注于Java、小程序、前端、python等技术领域和毕业项目实战,以及程序定制化开发、全栈讲解、就业辅导、面试辅导、简

    2024年02月19日
    浏览(32)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包