暑期带你不走偏快速学习Node 思维导图模板

Node基础

Node开发概述

1.为什么学习服务器端开发基础

能够和后端程序员更加紧密的配合

网站业务逻辑前置,学习前端技术需要后端技术支撑(AJAX)

扩展知识视野,能够在更高的角度审视整个项目

2.服务器端开发要做的事情

实现网站的业务逻辑

数据的增删改查

3.为什么选择Node

使用JavaScript语法开发后端应用

一些公司要求前端工程师掌握Node开发

生态系统活跃，有大量开源库可以使用

前端开发工具大多基于Node开发

4.Node是什么？

Node是基于Chrome V8引擎的javaScrript代码运行环境

运行环境

浏览器((软件)能够运行javaScript代码,浏览器就是JavaScript代码运行环境

Node(软件)能够运行javaScript代码,Node就是JavaScript代码运行环境

Node.js有什么特点

1.优点

异步非阻塞的I/O（I/O线程池）

特别适用于 I/O 密集型应用

单线程

事件循环机制

跨平台

备注

跨平台: 一处编写，随处可用

Node：1对多服务 Java：1对1服务

2.不足之处

回调函数嵌套太多（俗称回调地狱）

单线程,处理不好 CPU 密集型任务

什么是IO密集型和CPU密集型

CPU密集型

CPU密集型也叫计算密集型，指的是系统的硬盘、内存性能相对CPU要好很多，此时，系统运作大部分的状况是CPU Loading 100%，CPU要读/写I/O(硬盘/内存)，I/O在很短的时间就可以完成，而CPU还有许多运算要处理，CPU Loading很高

在多重程序系统中，大部份时间用来做计算、逻辑判断等CPU动作的程序称之CPU bound。例如一个计算圆周率至小数点一千位以下的程序，在执行的过程当中绝大部份时间用在三角函数和开根号的计算，便是属于CPU bound的程序

IO密集型

IO密集型指的是系统的CPU性能相对硬盘、内存要好很多，此时，系统运作，大部分的状况是CPU在等I/O (硬盘/内存) 的读/写操作，此时CPU Loading并不高

I/O bound的程序一般在达到性能极限时，CPU占用率仍然较低。这可能是因为任务本身需要大量I/O操作，而pipeline做得不是很好，没有充分利用处理器能力

CPU密集型vsIO密集型

简单的web交互模型

web交互

Node.js快速入门

1.Node.js的组成

javaScript 由三部分组成，ECMAScript，DOM，BOM

Node.js 是由ECMAScript及Node 环境提供的一些附加API组成的，包括文件、网络、路径等等一些强大的API

2.Node.js基础语法

所有ECMAScript语法在Node环境中都可以使用

在Node环境下执行代码，使用Node命令执行后缀为.js的文件即可

3.Node函数中的特点

如何查看外层函数体：console.log(arguments.callee.toString())

①在Node中所有的模块（js文件）运行的时候，都被自动包裹了一个外层层函数

②这个外层函数有什么参数

①.exports ----> 用于暴露模块

②.require----> 用于引入模块

③.module----> 用于暴露模块

④.__filename ----> 当前文件的绝对路径

⑤.__dirname ----> 当前文件夹的路劲 (绝对路径)

②这个外层函数有什么用?

能让Node直接使用`CommonJs`语法

隐藏内部实现

Node.js全局对象global

在浏览器中全局对象是window，在Node中全局对象是global

Node中全局对象下有以下方法，可以在任何地方使用，global可以省略

global下常见的方法

console.log() 在控制台中输出

setTimeout() 设置超时定时器

clearTimeout() 清除超时时定时器

setInterval() 设置间歇定时器

clearInterval() 清除间歇定时器

模块加载及第三方包

模块化开发

1.javaScript开发弊端

文件依赖

命名冲突

2.软件中模块化开发

一个功能就是一个模块

多个模块可以组成完整应用

抽离一个模块不会影响其他功能的运行

3.Node.js中模块开发规范

Node.js规定一个JavaScript文件就是一个模块，模块内部定义的变量和函数默认情况下外部无法得到

模块内部可以使用exports对象进行导出,使用require方法导入其他模块

系统模块

1.什么是系统模块

Node运行环境提供的API，因为这些API都是以模块化的方式进行开发的，所以我们又称Node运行环境提供的API为系统模块

2.系统模块 fs 文件操作

①简单文件读取

②简单文件写入

③流式文件读取

④流式文件写入

3.Buffer缓冲器

Buffer是什么？

是一个类似于数组的对象，用于存储数据（存储的是二进制数据）

Buffer的效率很高，存储和读取很快，直接对计算机的内存进行操作

Buffer的大小一旦确定了，不可修改

每个元素占用内存的大小为1字节

Buffer是Node中的非常核心的模块，无需下载、无需引入即可使用

4.path路径操作

为什么使用路径拼接？

因为不同系统的路径分隔符不统一

路径：/public/uploads/avatar

Window 上分隔符是：\

Linux 上分隔符是是： /

路径拼接语法

第三方模块

1.什么是第三方模块

别人写好的、具有特定功能的、我们能直接使用的模块即第三方模块

由于第三方模块通常都是由多个文件组成并且被放置在一个文件夹中，所以又名包

第三方模块有两种存在形式:

以js文件的形式存在，提供实现项目具体功能的API接口

以命令行工具形式存在，辅助项目开发

2.获取第三方模块

第三方模块的存储和分发仓库

3. 获取第三方模块

npm (node package manager) ： node的第三方模块管理工具

- 下载：npm install 模块名称

- 卸载：npm uninstall package

4.第三方模块 nodemon

实时监听js文件操作

5.第三方模块 nrm

切换npm切换下载地址

6.第三方模块yarn

切换npm切换下载地址

Gulp第三方模块

1. 第三方模块 Gulp

基于node平台开发的前端构建工具

将机械化操作编写成任务, 想要执行机械化操作时执行一个命令行命令任务就能自动执行了

用机器代替手工，提高开发效率

2. Gulp能做什么

- 项目上线，HTML、CSS、JS文件压缩合并

- 语法转换（es6、less ...）

- 公共文件抽离

- 修改文件浏览器自动刷新

3. Gulp使用

①使用npm install gulp下载gulp库文件

②项目根目录下建立gulpfile.js文件

③重构项目的文件夹结构 src目录放置源代码文件 dist目录放置构建后文件

④在gulpfile.js文件中编写任务

⑤全局安装执行gulp命令行工具: pm install gulp-cli -g

⑥在命令行工具中执行gulp任务: 在根目录下执行gulp任务： gulp 任务名称

4. Gulp中提供的方法

- gulp.src()：获取任务要处理的文件

- gulp.dest()：输出文件

- gulp.task()：建立gulp任务

- gulp.watch()：监控文件的变化

5. Gulp插件

- gulp-htmlmin：html文件压缩

- gulp-csso ：压缩css

- gulp-babel ：JavaScript语法转化

- gulp-less: less语法转化

- gulp-uglify ：压缩混淆JavaScript

- gulp-file-include 公共文件包含

- browsersync 浏览器实时同步

6.编写任务

(1) HTML压缩和抽取公共文件

(2) CSS代码压缩和Less语法转换

(3)ES6代码转换和JS代码压缩

(4)复制文件夹

(5)构建任务: 一此行执行多个任务

package.json文件

1. node_moudules文件夹的问题

文件夹以及文件过多过碎，当我们将项目整体拷贝给别人的时候,，传输速度会很慢很慢

复杂的模块依赖关系需要被记录，确保模块的版本和当前保持一致，否则会导致当前项目运行报错

2. package.json文件的作用

生成项目描述文件，记录了当前项目信息，例如项目名称、版本、作者、github地址、、当前项目依赖了哪些第三方模块等。

使用 npm init -y 命令生成

3. 项目依赖

在项目开发阶段和线上运营阶段，都需要依赖的第三方包，称为项目依赖

使用npm install 包名命令下载的文件会默认添加到 package.json文件的 dependencies

4. 开发依赖

在项目的开发阶段需要依赖，线上运营不需要依赖的第三包，称为开发依赖

使用 npm install --save-dev 命令将包添加到package.json文件的devDependencies字段中

5. package.json的scripts的作用

当我们需要执行的命令比较长的时候，我们就可以把长的这行命令写在scripts身上

npm run build

6. package-lock.json文件的作用

加快下载速度，因为该文件中已经记录了项目所依赖第三方包的树状结构和包的下载地址，重新安装时只需下载即可，不需要做额外的工作

Node.js模块的加载机制

1. 模块查找规则-当模块拥有路径但没有后缀时

1. reuqire方法根据模块路径查找模块，如果是完整路径，直接让引入模块

2. 如果模块后缀省略，先找同名JS文件再找JS文件夹

3. 如果找到了同名文件夹，找文件夹中的index.js

4. 如果文件夹没有index.js就会去当前文件夹中的package.json文件夹中查找main选项

5. 如果找到指定的入口文件不存在或者没有指定入口文件就会报错，模块没有被找到

2. 模块查找规则-当模块没有路径且没有后缀时

1. Node.js会假设它是系统模块

2. Node.js会去node_modules文件夹中

3. 首先看是否有该名字的JS文件

4. 再看是否有该名字的文件夹

5. 如果是文件夹看里面是否有index.js

6. 如果没有index.js查看该文件夹中的package.json中的main选项确定模块入口文件

7. 否则找不到报错

服务器基础

服务器基础概念

1. 网站的组成

网站应用程序分为两大部分：客户端和服务器端

客户端：在浏览器中运行的部分，就是用户看到并与之交互的界面程序。使用HTML、CSS、JavaScript构建

服务器端：在服务器中运行的部分，负责存储数据和处理应用逻辑

2. Node网站服务器

能够提供网站访问服务的机器就是网站服务器

它能够接收客户端的请求，能够对请求做出响应

3. IP地址

互联网中设备的唯一标识

IP是Internet Protocol Address的简写，代表互联网协议地址

4. 域名

由于IP地址难于记忆，所以产生了域名的概念，所谓域名就是平时上网所使用的网址

虽然在地址栏中输入的是网址, 但是最终还是会将域名转换为ip才能访问到指定的网站服务器

5. 端口

端口是计算机与外界通讯交流的出口，用来区分服务器电脑中提供的不同的服务

6. URL

统一资源定位符，又叫URL（Uniform Resource Locator）

是专为标识Internet网上资源位置而设的一种编址方式，我们平时所说的网页地址指的即是URL

URL的组成

传输协议://服务器IP或域名:端口/资源所在位置标识

http：超文本传输协议，提供了一种发布和接收HTML页面的方法

创建web服务器

HTTP协议

1.HTTP协议概念

超文本传输协议

( 英文：HyperText Transfer Protocol，缩写：HTTP )

规定了如何从网站服务器传输超文本到本地浏览器，它基于客户端服务器架构工作，是客户端（用户）和服务器端（网站）请求和应答的标准

2.HTTP协议是什么

是超文本传输协议

特点

无状态

HTTP协议无法根据之前的状态进行本次的请求处理

3.报文

在HTTP请求和响应的过程中传递的数据块就叫报文

包括要传送的数据和一些附加信息，并且要遵守规定好的格式

4.请求报文

①请求方式

GET 请求数据

POST 发送数据

②请求地址

req.headers // 获取请求报文

req.url // 获取客户端请求地址

req.method // 获取客户端请求方式

4.响应报文

HTTP状态码

- 200 请求成功

- 404 请求的资源没有被找到

- 301 重定向,请求的网页已永久移动到新位置

- 500 服务器端错误

- 400 客户端请求语法错误

内容类型

- text/html

- text/css

- application/javascript

- image/jpeg

- application/json

HTTP请求与响应处理

1.请求参数

客户端向服务器端发送请求时，有时需要携带一些客户信息

客户信息需要通过请求参数的形式传递到服务器端，比如登录操作

2. GET请求参数

参数被放置在浏览器地址栏中例如：http://localhost:3000/?name=zhangsan&age=20

参数获取需要借助系统模块url，url模块用来处理url地址

GET参数是放在地址栏进行传输

3. POST请求参数

参数被放置在请求体(请求报文)中进行传输

获取POST参数需要data事件和end事件

使用querystring系统模块将参数转换为对象格式

4. 路由

路由是指客户端请求地址与服务器端程序代码的对应关系

简单的说，就是请求什么响应什么

5. 静态资源

服务器端不需要处理，可以直接响应给客户端的资源就是静态资源

例如CSS、JavaScript、image文件

6. 动态资源

相同的请求地址不同的响应资源，这种资源就是动态资源

7. 客户端请求途径

GET方式

浏览器地址栏

link标签的href属性

script标签的src属性

img标签的src属性

Form表单提交

POST方式

Form表单提交

Node.js异步编程

1. 同步API和异步API

同步API：只有当前API执行完成功后，才能继续执行下一个API

异步API：当前API的执行不会阻塞后续代码的执行

2. 同步API,异步API的区别(获取返回值)

同步API可以从返回值中拿到API执行的结果, 但是异步API是不可以的

3. 回调函数

自己定义函数让别人去调用

当函数作为参数

4. 使用回调函数获取API执行结果

5. 同步API,异步API的区别(代码执行顺序)

同步API从上到下依次执行，前面代码会阻塞后面代码的执行

异步API不会等待API执行完成后再向下执行代码

6. Node.js中的异步API

如果异步API后面代码的执行依赖当前异步API的执行结果

但实际上后续代码在执行的时候异步API还没有返回结果，这个问题要怎么解决呢？

需求：依次读取A文件、B文件、C文件

7. Promise

Promise出现的目的是解决Node.js异步编程回调地狱的问题

8. 异步函数

概念

异步函数是异步编程语法的终极解决方案，它可以让我们将异步代码写成同步的形式，让代码不再有回调函数嵌套，使代码变得清晰明了

async关键字

1. 普通函数定义前加``async``关键字普通函数变成了异步函数

2. 异步函数默认返回`` promise ``对象

3. 在异步函数内部使用``return``关键字进行结果返回结果会被包裹在``promise``对象中,``return``关键字代替了``resolve``关键字

4. 在异步函数内部使用``throw``关键字抛出异常

5. 调用异步函数在链式调用``then``方法获取异步函数执行结果

6. 调用异步函数再链式调用``catch``方法获取异步函数执行的错误信息

await关键字

1. ``await``关键字只能出现在异步函数中

2. ``await promise await``后面只能写``promise``对象写其他类型的API是不可以的

3. ``await``关键字是可以暂停异步函数向下执行直到``promise``返回结果

util模块下的 promisify方法

改造现有异步函数api 让其返回promise对象从而支持异步函数语法

MongoDB

数据库

1. 数据库是什么

数据库即存储数据的仓库，可以将数据进行有序的分门别类的存储

它是独立于语言之外的软件，可以通过API去操作它

2. 为什么使用数据库

- 动态网站中的数据都是存储早数据库中的

- 数据库可以用来持久存储客户端通过表单收集的用户信息

- 数据库软件本身可以对数据进行高效的管理

3. 数据库的分类

①关系型数据库

代表有：MySQL、Oracle、DB2、SQL Server

优点

缺点

②非关系型数据库（NoSQL）

代表有：MongoDB、Redis...

优点

缺点

4. MongoDB简介

数据库（database）

数据库是一个仓库，在仓库中可以存放集合

集合（collection）

集合类似于JS中的数组，在集合中可以存放文档

说白了，集合就是一组文档

文档（document）

文档数据库中的最小单位，我们存储和操作的内容都是文档

类似于JSMongoDB

MongoDB基本命令

1.常用命令

2.原生命令总结

Mongoose的使用

概念

Mongoose是一个对象文档模型（ODM）库

它对Node原生的MongoDB模块进行了进一步的优化封装，并提供了更多的功能

数据库连接

使用mongoose提供的`connect`方法即可连接数据库

创建集合

一是对集合设定约字段束规则

二是创建集合模型应用集合规则

创建文档的两种方法

1. 创建集合

创建文档实际上就是向集合中插入数据

①创建集合实例。

②调用实例对象下的save方法将数据保存到数据库

2. 创建文档

使用 create 方法

导入数据

前提把安装目录下的`bin`目录下的路径配置到系统的环境变量中

mongoimport –d 数据库名称 –c 集合名称 -–file 要导入的数据文件

查询文档

1.findOne方法返回一条文档，默认返回签得第一条

2.find()查询该集合所有用户文档

删除文档

删除单个

删除多个

更新文档

更新单个

更新多个

MogoDB约束验证

在创建集合规则时，可以设置当前字段的验证规则，验证失败就则输入插入失败

- required : true 必传字段

- minlength：3 字符串最小长度

- maxlength: 20 字符串最大长度

- min: 2 数值最小为2

- max: 100 数值最大为100

- enum: ['html','css', 'javascript', 'node.js']

- trim: true 去除字符串两边的空格

- validate: 自定义验证器

- default: 默认值

- 获取错误信息：error.errors['字段名称'].message

集合关联

概念

通常不同集合的数据之间是有关系的，例如文章信息和用户信息存储在不同集合中，但文章是某个用户发表的，要查询文章的所有信息包括发表用户，就需要用到集合关联

使用id对集合进行关联

使用populate方法进行关联集合查询

模板引擎

模板引擎基础概念

1.模板引擎

模板引擎是第三方模块

让开发者以更加友好的方式拼接字符串，使项目代码更加清晰、更加易于维护

2.art-template模板引擎

1.在命令行工具中使用 `npm install art-template` 命令进行下载

2.使用const template = require(**'art-template'**)引入模板引擎

3.告诉模板引擎要拼接的数据和模板在哪 const html = template(‘模板路径’, 数据);

4.使用模板语法告诉模板引擎，模板与数据应该如何进行拼接

模板引擎语法

1.模板语法

- art-template同时支持两种模板语法：标准语法和原始语法。

- 标准语法可以让模板更容易读写，原始语法具有强大的逻辑处理能力

2.输出

将某项数据输出在模板中，标准语法和原始语法如下

- 标准语法：{{ 数据 }}

- 原始语法：<%= %>

3.原文输出

如果数据中携带HTML标签，默认模板引擎不会解析标签，会将其转义后输出

- 标准语法：{{@ 数据 }}

- 原始语法：<%- 数据 %>

4.条件判断

标准语法

{{if 条件}} ... {{/if}}

{{if v1}} ... {{else if v2}} ... {{/if}}

原始语法

<% if (value) { %> ... <% } %>

<% if (v1) { %> ... <% } else if (v2) { %> ... <% } %>

5.循环

标准语法

原始语法

<% for() { %> <% } %>

6.子模版

使用子模板可以将网站公共区块(头部、底部)抽离到单独的文件中

标准语法

原始语法

<%include('模板') %>

7.模板继承

使用模板继承可以将网站HTML骨架抽离到单独的文件中

其他页面模板可以继承骨架文件

8.模板继承示例

挖的坑: {{block 'head'}}{{/block}} 后面会填上

填的坑: {{block 'head'}} \<link rel="stylesheet" href="custom.css"> {{/block}}

9.模板配置

第三方模块dateformat 用于将`new Date转换为 2020-02-24时,格式: dateFormat(time,'yyyy-mm-dd')

1. 向模板中导入变量: `template.defaults.imports.变量名 = 变量值;`

2. 设置模板根目录: ` template.defaults.root = 模板目录`

3. 设置模板默认后缀: `template.defaults.extname = '.art'`

Expree框架

Express框架简介

1. Express框架是什么

Express是一个基于Node平台的web应用开发框架

它提供了一系列的强大特性，帮助你创建各种Web应用。

我们可以使用 `npm install express` 命令进行下载

2. Express框架特性

- 提供了方便简洁的路由定义方式

- 对获取HTTP请求参数进行了简化处理

- 对模板引擎支持程度高，方便渲染动态HTML页面

- 提供了中间件机制有效控制HTTP请求

- 拥有大量第三方中间件对功能进行扩展

EXpress中间件

1. 什么是中间件

中间件就是一堆方法，可以接收客户端发来的请求、可以对请求做出响应，也可以将请求继续交给下一个中间件继续处理

中间件主要由两部分构成，中间件方法以及请求处理函数

中间件方法由Express提供，负责拦截请求，请求处理函数由开发人员提供，负责处理请求

2. 什么是中间件

可以针对同一个请求设置多个中间件，对同一个请求进行多次处理

默认情况下，请求从上到下依次匹配中间件，一旦匹配成功，终止匹配

可以调用next方法交给下一个中间件进行处理

3. app.use中间件用法

app.use 匹配所有的请求方式，可以直接传入请求处理函数，代表接收所有的请求

app.use 第一个参数也可以传入请求地址，代表不论什么请求方式，只要是这个请求地址就接收这个请求

4. 中间件应用

①. 路由保护，客户端在访问需要登录的页面时，可以先使用中间件判断用户登录状态，用户如果未登录，则拦截请求，直接响应，禁止用户进入需要登录的页面。

②. 网站维护公告，在所有路由的最上面定义接收所有请求的中间件，直接为客户端做出响应，网站正在维护中。

③. 自定义404页面

5. 错误处理中间件

在程序执行的过程中，不可避免的会出现一些无法预料的错误，比如文件读取失败，数据库连接失败

错误处理中间件是一个集中处理错误的地方

当程序出现错误时，调用next()方法，并且将错误信息通过参数的形式传递给next()方法，即可触发错误处理中间件

6. try-catch捕获错误

在node.js中，异步API的错误信息都是通过回调函数获取的，支持Promise对象的异步API发生错误可以通过catch方法捕获

异步函数执行如果发生错误要如何捕获错误呢？

try catch 可以捕获异步函数以及其他同步代码在执行过程中发生的错误，但是不能其他类型的API发生的错误

Express框架请求处理

1.构建模块化路由

2.实现模块化路由

3.GET请求参数的获取

Express框架中使用`req.query`即可获取GET参数

框架内部会将GET参数转换为对象并返回

4.POST请求参数获取

Express中接收post请求参数需要借助第三方包 body-parser

5.Express路由参数

6.静态资源访问处理

通过Express内置的`express.static`可以方便地托管静态文件

例如img、CSS、JavaScript 文件等

express-art-template模板引擎

1.模板引擎

为了使`art-template`模板引擎能够更好的和Express框架配合

模板引擎官方在原`art-template`模板引擎的基础上封装了`express-art-template`

使用`npm install art-template express-art-template`命令进行安装

2.模板引擎使用

①.告诉express框架使用什么模板引擎渲染什么后缀的模板文件

app.engine('art',require('express-art-template'));

②告诉express框架模板存在的位置是什么

app.set('views',path.join(__dirname,'views'));

③.告诉express框架模板的默认后缀是什么

app.set('views engine','art');

3. app.locals对象

将多个模板中共有的数据添加到 ` app.local`这个对象下面, 这个数据在所有的模板都可以获取到