Node.js的简单学习一-----未完待续

news2024/11/14 23:53:59

文章目录

  • 前言
  • 学习目标
  • 一、初识Node.js
    • 1.1 回顾与思考
      • 1.1.1 需要掌握那些技术
      • 1.1.2 浏览器中的JavaScript的组成部分
    • 1.2 Node.js简介
      • 1 什么是Node.js
      • 2 Node.js中的JavaScript运行环境
      • 3 Node.js 可以做什么
    • 1.3 Node.js环境的安装
    • 1.4 在Node.js环境中执行JavaScript 代码
      • 终端中的快捷键
  • 二、fs 文件系统模块
    • 2.1 什么是fs 文件系统模块
    • 2.2 读取文件中的内容
    • VScode下载及环境配置([b站视频](https://www.bilibili.com/video/BV1Cu411y7vT/?spm_id_from=333.337.search-card.all.click&vd_source=f8de2612955c44109b1513ec35ab72d4))
      • 01.使用readfile读取文件的方法.js
      • 02判断文件是否读取成功.js
    • 2.3 向指定的文件中写入内容
    • 2.4 练习-考试成绩整理
    • 2.5 fs文件系统模块
      • __dirname
  • 三、path路径模块
    • 3.1 什么是path路径模块
    • 3.2 路径拼接
      • path.join()拼接路径
    • 3.3 获取路径中的文件名
    • 3.4 获取路径中的文件名
    • 3.5 综合按理 - 时钟案例
  • 终端清屏快捷键 cls
  • 四、http模块
    • 4.1 什么是http模块
    • 4.2 http模块的作用
    • 4.3 服务器相关的概念
    • 4.4 创建基本服务器
    • 停止服务器快捷键: ctrl + c
    • 快速打开网页方法: ctrl + 单击鼠标
    • 4.
    • 2.4 练习-考试成绩整理
  • 总结 #pic_center


前言

只是为方便学习,不做其他用途,参考文章:Node.js 简介、视频:黑马程序员Node.js全套入门教程 和网页:Nodejs 基础

学习目标

在这里插入图片描述

一、初识Node.js

1.1 回顾与思考

1.1.1 需要掌握那些技术

我没掌握(难受)
在这里插入图片描述

1.1.2 浏览器中的JavaScript的组成部分

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

DOM 概述:文档对象模型 (DOM) 是 HTML 和 XML 文档的编程接口。

BOM: 是PDM/MRPⅡ/ERP信息化系统中最重要的基础数据,其组织格式设计合理与否直接影响到系统的处理性能,因此,根据实际的使用环境,灵活地设计合理且有效的BOM是十分重要的。

什么是 API?:API 是允许两个软件组件使用一组定义和协议相互通信的机制。例如,气象局的软件系统包括每天的天气数据。您手机上的天气应用程序通过 API 与该系统“对话”,并在您的手机上显示每天的最新天气信息。

在这里插入图片描述

1.2 Node.js简介

1 什么是Node.js

Node.js是一个基于Chrome V8引擎的JavaScript运行环境。

2 Node.js中的JavaScript运行环境

在这里插入图片描述

3 Node.js 可以做什么

在这里插入图片描述
在这里插入图片描述

1.3 Node.js环境的安装

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

1.4 在Node.js环境中执行JavaScript 代码

创建js文件:

  1. 新建文本文档(.txt文件)
  2. 进入编辑
  3. 输入:console.log(‘Hello Node.js’)
  4. 另存文件,文件类型记得选 所有文件 ,然后将文件名后缀改为 “.js” 就可以了

在这里插入图片描述
在这里插入图片描述

在终端(参考文章Windows 命令行 (cmd) 切换盘符)中运行js文件:

在这里插入图片描述

注: 快捷打开方式,在目录文件夹下,按住shift键+点击右键

在这里插入图片描述
在这里插入图片描述

出现窗口

在这里插入图片描述

终端中的快捷键

在这里插入图片描述

在这里插入图片描述

二、fs 文件系统模块

2.1 什么是fs 文件系统模块

fs模块是Nodejs官方提供的、用来操作文件的模块。它提供了一系列的方法和属性,用来满足用户对文件的操作需求

在这里插入图片描述

2.2 读取文件中的内容

读取文件的语法格式:

在这里插入图片描述
在这里插入图片描述

VScode下载及环境配置(b站视频)

01.使用readfile读取文件的方法.js

// 1. 导入fs模块
const fs = require('fs')

// 2. 调用fs.readFile()方法读取文件

/* fs.readFile()的语法格式*/
//fs.readFilde(path[.options],callback)

/*
调用fs.readFile()
参数1:读取文件存放的路径
参数2:读取文件时采用的编码格式
参数3:回调函数,拿到失败和成功的结果
*/

/*以utf8的编码格式,读取文件的内容,并打印err和dataStr的值*/

fs.readFile('./files/1.txt', 'utf8',  function(err, dataStr) {
// 'utf8'为编码格式
//  读取后会  运行function函数:
/*读取成功,err为null, dataStr为对应读取的数据 */
/*读取失败,err为 错误对象 , dataStr  为  undefined*/

/*打印读取失败的结果*/
console.log(err)
console.log('-------')
/*打印读取成功的结果*/
console.log(dataStr)

})


02判断文件是否读取成功.js

在这里插入图片描述

const fs = require( 'fs')

fs.readFile('./files/1.txt', 'utf8', function(err,dataStr){if (err) {

    return console.log('读取文件失败!' + err.message)

}

console.log('读取文件成功!' + dataStr)

})

在这里插入图片描述

在这里插入图片描述

2.3 向指定的文件中写入内容

fs.wirteFile()的语法格式:
在这里插入图片描述

/*语法格式*/
//fs.writeFile(file, data[.options], callback)

/*
参数1:必选,写入文件的存放路径
参数2:必选,写入的内容
参数3:可选,编码格式,如utf8
参数4:必选,文件写入后的回调函数
*/

const fs = require('fs')

fs.writeFile('./files/2.txt','abcd',function(err){
/*读取成功,err为null*/
/*读取失败,err为 错误对象*/
console.log(err)
})


在这里插入图片描述

2.4 练习-考试成绩整理

在这里插入图片描述

注意:不要多空格,空格读取后是换行符
在这里插入图片描述

![在这里插入图片描述](https://img-blog.csdnimg.cn/59f0b7eb6d994556b21a923360cdc6ef.png #pic_center)

代码:

const fs = require('fs')

fs.readFile('./成绩.txt','utf8',function(err,dataStr){
    if(err)
    return console.log('读取失败'+ err.message)

    // console.log('读取文件成功!'+dataStr)

    const arrOld = dataStr.split(' ')

    const arrNew = []

    arrOld.forEach(item => {
        arrNew.push(item.replace('=', ': '))
    })

    console.log(arrNew)
    
    const newStr = arrNew.join('\r\n') 
    console.log(newStr)

    fs.writeFile('./成绩-ok.txt',newStr,function(err){
        if(err){
            return console.log('写入文件失败!' + err.message)
        }

        console.log('成绩写入成功')
    })
})

在这里插入图片描述

在这里插入图片描述

2.5 fs文件系统模块

在这里插入图片描述

fs模块–路径动态拼接的问题:

  • 在使用fs 模块操作文件时,如果提供的操作路径是以./或…/开头的相对路径时,很容易出现路径动态拼接错误的问题。
  • 原因:代码在运行的时候,会队执行node命令时所处的目录,动态拼接出被操作文件的完整路径。(相对于用户所在目录,而不是相对于文件目录)
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述

__dirname

  • __dirname表示当前文件所处的目录,更改后可解决路径问题
    在这里插入图片描述

三、path路径模块

3.1 什么是path路径模块

在这里插入图片描述

3.2 路径拼接

path.join()拼接路径

  • 使用path.join(方法,可以把多个路径片段拼接为完整的路径字符串,语法格式如下
path.join([...path])
const path = require('path')

// 注意: ../ 会抵消前面的路径
const pathStr = path.join('/a', '/b/c', '../', './d', 'e')
console.log(pathStr) // 输出\a\b\d\e

const pathStr2 = path.join(__dirname, './files/1.text')
console.log(pathStr2) // 将相对路径转化为绝对路径

3.3 获取路径中的文件名

在这里插入图片描述
在这里插入图片描述

/*导入path模块*/
const path = require('path')

/*定义文件的存放路径*/
const fpath = '/a/b/c/index.html'

const fullName = path.basename(fpath)
/*打印出文件名index.html*/
console.log(fullName)

const nameWithoutExit = path.basename(fpath, '.html')
/*打印出index,移除了.html*/
console.log(nameWithoutExit)

3.4 获取路径中的文件名

在这里插入图片描述
在这里插入图片描述

3.5 综合按理 - 时钟案例

![在这里插入图片描述](https://img-blog.csdnimg.cn/ab02d1b68cc44f7e8cf692a3648c1f52.png #pic_center)
![在这里插入图片描述](https://img-blog.csdnimg.cn/d4bfc87cfef645b28722e0d369b1a55b.png #pic_center)
在这里插入图片描述
![在这里插入图片描述](https://img-blog.csdnimg.cn/d35f07de0a0b4e31bea2b2b039a8c300.png #pic_center)

// 1.1 导入 fs 模块
const fs = require('fs')
// 1.2 导入 path 模块
const path = require('path')

// 1.3 定义正则表达式,分别匹配 <style></style> 和 <script></script> 标签
const regStyle = /<style>[\s\S]*<\/style>/
const regScript = /<script>[\s\S]*<\/script>/

// 2.1 调用 fs.readFile() 方法读取文件
fs.readFile(path.join(__dirname, '../node.js—资料/day1/素材/index.html'), 'utf8', function(err, dataStr) {
  // 2.2 读取 HTML 文件失败
  if (err) return console.log('读取HTML文件失败!' + err.message)
  // 2.3 读取文件成功后,调用对应的三个方法,分别拆解出 css, js, html 文件
  resolveCSS(dataStr)
  resolveJS(dataStr)
  resolveHTML(dataStr)
})

// 3.1 定义处理 css 样式的方法
function resolveCSS(htmlStr) {
  // 3.2 使用正则提取需要的内容
  const r1 = regStyle.exec(htmlStr)
  // 3.3 将提取出来的样式字符串,进行字符串的 replace 替换操作
  const newCSS = r1[0].replace('<style>', '').replace('</style>', '')
  // 3.4 调用 fs.writeFile() 方法,将提取的样式,写入到 clock 目录中 index.css 的文件里面
  fs.writeFile(path.join(__dirname, './clock/index.css'), newCSS, function(err) {
    if (err) return console.log('写入 CSS 样式失败!' + err.message)
    console.log('写入样式文件成功!')
  })
}

// 4.1 定义处理 js 脚本的方法
function resolveJS(htmlStr) {
  // 4.2 通过正则,提取对应的 <script></script> 标签内容
  const r2 = regScript.exec(htmlStr)
  // 4.3 将提取出来的内容,做进一步的处理
  const newJS = r2[0].replace('<script>', '').replace('</script>', '')
  // 4.4 将处理的结果,写入到 clock 目录中的 index.js 文件里面
  fs.writeFile(path.join(__dirname, './clock/index.js'), newJS, function(err) {
    if (err) return console.log('写入 JavaScript 脚本失败!' + err.message)
    console.log('写入 JS 脚本成功!')
  })
}

// 5.1 定义处理 HTML 结构的方法
function resolveHTML(htmlStr) {
  // 5.2 将字符串调用 replace 方法,把内嵌的 style 和 script 标签,替换为外联的 link 和 script 标签
  const newHTML = htmlStr.replace(regStyle, '<link rel="stylesheet" href="./index.css" />').replace(regScript, '<script src="./index.js"></script>')
  // 5.3 写入 index.html 这个文件
  fs.writeFile(path.join(__dirname, './clock/index.html'), newHTML, function(err) {
    if (err) return console.log('写入 HTML 文件失败!' + err.message)
    console.log('写入 HTML 页面成功!')
  })
}

终端清屏快捷键 cls

四、http模块

4.1 什么是http模块

在这里插入图片描述

4.2 http模块的作用

  • 服务器和普通电脑的区别在于,服务器上安装了web服务器软件,例如:IIS、Apache等。通过安装这些服务器软件,就能把一台普通的电脑变成一台web服务器。

  • 在Node.js 中,我们不需要使用IIS、Apache等这些第三方web服务器软件。因为我们可以基于Node,js提供的http模块,通过几行简单的代码,就能轻松的手写一个服务器软件,从而对外提供web服务。

4.3 服务器相关的概念

在这里插入图片描述

  • ping www.baidu.com
    ![在这里插入图片描述](https://img-blog.csdnimg.cn/66a97d797da6497d909029e29c965b0c.png #pic_center)
    在这里插入图片描述
    在这里插入图片描述

4.4 创建基本服务器

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

代码:
// 1. 导入 http 模块
const http = require('http')
// 2. 创建 web 服务器实例
const server = http.createServer()
// 3. 为服务器实例绑定 request 事件,监听客户端的请求
server.on('request', function (req, res) {
  console.log('Someone visit our web server.')
})
// 4. 启动服务器
server.listen(8080, function () {  
  console.log('server running at http://127.0.0.1:8080')
})

停止服务器快捷键: ctrl + c

在这里插入图片描述

快速打开网页方法: ctrl + 单击鼠标

在这里插入图片描述

4.

2.4 练习-考试成绩整理

总结 #pic_center

空格         空格

二维数
1
1
1

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

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

相关文章

掌握好Framework 才是王道~

现在面试对Android开发者的要求越来越高了&#xff01;从最开始的阿里、头条、腾讯等大厂&#xff0c;到现在的互联网车企&#xff0c;面试总喜欢问道 Framework底层原理的相关问题 Android Framework的三大核心功能&#xff1a; 1、View.java:View工作原理&#xff0c;实现包…

海尔三翼鸟:生态聚拢的密度,决定场景落地速度

最近学到一个新词&#xff0c;叫做涌现能力。 怎么理解呢&#xff1f;我们以当下最火的ChatGPT为例&#xff0c;GPT1模型是1.17亿参数&#xff0c;GPT2有15亿参数&#xff0c;GPT3有1750亿个参数。研究人员在放大模型规模的进程中发现一个惊人的现象&#xff0c;模型参数达到一…

Vue基础学习 -- Vue数据与方法 v-指令补充 vue生命周期

Vue数据与方法 实例化Vue对象时&#xff0c;需要在data中定义数据&#xff0c;data选项是一个函数&#xff0c;它应该返回一个对象&#xff0c;然后Vue通过响应性系统将其包裹起来&#xff0c;并以$data形式储存在实例中。为了方便起见&#xff0c;该归降的任何顶级property可…

【蓝桥杯刷题】盗版Huybery系列之手抓饼赛马

【蓝桥杯刷题】—— 盗版Huybery系列之手抓饼赛马&#x1f60e;&#x1f60e;&#x1f60e; 目录 &#x1f4a1;前言&#x1f31e;&#xff1a; &#x1f49b;盗版Huybery系列之手抓饼赛马题目&#x1f49b; &#x1f4aa; 解题思路的分享&#x1f4aa; &#x1f60a;题…

计算机SCI期刊投稿,除了投稿信,还要做什么准备? - 易智编译EaseEditing

投稿信的准备 期刊的编辑往往需要一些有关作者及其论文的信息。 而作者也希望给编辑提供一些有助于其全文送审及决策的信息。 这些信息都应该包括在投稿信中。 投稿信应包括以下几方面的内容&#xff1a; 文题和所有作者的姓名;稿件适宜的栏目; 为什么此论文适合于在该刊而…

大数据框架之Hive:第2章 Hive安装

第2章 Hive安装 2.1 Hive安装地址 1&#xff09;Hive官网地址 http://hive.apache.org/ 2&#xff09;文档查看地址 https://cwiki.apache.org/confluence/display/Hive/GettingStarted 3&#xff09;下载地址 http://archive.apache.org/dist/hive/ 4&#xff09;gith…

OpenCV入门(四)快速学会OpenCV3画基本图形

OpenCV入门&#xff08;四&#xff09;快速学会OpenCV3画基本图形 1.画点 在OpenCV中&#xff0c;点分为2D平面中的点和3D平面中的点&#xff0c;区别就是3D中点多了一个z坐标。我们首先介绍2D中的点&#xff0c;坐标为整数的点可以直接用(x, y)代替&#xff0c;其中x是横坐标…

快速幂----快速求解底数的n次幂

目录 一.快速幂 1.问题的引入 2.快速幂的介绍 3.核心思想 4.代码实现 2.猴子碰撞的方法数 1.题目描述 2.问题分析 3.代码实现 一.快速幂 1.问题的引入 问题:求解num的n次幂,结果需要求余7 对于这个问题我们可能就是直接调用函数pow(a,b)来直接求解a的b次幂问题,但是如果…

灵巧手抓持<分类><仿真>

获取灵巧手抓取物体时的抓持类型&#xff0c;需要考虑&#xff1a;手本身的结构、被抓取物体的形状尺寸、抓持操作任务的条件。 研究方法&#xff1a;基于模型的方法、基于数据驱动的方法 基于模型的方法&#xff1a;建立灵巧手抓持相关的运动学和动力学模型建立目标函数求解…

【操作系统】进程和线程的区别

文章目录1. 概述2. 进程3. 线程4. 协程5. 进程与线程区别1. 概述 进程和线程这两个名词天天听&#xff0c;但是对于它们的含义和关系其实还有点懵的&#xff0c;其实除了进程和线程&#xff0c;还存在一个协程&#xff0c;它们的关系如下&#xff1a; 首先&#xff0c;我们需要…

C++基础——Ubuntu下编写C++环境配置总结(C++基本简介、Ubuntu环境配置、编写简单C++例程)

【系列专栏】&#xff1a;博主结合工作实践输出的&#xff0c;解决实际问题的专栏&#xff0c;朋友们看过来&#xff01; 《QT开发实战》 《嵌入式通用开发实战》 《从0到1学习嵌入式Linux开发》 《Android开发实战》 《实用硬件方案设计》 长期持续带来更多案例与技术文章分享…

优思学院|质量管理简史:从质检到质控,到六西格玛管理

在现代的工业化生产中&#xff0c;质量管理已成为企业生产运营的不可或缺的一部分。经过长时间的探索和实践&#xff0c;质量管理的理论和实践已经逐步成熟&#xff0c;并形成了完整的体系。下面&#xff0c;我将简要介绍一下质量管理学的发展历程。 质量管理的萌芽期&#xff…

socket聊天室--socket的建立

socket聊天室–socket实现 文章目录 socket聊天室--socket实现socket()bind()listen()accept()connect()发送接收read()函数recv()函数write()函数send()函数close()关闭套接字IP 地址格式转换函数socket() #include <sys/types

web餐饮开源程序

简介 一款专门针对餐饮行业而开发桌面应用程序 技术 借助Panuon.UI.Silver控件库&#xff0c;开发的一款餐饮软件。 运行环境&#xff1a;.NETFramework,Versionv4.8。 运行数据库&#xff1a;MySql。 ORM框架&#xff1a;SqlSugar。 第三方插件&#xff1a;Panuon.UI.Silv…

OpenKruise 开发者不容错过的带薪实习机会!马上加入 LFX Mentorship 计划

LFX Mentorship 计划由 Linux Foundation 组织发起&#xff0c;为像 OpenKruise 这样的 CNCF 托管项目提供了激励开源贡献、扶植社区发展的优秀土壤。参与其中的开发者不仅有机会在经验丰富的社区 Mentor 指导下贡献开源项目、为职业生涯加分&#xff0c;完成工作后还能获得 $3…

【JAVA】Java中集合的遍历

&#x1f3c6;今日学习目标&#xff1a;集合遍历 &#x1f603;创作者&#xff1a;颜颜yan_ ✨个人主页&#xff1a;颜颜yan_的个人主页 ⏰本期期数&#xff1a;第五期 &#x1f389;专栏系列&#xff1a;JAVA 集合遍历前言一、Iterator接口二、foreach循环总结前言 在实际开发…

JavaScript基础二、变量

零、文章目录 文章地址 个人博客-CSDN地址&#xff1a;https://blog.csdn.net/liyou123456789个人博客-GiteePages&#xff1a;https://bluecusliyou.gitee.io/techlearn 代码仓库地址 Gitee&#xff1a;https://gitee.com/bluecusliyou/TechLearnGithub&#xff1a;https:…

UE4 材质学习 (焚烧材质)

效果步骤随便从网上下载一张图片&#xff08;地址&#xff1a;链接/链接&#xff09;&#xff0c;导入UE中新建一个材质函数这里命名为“E_Function”双击打开该材质函数&#xff0c;由于需要输出变发光和变透明两种效果&#xff0c;因此这里需要两个输出节点&#xff1a;分别命…

MIPI协议

MIPI调试指南Rev.0.1 June 18, 2019 © 2018 Horizon Robotics. All rights reserved.Revision HistoryThissection tracks the significant documentation changes that occur fromrelease-to-release. The following table lists the technical content changes foreach …

RK3568平台开发系列讲解(显示篇)framebuffer屏幕显示

🚀返回专栏总目录 文章目录 一、FrameBuffer介绍二、FrameBuffer应用程序沉淀、分享、成长,让自己和他人都能有所收获!😄 📢本篇将介绍如何通过framebuffer进行显示。 一、FrameBuffer介绍 FrameBuffer中文译名为帧缓冲驱动,它是出现在2.2.xx内核中的一种驱动程序接口…