暑期带你不走偏快速学习Node
2021-07-29 11:56:57 4 举报AI智能生成
前端学习不可少的环节,暑期带你不走偏快速学习Vue
作者其他创作
大纲/内容
能够和后端程序员更加紧密的配合
1.为什么学习服务器端开发基础
实现网站的业务逻辑
数据的增删改查
2.服务器端开发要做的事情
使用JavaScript语法开发后端应用
一些公司要求前端工程师掌握Node开发
生态系统活跃，有大量开源库可以使用
前端开发工具大多基于Node开发
3.为什么选择Node
Node是基于Chrome V8引擎的javaScrript代码运行环境
运行环境
4.Node是什么？
Node开发概述
异步非阻塞的I/O（I/O线程池）
特别适用于 I/O 密集型应用
单线程
事件循环机制
跨平台
跨平台: 一处编写，随处可用
Node：1对多服务 Java：1对1服务
备注
1.优点
回调函数嵌套太多（俗称回调地狱）
2.不足之处
CPU密集型也叫计算密集型，指的是系统的硬盘、内存性能相对CPU要好很多，此时，系统运作大部分的状况是CPU Loading 100%，CPU要读/写I/O(硬盘/内存)，I/O在很短的时间就可以完成，而CPU还有许多运算要处理，CPU Loading很高
在多重程序系统中，大部份时间用来做计算、逻辑判断等CPU动作的程序称之CPU bound。例如一个计算圆周率至小数点一千位以下的程序，在执行的过程当中绝大部份时间用在三角函数和开根号的计算，便是属于CPU bound的程序
CPU密集型
IO密集型指的是系统的CPU性能相对硬盘、内存要好很多，此时，系统运作，大部分的状况是CPU在等I/O (硬盘/内存) 的读/写操作，此时CPU Loading并不高
I/O bound的程序一般在达到性能极限时，CPU占用率仍然较低。这可能是因为任务本身需要大量I/O操作，而pipeline做得不是很好，没有充分利用处理器能力
IO密集型
CPU密集型vsIO密集型
什么是IO密集型和CPU密集型
web交互
简单的web交互模型
Node.js有什么特点
javaScript 由三部分组成，ECMAScript，DOM，BOM
Node.js 是由ECMAScript及Node 环境提供的一些附加API组成的，包括文件、网络、路径等等一些强大的API
1.Node.js的组成
所有ECMAScript语法在Node环境中都可以使用
在Node环境下执行代码，使用Node命令执行后缀为.js的文件即可
2.Node.js基础语法
如何查看外层函数体：console.log(arguments.callee.toString())
①在Node中 所有的模块（js文件）运行的时候，都被自动包裹了一个外层层函数
①.exports ----> 用于暴露模块
②.require----> 用于引入模块
③.module----> 用于暴露模块
④.__filename ----> 当前文件的绝对路径
⑤.__dirname ----> 当前文件夹的路劲 (绝对路径)
②这个外层函数有什么参数
能让Node直接使用`CommonJs`语法
隐藏内部实现
②这个外层函数有什么用?
3.Node函数中的特点
Node.js快速入门
在浏览器中全局对象是window，在Node中全局对象是global
Node中全局对象下有以下方法，可以在任何地方使用，global可以省略
console.log() 在控制台中输出
setTimeout() 设置超时定时器
clearTimeout() 清除超时时定时器
setInterval() 设置间歇定时器
clearInterval() 清除间歇定时器
global下常见的方法
Node.js全局对象global
Node基础
文件依赖
命名冲突
1.javaScript开发弊端
一个功能就是一个模块
多个模块可以组成完整应用
抽离一个模块不会影响其他功能的运行
2.软件中模块化开发
Node.js规定一个JavaScript文件就是一个模块，模块内部定义的变量和函数默认情况下外部无法得到
3.Node.js中模块开发规范
模块化开发
Node运行环境提供的API，因为这些API都是以模块化的方式进行开发的，所以我们又称Node运行环境提供的API为系统模块
1.什么是系统模块
①简单文件读取
②简单文件写入
③流式文件读取
④流式文件写入
2.系统模块 fs 文件操作
是一个类似于数组的对象，用于存储数据（存储的是二进制数据）
Buffer的效率很高，存储和读取很快，直接对计算机的内存进行操作
Buffer的大小一旦确定了，不可修改
每个元素占用内存的大小为1字节
Buffer是什么？
Buffer是Node中的非常核心的模块，无需下载、无需引入即可使用
3.Buffer缓冲器
因为不同系统的路径分隔符不统一
路径：/public/uploads/avatar
Window 上分隔符是：\\
Linux 上分隔符是是： /
为什么使用路径拼接？
路径拼接语法
4.path路径操作
系统模块
别人写好的、具有特定功能的、我们能直接使用的模块即第三方模块
由于第三方模块通常都是由多个文件组成并且被放置在一个文件夹中，所以又名包
以js文件的形式存在，提供实现项目具体功能的API接口
以命令行工具形式存在，辅助项目开发
第三方模块有两种存在形式:
1.什么是第三方模块
超链接
第三方模块的存储和分发仓库
2.获取第三方模块
npm (node package manager) ： node的第三方模块管理工具
- 下载：npm install 模块名称
- 卸载：npm uninstall package
3. 获取第三方模块
实时监听js文件操作
4.第三方模块 nodemon
切换npm切换下载地址
5.第三方模块 nrm
6.第三方模块yarn
第三方模块
基于node平台开发的前端构建工具
用机器代替手工，提高开发效率
1. 第三方模块 Gulp
- 项目上线，HTML、CSS、JS文件压缩合并
- 语法转换（es6、less ...）
- 公共文件抽离
- 修改文件浏览器自动刷新
2. Gulp能做什么
①使用npm install gulp下载gulp库文件
②项目根目录下建立gulpfile.js文件
③重构项目的文件夹结构 src目录放置源代码文件 dist目录放置构建后文件
④在gulpfile.js文件中编写任务
⑤全局安装执行gulp命令行工具: pm install gulp-cli -g
⑥在命令行工具中执行gulp任务: 在根目录下执行gulp任务： gulp 任务名称
3. Gulp使用
- gulp.src()：获取任务要处理的文件
- gulp.dest()：输出文件
- gulp.task()：建立gulp任务
- gulp.watch()：监控文件的变化
4. Gulp中提供的方法
- gulp-htmlmin：html文件压缩
- gulp-csso ：压缩css
- gulp-babel ：JavaScript语法转化
- gulp-less: less语法转化
- gulp-uglify ：压缩混淆JavaScript
- gulp-file-include 公共文件包含
- browsersync 浏览器实时同步
5. Gulp插件
(1) HTML压缩和抽取公共文件
(2) CSS代码压缩和Less语法转换
(3)ES6代码转换和JS代码压缩
(4)复制文件夹
(5)构建任务: 一此行执行多个任务
6.编写任务
Gulp第三方模块
复杂的模块依赖关系需要被记录，确保模块的版本和当前保持一致，否则会导致当前项目运行报错
1. node_moudules文件夹的问题
生成项目描述文件，记录了当前项目信息，例如项目名称、版本、作者、github地址、、当前项目依赖了哪些第三方模块等。
使用 npm init -y 命令生成
2. package.json文件的作用
在项目开发阶段和线上运营阶段，都需要依赖的第三方包，称为项目依赖
使用npm install 包名命令 下载的文件会默认添加到 package.json文件的 dependencies
3. 项目依赖
在项目的开发阶段需要依赖，线上运营不需要依赖的第三包，称为开发依赖
使用 npm install --save-dev 命令将包添加到package.json文件的devDependencies字段中
4. 开发依赖
当我们需要执行的命令比较长的时候，我们就可以把长的这行命令写在scripts身上
npm run build
5. package.json的scripts的作用
加快下载速度，因为该文件中已经记录了项目所依赖第三方包的树状结构和包的下载地址，重新安装时只需下载即可，不需要做额外的工作
6. package-lock.json文件的作用
package.json文件
1. reuqire方法根据模块路径查找模块，如果是完整路径，直接让引入模块
2. 如果模块后缀省略，先找同名JS文件再找JS文件夹
3. 如果找到了同名文件夹，找文件夹中的index.js
4. 如果文件夹没有index.js就会去当前文件夹中的package.json文件夹中查找main选项
5. 如果找到指定的入口文件不存在或者没有指定入口文件就会报错，模块没有被找到
1. 模块查找规则-当模块拥有路径但没有后缀时
1. Node.js会假设它是系统模块
2. Node.js会去node_modules文件夹中
3. 首先看是否有该名字的JS文件
4. 再看是否有该名字的文件夹
5. 如果是文件夹看里面是否有index.js
6. 如果没有index.js查看该文件夹中的package.json中的main选项确定模块入口文件
7. 否则找不到报错
2. 模块查找规则-当模块没有路径且没有后缀时
Node.js模块的加载机制
模块加载及第三方包
网站应用程序分为两大部分：客户端和服务器端
客户端：在浏览器中运行的部分，就是用户看到并与之交互的界面程序。使用HTML、CSS、JavaScript构建
服务器端：在服务器中运行的部分，负责存储数据和处理应用逻辑
1. 网站的组成
能够提供网站访问服务的机器就是网站服务器
它能够接收客户端的请求，能够对请求做出响应
2. Node网站服务器
互联网中设备的唯一标识
IP是Internet Protocol Address的简写，代表互联网协议地址
3. IP地址
由于IP地址难于记忆，所以产生了域名的概念，所谓域名就是平时上网所使用的网址
4. 域名
端口是计算机与外界通讯交流的出口，用来区分服务器电脑中提供的不同的服务
5. 端口
统一资源定位符，又叫URL（Uniform Resource Locator）
是专为标识Internet网上资源位置而设的一种编址方式，我们平时所说的网页地址指的即是URL
传输协议://服务器IP或域名:端口/资源所在位置标识
http：超文本传输协议，提供了一种发布和接收HTML页面的方法
URL的组成
6. URL
服务器基础概念
创建web服务器
超文本传输协议
( 英文：HyperText Transfer Protocol，缩写：HTTP )
规定了如何从网站服务器传输超文本到本地浏览器，它基于客户端服务器架构工作，是客户端（用户）和服务器端（网站）请求和应答的标准
1.HTTP协议概念
是超文本传输协议
HTTP协议无法根据之前的状态进行本次的请求处理
无状态
特点
2.HTTP协议是什么
在HTTP请求和响应的过程中传递的数据块就叫报文
包括要传送的数据和一些附加信息，并且要遵守规定好的格式
3.报文
GET 请求数据
POST 发送数据
①请求方式
req.headers // 获取请求报文
req.url // 获取客户端请求地址
req.method // 获取客户端请求方式
②请求地址
4.请求报文
- 200 请求成功
- 404 请求的资源没有被找到
- 500 服务器端错误
- 400 客户端请求语法错误
HTTP状态码
- text/html
- text/css
- application/javascript
- image/jpeg
- application/json
内容类型
4.响应报文
HTTP协议
客户端向服务器端发送请求时，有时需要携带一些客户信息
客户信息需要通过请求参数的形式传递到服务器端，比如登录操作
1.请求参数
参数被放置在浏览器地址栏中例如：http://localhost:3000/?name=zhangsan&age=20
参数获取需要借助系统模块url，url模块用来处理url地址
GET参数是放在地址栏进行传输
2. GET请求参数
参数被放置在请求体(请求报文)中进行传输
获取POST参数需要data事件和end事件
使用querystring系统模块将参数转换为对象格式
3. POST请求参数
路由是指客户端请求地址与服务器端程序代码的对应关系
简单的说，就是请求什么响应什么
4. 路由
服务器端不需要处理，可以直接响应给客户端的资源就是静态资源
例如CSS、JavaScript、image文件
5. 静态资源
相同的请求地址不同的响应资源，这种资源就是动态资源
6. 动态资源
浏览器地址栏
link标签的href属性
script标签的src属性
img标签的src属性
Form表单提交
GET方式
POST方式
7. 客户端请求途径
HTTP请求与响应处理
同步API：只有当前API执行完成功后，才能继续执行下一个API
异步API：当前API的执行不会阻塞后续代码的执行
1. 同步API和异步API
自己定义函数让别人去调用
当函数作为参数
3. 回调函数
4. 使用回调函数获取API执行结果
同步API从上到下依次执行，前面代码会阻塞后面代码的执行
异步API不会等待API执行完成后再向下执行代码
如果异步API后面代码的执行依赖当前异步API的执行结果
但实际上后续代码在执行的时候异步API还没有返回结果，这个问题要怎么解决呢？
需求：依次读取A文件、B文件、C文件
6. Node.js中的异步API
Promise出现的目的是解决Node.js异步编程回调地狱的问题
7. Promise
异步函数是异步编程语法的终极解决方案，它可以让我们将异步代码写成同步的形式，让代码不再有回调函数嵌套，使代码变得清晰明了
概念
1. 普通函数定义前加``async``关键字 普通函数变成了异步函数
2. 异步函数默认返回`` promise ``对象
4. 在异步函数内部使用``throw``关键字抛出异常
5. 调用异步函数在链式调用``then``方法获取异步函数执行结果
6. 调用异步函数再链式调用``catch``方法获取异步函数执行的错误信息
async关键字
1. ``await``关键字只能出现在异步函数中
2. ``await promise await``后面只能写``promise``对象 写其他类型的API是不可以的
3. ``await``关键字是可以暂停异步函数向下执行 直到``promise``返回结果
await关键字
改造现有异步函数api 让其返回promise对象 从而支持异步函数语法
util模块下的 promisify方法
8. 异步函数
Node.js异步编程
服务器基础
数据库即存储数据的仓库，可以将数据进行有序的分门别类的存储
它是独立于语言之外的软件，可以通过API去操作它
1. 数据库是什么
- 动态网站中的数据都是存储早数据库中的
- 数据库可以用来持久存储客户端通过表单收集的用户信息
- 数据库软件本身可以对数据进行高效的管理
2. 为什么使用数据库
代表有：MySQL、Oracle、DB2、SQL Server
优点
缺点
①关系型数据库
代表有：MongoDB、Redis...
②非关系型数据库（NoSQL）
3. 数据库的分类
数据库是一个仓库，在仓库中可以存放集合
数据库（database）
集合类似于JS中的数组，在集合中可以存放文档
说白了，集合就是一组文档
集合（collection）
文档数据库中的最小单位，我们存储和操作的内容都是文档
类似于JSMongoDB
文档（document）
4. MongoDB简介
数据库
1.常用命令
2.原生命令总结
MongoDB基本命令
Mongoose是一个对象文档模型（ODM）库
它对Node原生的MongoDB模块进行了进一步的优化封装，并提供了更多的功能
使用mongoose提供的`connect`方法即可连接数据库
数据库连接
一是对集合设定约字段束规则
二是创建集合模型应用集合规则
创建集合
创建文档实际上就是向集合中插入数据
①创建集合实例。
②调用实例对象下的save方法将数据保存到数据库
1. 创建集合
使用 create 方法
2. 创建文档
创建文档的两种方法
前提把安装目录下的`bin`目录下的路径配置到系统的环境变量中
mongoimport –d 数据库名称 –c 集合名称 -–file 要导入的数据文件
导入数据
1.findOne方法返回一条文档，默认返回签得第一条
2.find()查询该集合所有用户文档
查询文档
删除单个
删除多个
删除文档
更新单个
更新多个
更新文档
在创建集合规则时，可以设置当前字段的验证规则，验证失败就则输入插入失败
- required : true 必传字段
- minlength：3 字符串最小长度
- maxlength: 20 字符串最大长度
- min: 2 数值最小为2
- max: 100 数值最大为100
- trim: true 去除字符串两边的空格
- validate: 自定义验证器
- default: 默认值
- 获取错误信息：error.errors['字段名称'].message
MogoDB约束验证
通常不同集合的数据之间是有关系的，例如文章信息和用户信息存储在不同集合中，但文章是某个用户发表的，要查询文章的所有信息包括发表用户，就需要用到集合关联
使用id对集合进行关联
使用populate方法进行关联集合查询
集合关联
Mongoose的使用
MongoDB
模板引擎是第三方模块
让开发者以更加友好的方式拼接字符串，使项目代码更加清晰、更加易于维护
1.模板引擎
1.在命令行工具中使用 `npm install art-template` 命令进行下载
2.使用const template = require(**'art-template'**)引入模板引擎
4.使用模板语法告诉模板引擎，模板与数据应该如何进行拼接
2.art-template模板引擎
模板引擎基础概念
- art-template同时支持两种模板语法：标准语法和原始语法。
- 标准语法可以让模板更容易读写，原始语法具有强大的逻辑处理能力
1.模板语法
将某项数据输出在模板中，标准语法和原始语法如下
- 标准语法：{{ 数据 }}
- 原始语法：<%= %>
2.输出
如果数据中携带HTML标签，默认模板引擎不会解析标签，会将其转义后输出
- 标准语法：{{@ 数据 }}
- 原始语法：<%- 数据 %>
3.原文输出
{{if 条件}} ... {{/if}}
{{if v1}} ... {{else if v2}} ... {{/if}}
标准语法
<% if (value) { %> ... <% } %>
<% if (v1) { %> ... <% } else if (v2) { %> ... <% } %>
原始语法
4.条件判断
{{each 数据}} {{/each}}
<% for() { %> <% } %>
5.循环
使用子模板可以将网站公共区块(头部、底部)抽离到单独的文件中
{{include '模板路径'}}
<%include('模板') %>
6.子模版
使用模板继承可以将网站HTML骨架抽离到单独的文件中
其他页面模板可以继承骨架文件
7.模板继承
挖的坑: {{block 'head'}}{{/block}} 后面会填上
填的坑: {{block 'head'}} \\<link rel="stylesheet" href="custom.css"> {{/block}}
8.模板继承示例
1. 向模板中导入变量: `template.defaults.imports.变量名 = 变量值;`
2. 设置模板根目录: ` template.defaults.root = 模板目录`
3. 设置模板默认后缀: `template.defaults.extname = '.art'`
9.模板配置
模板引擎语法
模板引擎
Express是一个基于Node平台的web应用开发框架
它提供了一系列的强大特性，帮助你创建各种Web应用。
我们可以使用 `npm install express` 命令进行下载
1. Express框架是什么
- 提供了方便简洁的路由定义方式
- 对获取HTTP请求参数进行了简化处理
- 对模板引擎支持程度高，方便渲染动态HTML页面
- 提供了中间件机制有效控制HTTP请求
- 拥有大量第三方中间件对功能进行扩展
2. Express框架特性
Express框架简介
中间件就是一堆方法，可以接收客户端发来的请求、可以对请求做出响应，也可以将请求继续交给下一个中间件继续处理
中间件主要由两部分构成，中间件方法以及请求处理函数
中间件方法由Express提供，负责拦截请求，请求处理函数由开发人员提供，负责处理请求
1. 什么是中间件
可以针对同一个请求设置多个中间件，对同一个请求进行多次处理
默认情况下，请求从上到下依次匹配中间件，一旦匹配成功，终止匹配
可以调用next方法交给下一个中间件进行处理
2. 什么是中间件
app.use 匹配所有的请求方式，可以直接传入请求处理函数，代表接收所有的请求
app.use 第一个参数也可以传入请求地址，代表不论什么请求方式，只要是这个请求地址就接收这个请求
3. app.use中间件用法
①. 路由保护，客户端在访问需要登录的页面时，可以先使用中间件判断用户登录状态，用户如果未登录，则拦截请求，直接响应，禁止用户进入需要登录的页面。
②. 网站维护公告，在所有路由的最上面定义接收所有请求的中间件，直接为客户端做出响应，网站正在维护中。
③. 自定义404页面
4. 中间件应用
在程序执行的过程中，不可避免的会出现一些无法预料的错误，比如文件读取失败，数据库连接失败
错误处理中间件是一个集中处理错误的地方
当程序出现错误时，调用next()方法，并且将错误信息通过参数的形式传递给next()方法，即可触发错误处理中间件
5. 错误处理中间件
在node.js中，异步API的错误信息都是通过回调函数获取的，支持Promise对象的异步API发生错误可以通过catch方法捕获
异步函数执行如果发生错误要如何捕获错误呢？
try catch 可以捕获异步函数以及其他同步代码在执行过程中发生的错误，但是不能其他类型的API发生的错误
6. try-catch捕获错误
EXpress中间件
1.构建模块化路由
2.实现模块化路由
Express框架中使用`req.query`即可获取GET参数
框架内部会将GET参数转换为对象并返回
3.GET请求参数的获取
Express中接收post请求参数需要借助第三方包 body-parser
4.POST请求参数获取
5.Express路由参数
通过Express内置的`express.static`可以方便地托管静态文件
例如img、CSS、JavaScript 文件等
6.静态资源访问处理
Express框架请求处理
为了使`art-template`模板引擎能够更好的和Express框架配合
模板引擎官方在原`art-template`模板引擎的基础上封装了`express-art-template`
使用`npm install art-template express-art-template`命令进行安装
①.告诉express框架使用什么模板引擎渲染什么后缀的模板文件
②告诉express框架模板存在的位置是什么
③.告诉express框架模板的默认后缀是什么
2.模板引擎使用
3. app.locals对象
express-art-template模板引擎
Expree框架
快速学习Node.js
0 条评论
回复 删除
下一页
