10-Node.js入门

01.什么是 Node.js

目标

什么是 Node.js,有什么用,为何能独立执行 JS 代码,演示安装和执行 JS 文件内代码

讲解

  1. Node.js 是一个独立的 JavaScript 运行环境,能独立执行 JS 代码,因为这个特点,它可以用来编写服务器后端的应用程序

  2. Node.js 作用除了编写后端应用程序,也可以对前端代码进行压缩,转译,整合等等,提高前端开发和运行效率

  3. Node.js 基于Chrome V8 引擎封装,独立执行 JS 代码,但是语法和浏览器环境的 V8 有所不同,没有 document 和 window 但是都支持 ECMAScript 标准的代码语法

  4. 想要得到 Node.js 需要把这个软件安装到电脑,下载安装程序默认下一步安装即可

  5. Node.js 没有图形化界面,需要使用 cmd 终端命令行(利用一些命令来操控电脑执行某些程序软件)输入,node -v 检查是否安装成功

    node -v
    
  6. 需求:新建 index.js 文件,编写打印代码和 for 循环打印 3 个 6

    /*** 目标:编写 js 代码,用 node 命令执行* 终端作用:敲击命令,调用对应程序执行* 终端打开:目标文件->右键->在集成终端中打开* 命令:node xxx.js (注意路径)*/
    console.log('Hello, World')
    for (let i = 0; i < 3; i++) {console.log(6)
    }
    
  7. Node.js 执行目标 JS 文件,需要使用 node xxx.js 命令来执行(我们可以借助 VSCode 集成终端使用,好处:可以快速切换到目标 JS 文件所在终端目录,利用相对路径找到要执行的目标 JS 文件

    在这里插入图片描述

02.fs模块-读写文件

目标

了解模块概念,使用 fs 模块封装的方法读写文件内容

讲解

  1. 模块:类似插件,封装了方法和属性供我们使用

  2. fs 模块:封装了与本机文件系统进行交互的,方法和属性

  3. fs 模块使用语法如下:

    • 加载 fs 模块,得到 fs 对象

      const fs = require('fs')
      
    • 写入文件内容语法:

      fs.writeFile('文件路径', '写入内容', err => {// 写入后的回调函数
      })
      
    • 读取文件内容的语法:

      fs.readFile('文件路径', (err, data) => {// 读取后的回调函数// data 是文件内容的 Buffer 数据流
      })
      
  4. 需求:向 test.txt 文件写入内容并读取打印

    /*** 目标:使用 fs 模块,读写文件内容* 语法:* 1. 引入 fs 模块* 2. 调用 writeFile 写入内容* 3. 调用 readFile  读取内容*/
    // 1. 引入 fs 模块
    const fs = require('fs')
    // 2. 调用 writeFile 写入内容
    // 注意:建议写入字符串内容,会覆盖目标文件所有内容
    fs.writeFile('./text.txt', '欢迎使用 fs 模块读写文件内容', err => {if (err) console.log(err)else console.log('写入成功')
    })
    // 3. 调用 readFile  读取内容
    fs.readFile('./text.txt', (err, data) => {if (err) console.log(err)else console.log(data.toString()) // 把 Buffer 数据流转成字符串类型
    })
    

03.path模块-路径处理

目标

使用 path 模块来得到绝对路径

讲解

  1. 为什么在 Node.js 待执行的 JS 代码中要用绝对路径:

    Node.js 执行 JS 代码时,代码中的路径都是以终端所在文件夹出发查找相对路径,而不是以我们认为的从代码本身出发,会遇到问题,所以在 Node.js 要执行的代码中,访问其他文件,建议使用绝对路径

  2. 新建 03 文件夹编写待执行的 JS 代码,访问外层相对路径下的文件,然后在最外层终端路径来执行目标文件,造成问题

    在这里插入图片描述

    在这里插入图片描述

  3. 问题原因:就是从代码文件夹出发,使用../text.txt解析路径,找不到目标文件,报错了!

  4. 解决方案:使用模块内置变量 __dirname配合 path.join() 来得到绝对路径使用

    const fs = require('fs')
    console.log(__dirname) // D:\备课代码\2_node_3天\Node_代码\Day01_Node.js入门\代码\03// 1. 加载 path 模块
    const path = require('path')
    // 2. 使用 path.join() 来拼接路径
    const pathStr = path.join(__dirname, '..', 'text.txt')
    console.log(pathStr)fs.readFile(pathStr, (err, data) => {if (err) console.log(err)else console.log(data.toString())
    })
    
  5. 再次执行查看问题就被修复了!以后在 Node.js 要执行的 JS 代码中访问其他文件的路径,都建议使用绝度路径

04.案例-压缩前端html

目标

压缩前端代码,体验前端工程化的例子

讲解

  1. 前端工程化:前端代码压缩,整合,转译,测试,自动部署等等工具的集成统称,为了提高前端开发项目的效率

  2. 需求:把准备好的 html 文件里的回车符(\r)和换行符(\n)去掉进行压缩,写入到新 html 中

  3. 步骤:

    1. 读取源 html 文件内容
    2. 正则替换字符串
    3. 写入到新的 html 文件中,并运行查看是否能正常打开网页
  4. 代码如下:

    /*** 目标一:压缩 html 里代码* 需求:把 public/index.html 里的,回车/换行符去掉,写入到 dist/index.html 中*  1.1 读取 public/index.html 内容*  1.2 使用正则替换内容字符串里的,回车符\r 换行符\n*  1.3 确认后,写入到 dist/index.html 内*/
    const fs = require('fs')
    const path = require('path')
    // 1.1 读取 public/index.html 内容
    fs.readFile(path.join(__dirname, 'public', 'index.html'), (err, data) => {const htmlStr = data.toString()// 1.2 使用正则替换内容字符串里的,回车符\r 换行符\nconst resultStr = htmlStr.replace(/[\r\n]/g, '')// 1.3 确认后,写入到 dist/index.html 内fs.writeFile(path.join(__dirname, 'dist', 'index.html'), resultStr, err => {if (err) console.log(err)else console.log('压缩成功')})
    })
    

05.案例-压缩前端JS

目标

体验前端工程化,压缩,转译,整合代码

讲解

  1. 需求:把准备好的 JS 文件代码的回车符,换行符,打印语句去掉,并插入到之前 html 内容之后

  2. 步骤:

    1. 读取 js 文件内容
    2. 正则表达式替换回车符,换行符,打印语句为空字符串
    3. 拼接 html 代码和 js 代码,写入到新的 html 文件中
  3. 代码如下:

    /*** 目标二:压缩 js 里代码,并整合到 html 中一起运行*  2.1 读取 public/index.js 内容*  2.2 使用正则替换内容字符串里的,回车符\r 换行符\n 打印语句console.log('xxx');*  2.3 确认后,拼接 html 内容写入到 dist/index.html 内*/
    const fs = require('fs')
    const path = require('path')
    fs.readFile(path.join(__dirname, 'public', 'index.html'), (err, data) => {const htmlStr = data.toString()const resultStr = htmlStr.replace(/[\r\n]/g, '')// 2.1 读取 public/index.js 内容fs.readFile(path.join(__dirname, 'public', 'index.js'), (err, data) => {const jsStr = data.toString()// 2.2 使用正则替换内容字符串里的,回车符\r 换行符\n 打印语句console.log('xxx');const jsResultStr = jsStr.replace(/[\r\n]/g, '').replace(/console.log\('.+?'\);/g, '')const result = `<script>${jsResultStr}</script>`console.log(result)// 2.3 确认后,拼接 html 内容写入到 dist/index.html 内fs.writeFile(path.join(__dirname, 'dist', 'index.html'), resultStr + result, err => {if (err) console.log(err)else console.log('压缩成功')})})})
    

06.认识URL中的端口号

目标

认识 URL 中端口号的作用,以及 Web 服务的作用

讲解

  1. URL 是统一资源定位符,简称网址,用于访问网络上的资源
  2. 端口号的作用:标记服务器里对应的服务程序,值为(0-65535 之间的任意整数)
  3. 注意:http 协议,默认访问的是 80 端口
  4. Web服务:一个程序,用于提供网上信息浏览功能
  5. 注意:0-1023 和一些特定的端口号被占用,我们自己编写服务程序请避开使用

07.http模块-创建Web服务

目标

基于 Node.js 环境,使用内置 http 模块,创建 Web 服务程序

讲解

  1. 需求:引入 http 模块,使用相关语法,创建 Web 服务程序,响应返回给请求方一句提示 ‘hello,world’

  2. 步骤:

    1. 引入 http 模块,创建 Web 服务对象
    2. 监听 request 请求事件,对本次请求,做一些响应处理
    3. 启动 Web 服务监听对应端口号
    4. 运行本服务在终端进程中,用浏览器发起请求
  3. 注意:本机的域名叫做 localhost

  4. 代码如下:

    /*** 目标:使用 http 模块,创建 Web 服务* Web服务:一个程序,用于提供网上信息浏览服务* 步骤:*  1. 引入 http 模块,创建 Web 服务对象*  2. 监听 request 事件,对本次请求,做一些响应处理*  3. 启动 Web 服务监听对应端口号*  4. 运行本服务在终端,用浏览器访问 http://localhost:3000/ 发起请求(localhost 是本机域名)* 注意:终端里启动了服务,如果想要终止按 ctrl c 停止即可*/
    // 1. 引入 http 模块,创建 Web 服务对象
    const http = require('http')
    const server = http.createServer()
    // 2. 监听 request 事件,对本次请求,做一些响应处理
    server.on('request', (req, res) => {res.end('hello, world') // 一次请求只能对应一次响应
    })
    // 3. 启动 Web 服务监听对应端口号
    server.listen(3000, () => {console.log('Web 服务启动了')
    })
    

08.Web服务-支持中文字符

目标

让 Web 服务,返回中文字符,浏览器正确解析加载

讲解

  1. 需求:让 Web 服务返回中文字符,浏览器能正确加载解析

  2. 步骤:给 Web 服务程序添加响应头,设置内容类型和正确的编码格式,重启 Web 服务测试访问即可

    res.setHeader('Content-Type', 'text/html;charset=utf-8')
    
  3. 编码:编码是信息从一种形式或格式转换为另一种形式的过程,指的把文字在计算机里的二进制数据,用什么形式展示出来

  4. utf-8编码:是一种关系映射表,也叫 utf-8 编码表,可以把中文,英文等等很多字符准确的展示出来

09.案例-省份列表接口

目标

基于 Web 服务,编写代码,把省份列表数据响应给请求方

讲解

  1. 需求:基于 Web 服务,开发提供省份列表数据的接口,了解下后端的代码工作过程

    在这里插入图片描述

  2. 步骤:

    1. 基于 http 模块,创建 Web 服务
    2. 使用 req.url 获取请求资源路径,并读取 province.json 理论省份数据返回给请求方
    3. 其他路径,暂时返回不存在的提示
    4. 运行 Web 服务,用浏览器发起请求测试,看是否可以获取到省份列表数据
  3. 代码如下:

    /*** 目标:基于 Web 服务,开发-省份列表数据接口* 步骤:*  1. 创建 Web 服务*  2. 使用 req.url 获取请求的资源路径,读取 json 文件数据返回*  3. 其他请求的路径,暂时返回不存在的提示*  4. 运行 Web 服务,用浏览器请求地址查看效果*/
    const fs = require('fs')
    const path = require('path')
    // 1. 创建 Web 服务
    const http = require('http')
    const server = http.createServer()
    server.on('request', (req, res) => {// 2. 使用 req.url 获取请求的资源路径,读取 json 文件数据返回if (req.url === '/api/province') {fs.readFile(path.join(__dirname, 'data/province.json'), (err, data) => {res.setHeader('Content-Type', 'application/json;charset=utf-8')res.end(data.toString())})} else {// 3. 其他请求的路径,暂时返回不存在的提示res.setHeader('Content-Type', 'text/html;charset=utf-8')res.end('你要访问的资源路径不存在')}
    })
    server.listen(3000, () => {console.log('Web 服务启动了')
    })

10.案例-城市列表接口

目标

体验城市列表接口开发效果,以及查询参数如何传递给后端,后端是如何找到对应的数据

讲解

  1. 需求:基于刚刚的 Web 服务,开发提供城市列表数据的接口,了解下后端代码的工作过程

    在这里插入图片描述

  2. 步骤:

    1. 判断 req.url 资源路径+查询字符串,路径前缀匹配 /api/city
    2. 借助 querystring 模块的方法,格式化查询字符串
    3. 读取 city.json 城市数据,匹配省份名字下属城市列表
    4. 返回城市列表,启动 Web 服务测试
  3. 代码如下:

    /*** 目标:基于 Web 服务,开发-城市列表数据接口* 步骤:*  1. 判断 req.url 资源路径+查询字符串,路径前缀匹配/api/city*  2. 借助 querystring 模块的方法,格式化查询参数字符串*  3. 读取 city.json 城市数据,匹配省份名字下属城市列表*  4. 返回城市列表,启动 Web 服务测试*/
    const qs = require('querystring')
    const fs = require('fs')
    const path = require('path')
    const http = require('http')
    const server = http.createServer()
    server.on('request', (req, res) => {// 省份列表接口if (req.url === '/api/province') {fs.readFile(path.join(__dirname, 'data/province.json'), (err, data) => {res.setHeader('Content-Type', 'application/json;charset=utf-8')res.end(data.toString())})// 1. 判断 req.url 资源路径+查询字符串,路径前缀匹配/api/city} else if (req.url.startsWith('/api/city')) {// 城市列表接口// 2. 借助 querystring 模块的方法,格式化查询参数字符串// req.url: '/api/city?pname=辽宁省'// 以?分隔符分割,拿到'pname=辽宁省'查询参数字符串const str = req.url.split('?')[1]// 把查询参数字符串 转成 JS 对象结构const query = qs.parse(str)// 获取前端发来的省份名字const pname = query.pname// 3. 读取 city.json 城市数据,匹配省份名字下属城市列表fs.readFile(path.join(__dirname, 'data/city.json'), (err, data) => {// 把 JSON 文件内对象格式字符串,转成对象结构const obj = JSON.parse(data.toString())// 省份名字作为 key,去obj对象里取到对应城市列表 value 值const cityList = obj[pname]// 4. 返回城市列表,启动 Web 服务测试// 响应的是 JSON 字符串内容res.setHeader('Content-Type', 'application/json;charset=utf-8')res.end(JSON.stringify(cityList))})} else {res.setHeader('Content-Type', 'text/html;charset=utf-8')res.end('你要访问的资源路径不存在')}
    })
    server.listen(3000, () => {console.log('Web 服务启动了')
    })

11.案例-浏览时钟

目标

体验 Web 服务除了接口数据以外,还能返回网页资源等

讲解

  1. 需求:基于 Web 服务,开发提供网页资源的功能,了解下后端的代码工作过程

    在这里插入图片描述

  2. 步骤:

    1. 基于 http 模块,创建 Web 服务
    2. 使用 req.url 获取请求资源路径为 /index.html 的时候,读取 index.html 文件内容字符串返回给请求方
    3. 其他路径,暂时返回不存在的提示
    4. 运行 Web 服务,用浏览器发起请求
  3. 代码如下:

    /*** 目标:编写 web 服务,监听请求的是 /index.html 路径的时候,返回 dist/index.html 时钟案例页面内容* 步骤:*  1. 基于 http 模块,创建 Web 服务*  2. 使用 req.url 获取请求资源路径,并读取 index.html 里字符串内容返回给请求方*  3. 其他路径,暂时返回不存在提示*  4. 运行 Web 服务,用浏览器发起请求*/
    const fs = require('fs')
    const path = require('path')
    // 1. 基于 http 模块,创建 Web 服务
    const http = require('http')
    const server = http.createServer()
    server.on('request', (req, res) => {// 2. 使用 req.url 获取请求资源路径,并读取 index.html 里字符串内容返回给请求方if (req.url === '/index.html') {fs.readFile(path.join(__dirname, 'dist/index.html'), (err, data) => {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 服务启动了')
    })
    

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

背靠背 HVDC-MMC模块化多电平转换器输电系统-用于无源网络系统的电能质量调节(Simulink仿真实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…

《深度不确定条件下的决策:从理论到实践》PDF

制定未来计划时需要预测变化&#xff0c;尤其是制定长期计划或针对罕见事件的计划时。当这些变化存在高度不确定性的时候&#xff0c;这种预期就变得越来越困难。 今天给大家介绍的这本《深度不确定条件下的决策&#xff1a;从理论到实践》正是解决以上问题的良方。完整书籍文…

STM32--人体红外感应开关

本文主要介绍基于STM32F103C8T6和人体红外感应开关实现的控制算法 简介 人体红外模块选用HC-SR501人体红外传感器&#xff0c;人体红外感应的主要器件为人体热释电红外传感器。人体都有恒定的体温&#xff0c;一般在36~37度&#xff0c;所以会发出特定波长的红外线&#xff0…

企业电子招投标采购系统源码之电子招投标的组成

功能模块&#xff1a; 待办消息&#xff0c;招标公告&#xff0c;中标公告&#xff0c;信息发布 描述&#xff1a; 全过程数字化采购管理&#xff0c;打造从供应商管理到采购招投标、采购合同、采购执行的全过程数字化管理。通供应商门户具备内外协同的能力&#xff0c;为外部供…

手把手教你编写LoadRunner脚本

编写 LoadRunner 脚本需要熟悉脚本语言、业务场景、参数化技术、断言和事务等基础知识。 在实际编写时&#xff0c;可以根据具体测试需求&#xff0c;结合实际情况进行合理的配置和调整。 基本步骤 创建脚本 在 LoadRunner 的 Controller 模块中&#xff0c;创建一个新的测试…

数据结构——堆(C语言)

本篇会解决一下几个问题&#xff1a; 1.堆是什么&#xff1f; 2.如何形成一个堆&#xff1f; 3.堆的应用场景 堆是什么&#xff1f; 堆总是一颗完全二叉树堆的某个节点总是不大于或不小于父亲节点 如图&#xff0c;在小堆中&#xff0c;父亲节点总是小于孩子节点的。 如图&a…

为go vet添加一个新的分析器,用于检查append后面的值缺失

缘起: 2023年5月25号&#xff0c;知名Go技术专家&#xff0c;WA语言联合发起人&#xff0c;多本技术书籍的合著者柴大&#xff0c;遇到一个append忘记写要添加的元素&#xff0c;只写了第一个参数(要追加的切片)的问题&#xff0c;可以编译通过&#xff0c;但大概率不是开发者本…

应用层协议 HTTP

一、应用层协议 我们已经学过 TCP/IP , 已然知道数据能从客户端进程经过路径选择跨网络传送到服务器端进程。 我们还需要知道的是&#xff0c;我们把数据从 A 端传送到 B 端&#xff0c; TCP/IP 解决的是顺丰的功能&#xff0c;而两端还要对数据进行加工处理或者使用&#xf…

SSM - Springboot - MyBatis-Plus 全栈体系(二十一)

第四章 SpringMVC 四、RESTFUL 风格设计和实战 1. RESTFul 风格概述 1.1 RESTFul 风格简介 RESTful&#xff08;Representational State Transfer&#xff09;是一种软件架构风格&#xff0c;用于设计网络应用程序和服务之间的通信。它是一种基于标准 HTTP 方法的简单和轻量…

TCP四次挥手

四次挥手发生在断开连接的时候&#xff0c;在程序中当调用了close()会使用TCP协议进行四次挥手。 客户端和服务器端都可以主动发起断开连接&#xff0c;谁先调用close()谁就是发起。 因为在TCP连接的时候&#xff0c;采用三次握手建立的的连接是双向的&#xff0c;在断开的时候…

股票买进和卖出手续费怎么算,一文看懂,不用研究那些旧规则了

先说结论 印花税&#xff0c;上个月刚下调为0.05%&#xff08;万分之五&#xff09;&#xff0c;单向收取 过户费&#xff0c;最新政策是0.001%&#xff08;十万分之一&#xff09;&#xff0c;双向收取 券商佣金&#xff0c;各家不同&#xff0c;每个客户经理也不同0.0086%…

python笔记:pandas/geopandas DataFrame逐行遍历

在Pandas和GeoPandas中&#xff0c;可以使用几种不同的方法来遍历DataFrame的每一行 0 数据 import pandas as pddata {column1: range(1, 1001),column2: range(1001, 2001) } df pd.DataFrame(data) df 1 iterrows for index, row in df.iterrows():print(index)print(r…

ChatGPT Vision初体验

本周&#xff0c;OpenAI为其广受欢迎的 ChatGPT 平台发布了一项突破性的补充。除了处理文本之外&#xff0c;ChatGPT 现在还可以处理图像并聊天。 很难夸大这件事的重要性。目前多达70% 的内容是视觉内容而不是书面内容。人们每年会生成数千张照片&#xff0c;而当今许多最大的…

FastThreadLocal 快在哪里 ?

FastThreadLocal 快在哪里 &#xff1f; 引言FastThreadLocalset如何获取当前线程私有的InternalThreadLocalMap &#xff1f;如何知道当前线程使用到了哪些FastThreadLocal实例 ? get垃圾回收 小结 引言 FastThreadLocal 是 Netty 中造的一个轮子&#xff0c;那么为什么放着…

JavaScript系列从入门到精通系列第十八篇:JavaScript中的函数作用域

文章目录 前言 一&#xff1a;函数作用域 前言 我们刚才提到了&#xff0c;在<Script>标签当中进行定义的变量、对象、函数对象都属于全局作用域&#xff0c;全局作用域在页面打开的时候生效在页面关闭的时候失效。 一&#xff1a;函数作用域 调用函数时创建函数作用域…

【Linux学习】05-1Linux上安装部署各类软件

Linux&#xff08;B站黑马&#xff09;学习笔记 01Linux初识与安装 02Linux基础命令 03Linux用户和权限 04Linux实用操作 05-1Linux上安装部署各类软件 05-2Linux上部署项目 文章目录 Linux&#xff08;B站黑马&#xff09;学习笔记前言05-1Linux上安装部署各类软件JDK安装部署…

Linux高性能服务器编程 学习笔记 第十一章 定时器

网络程序需要处理定时事件&#xff0c;如定期检测一个客户连接的活动状态。服务器进程通常管理着众多定时事件&#xff0c;有效地组织这些定时事件&#xff0c;使其在预期的时间被触发且不影响服务器的主要逻辑&#xff0c;对于服务器的性能有至关重要的影响。为此&#xff0c;…

【计算机网络-自顶向下方法】应用层(HTTP、FTP)

1. Principles of network applications 创建一个网络应用 创建一个网络应用的核心&#xff0c;是编写一个分布式程序&#xff0c;使其可以运行在不同的端系统上&#xff0c;并能通过网络相互通信。&#xff08;例如&#xff0c;web服务器软件与浏览器软件&#xff09;   应…

MongoEngine 简介安装、连接、数据类型及其参数详解

文章目录 前言一、MongoEngine 简介二、MongoEngine的安装与连接1. 安装MongoEngine2. 连接到MongoDB3. 定义数据模型 三、MongoEngine模型介绍1. 常见数据类型2. 数据类型参数 总结 前言 为了巩固所学的知识&#xff0c;作者尝试着开始发布一些学习笔记类的博客&#xff0c;方…

归并排序与非比较排序详解

W...Y的主页 &#x1f60a; 代码仓库分享 &#x1f495; &#x1f354;前言&#xff1a; 上篇博客我们讲解了非常重要的快速排序&#xff0c;相信大家已经学会了。最后我们再学习一种特殊的排序手法——归并排序。话不多说我们直接上菜。 目录 归并排序 基本思想 递归思路…