From 6a125f3235d05caa92b5ed74782c11fd63eeaee1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?19=E9=99=88=E5=BF=97=E6=A2=81?= <2864599615@qq.com> Date: Mon, 13 Feb 2023 10:58:10 +0800 Subject: [PATCH 01/11] 12 --- "19\351\231\210\345\277\227\346\242\201/111.txt" | 0 1 file changed, 0 insertions(+), 0 deletions(-) create mode 100644 "19\351\231\210\345\277\227\346\242\201/111.txt" diff --git "a/19\351\231\210\345\277\227\346\242\201/111.txt" "b/19\351\231\210\345\277\227\346\242\201/111.txt" new file mode 100644 index 0000000..e69de29 -- Gitee From 1c63131b9cc824262b70a5c33cf484ecaf3da445 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=BF=97=E6=A2=81?= <2864599615@qq.com> Date: Wed, 15 Feb 2023 15:47:12 +0000 Subject: [PATCH 02/11] =?UTF-8?q?=E6=96=B0=E5=BB=BA=20=E7=AC=94=E8=AE=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../\347\254\224\350\256\260/.keep" | 0 1 file changed, 0 insertions(+), 0 deletions(-) create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/.keep" diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/.keep" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/.keep" new file mode 100644 index 0000000..e69de29 -- Gitee From 570272b53a4f52090e84ab9ca57206667149128c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=BF=97=E6=A2=81?= <2864599615@qq.com> Date: Wed, 15 Feb 2023 15:47:52 +0000 Subject: [PATCH 03/11] 0 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: 陈志梁 <2864599615@qq.com> --- ...0 \346\250\241\345\235\227\345\214\226.md" | 33 +++++++++++++++++++ 1 file changed, 33 insertions(+) create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-14 \347\254\224\350\256\260 \346\250\241\345\235\227\345\214\226.md" diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-14 \347\254\224\350\256\260 \346\250\241\345\235\227\345\214\226.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-14 \347\254\224\350\256\260 \346\250\241\345\235\227\345\214\226.md" new file mode 100644 index 0000000..8cb4ec0 --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-14 \347\254\224\350\256\260 \346\250\241\345\235\227\345\214\226.md" @@ -0,0 +1,33 @@ +耦合度：是一种[软件度量](https://baike.baidu.com/item/软件度量?fromModule=lemma_inlink)，是指一程序中，[模块](https://baike.baidu.com/item/模块?fromModule=lemma_inlink)及模块之间信息或参数依赖的程度。 + +## 模块化： + +例如，要封装一个axios方法需要在很多个模板中使用，可以在hooks 文件夹中单独创建一个ts文件，写入如下代码 + +// 导入需要的函数 +import { ref } from 'vue' +import axios from 'axios' + +// 导出函数 +export default function useURLLoader(url: string) { + const res = ref(null) + const loading = ref(true) + const loaded = ref(false) + const error = ref(null) + + + return { + res, + loading, + loaded, + error + } +} +这个模块就是单独存在的，那个模板中需要，就可以像调用函数一样直接 import后使用 + +import useURLLoader from './hooks/useURLLoader' +... +// 可以自定义函数名，使语义更加清楚 +const { res, loaded, loading } = useURLLoader('http') +... + -- Gitee From ab3138f218e4947fd7c2abdc80a98f2d7838c5ec Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=BF=97=E6=A2=81?= <2864599615@qq.com> Date: Fri, 17 Feb 2023 04:52:09 +0000 Subject: [PATCH 04/11] 0 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: 陈志梁 <2864599615@qq.com> --- ...254\224\350\256\260 path\345\222\214fs.md" | 115 ++++++++++++++++++ 1 file changed, 115 insertions(+) create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-2-16 \347\254\224\350\256\260 path\345\222\214fs.md" diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-2-16 \347\254\224\350\256\260 path\345\222\214fs.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-2-16 \347\254\224\350\256\260 path\345\222\214fs.md" new file mode 100644 index 0000000..6ec6f31 --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-2-16 \347\254\224\350\256\260 path\345\222\214fs.md" @@ -0,0 +1,115 @@ +# 内置模块 + +## path + +导入模块 + +``` +const path = require('node:path'); +``` + +该模块可以帮助我们获取文件的路径 + +### path.resolve + +**生成绝对路径** + +``` +path.resolve([...paths]):生成绝对路径 +--直接调用:返回当前工作目录 +const path = path.resolve() +``` + +### path.join + +**拼接路径** + +``` +var lujing = path.join(__dirname,'test.txt'); +``` + +**注：使用终端执行与F5执行时，显示的路径是不一样的。** + +``` +const result = path.resolve(__dirname, "./hello.js") +let parse = path.join(__dirname,...,"test.js");//拼接操作 +``` + +## fs + +导入模块 + +``` +const fs = require("node:fs"); +``` + +用于对系统文件及目录进行读写操作 + +常用方法： + +### fs.readFile():读取文件 + +**通过fs模块读取磁盘中的数据时，读取到的数据会以Buffer（缓冲区）对象的形式返回** + +#### **同步读取** + +``` +//引入fs模块 +const fs = require("fs"); +//同步读取:会阻塞后边代码的执行 +fs.readFileSync(path.resolve(__dirname,"./hello.txt")) +``` + +#### **异步读取** + +##### 方法1 + +``` +//比起同步，异步方法性能更高，速度更快，而且没有阻塞 +fs.readFile( + path.resolve(__dirname,"./hello.txt"), + (err,buffer) =>{ + if(err){ + console.log("读取错误~") + }else{ + console.log(buffer.toString()) + } + } +) +``` + +##### 方法2：Promise读取文件 + +导入模块 + +``` +const fs = require("node:fs/promises"); +fs.readFile(path.resolve(__dirname,"./hello.txt")).then(buffer=>{ + console.log(buffer.toString()) +}) +.catch(e=>{ + console.log("读取错误~") +}) +``` + +### fs.appendFile():创建新文件 + +``` +//appendFile:异步地将数据追加到文件，如果该文件尚不存在，则创建该文件。 +fs.appendFile(lujing,"appendFile测试") + .then((buf)=>{console.log("添加成功");}) + .catch((err)=>{console.log("添加错误");}) +``` + +#### 复制文件 + +``` +//配合readFile读取文件，在新文件路径载入读取的路径 +fs.readFile(lujing) + .then((buf)=>{ + fs.appendFile(lujing2,buf) + }) +``` + + + -- Gitee From d5bce7b8ab794d238dd5c6deebc6966be187d2a3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=BF=97=E6=A2=81?= <2864599615@qq.com> Date: Sun, 19 Feb 2023 15:58:30 +0000 Subject: [PATCH 05/11] 0 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: 陈志梁 <2864599615@qq.com> --- ...3-2-17 \347\254\224\350\256\260 buffer.md" | 88 +++++++++++++++++++ 1 file changed, 88 insertions(+) create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-17 \347\254\224\350\256\260 buffer.md" diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-17 \347\254\224\350\256\260 buffer.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-17 \347\254\224\350\256\260 buffer.md" new file mode 100644 index 0000000..636691c --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-17 \347\254\224\350\256\260 buffer.md" @@ -0,0 +1,88 @@ +### 一、Buffer + +##### 1Buffer数据转为字符串 + +- 两种方法：String(buf)与buf.toString() +- 当在 Buffer 和字符串之间进行转换时，可以指定字符编码。 如果未指定字符编码，则默认使用 UTF-8。 + +##### 2、创建Buffer类 + +| API创建的类 | 说明 | +| ------------------------------------------------------ | ------------------------------------------------------------ | +| **Buffer.alloc(size[, fill[, encoding]])：** | 返回一个指定大小的 Buffer 实例，如果没有设置 fill，则默认填满 0 | +| **Buffer.allocUnsafe(size)：** | 返回一个指定大小的 Buffer 实例，但是它不会被初始化，所以它可能包含敏感的数据 | +| **Buffer.from(array)：** | 返回一个被 array 的值初始化的新的 Buffer 实例（传入的 array 的元素只能是数字，不然就会自动被 0 覆盖) | +| **Buffer.from(arrayBuffer[, byteOffset[, length]])：** | 返回一个新建的与给定的 ArrayBuffer 共享同一内存的 Buffer。 | +| **Buffer.from(buffer)：** | 复制传入的 Buffer 实例的数据，并返回一个新的 Buffer 实例 | +| **Buffer.from(string[, encoding])：** | 返回一个被 string 的值初始化的新的 Buffer 实例 | + +### 二、Stream流 + +##### 1、概念 + +Stream是一个抽象接口 + +##### 2、Stream流类型 + +- Readable --可读操作 +- Writable --可写操作 +- Duplex --可读可写操作 +- Transform --操作被写入数据，然后读出结果 + +##### 3、创建可读流/可写流 + +``` +//可读流 +var reader=fs.createReadStream(); +//可写流 +var write=fs.createWriteStream(); +``` + +##### 练习:将桌面视频使用Stream复制到文件夹 + +``` +//引入模块 +const path=require("path") +const fs=require("node:fs") + +//引用文件位置 +const Reference=path.join("C:","Users","Administrator","Desktop","3班_2023-02-17_04stream&stream.wmv") + +//所移文件位置 +const dest=path.resolve(__dirname,"./1.mp4") + + +const References=fs.createReadStream(Reference) +const dests=fs.createWriteStream(dest) + + +References.pipe(dests) +``` + +### 三、Promise + +##### 1、概念 + +promise是node.js的对象，它是一个构造函数，作用是将异步操作以同步操作的流程表达出来。解决Node.js异步编程中回调地狱的问题。 + +##### 2、promise有三个状态： + +- Pending-promise的初始状态，等到任务完成或是被拒绝；Resolved-执行完成并且成功的状态；Rejected-执行完成并且失败的状态。此三个状态不能相互逆转。 +- promise对象必须实现then方法，可以说then是promise的核心，而且then方法必须返回一个promise对象，同一个promise对象可以注册多个then方法，并且回调的执行顺序和他们注册的顺序一致。 +- then方法接收两个回调函数，他们分别是成功时的回调和失败时的回调。 + +##### 练习2：用promise得到 5+6+7+8+9 + +``` +const Prim=new Promise((resolve,reject)=>{ +return resolve(5+6) +}).then((sum)=>{ + return sum+=7 +}).then((sum)=>{ + return sum+=8 +}).then((sum)=>{ + return sum+=9 +}).then((sum)=>{ + console.log(sum); +}) +``` \ No newline at end of file -- Gitee From 950dad237727eaf9a2e55990f021846eec22c2b5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=BF=97=E6=A2=81?= <2864599615@qq.com> Date: Wed, 22 Feb 2023 14:39:04 +0000 Subject: [PATCH 06/11] =?UTF-8?q?=E9=87=8D=E5=91=BD=E5=90=8D=2019=E9=99=88?= =?UTF-8?q?=E5=BF=97=E6=A2=81/=E7=AC=94=E8=AE=B0/2022-2-16=20=E7=AC=94?= =?UTF-8?q?=E8=AE=B0=20path=E5=92=8Cfs.md=20=E4=B8=BA=2019=E9=99=88?= =?UTF-8?q?=E5=BF=97=E6=A2=81/=E7=AC=94=E8=AE=B0/2023-2-16=20=E7=AC=94?= =?UTF-8?q?=E8=AE=B0=20path=E5=92=8Cfs.md?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../2023-2-16 \347\254\224\350\256\260 path\345\222\214fs.md" | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-2-16 \347\254\224\350\256\260 path\345\222\214fs.md" => "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-16 \347\254\224\350\256\260 path\345\222\214fs.md" (100%) diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-2-16 \347\254\224\350\256\260 path\345\222\214fs.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-16 \347\254\224\350\256\260 path\345\222\214fs.md" similarity index 100% rename from "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2022-2-16 \347\254\224\350\256\260 path\345\222\214fs.md" rename to "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-16 \347\254\224\350\256\260 path\345\222\214fs.md" -- Gitee From fe509f323114726b644168677f863654f31df662 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=BF=97=E6=A2=81?= <2864599615@qq.com> Date: Wed, 22 Feb 2023 14:39:27 +0000 Subject: [PATCH 07/11] 0 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: 陈志梁 <2864599615@qq.com> --- ...41\345\276\256\344\273\273\345\212\241.md" | 85 +++++++++++++++++ ...2-21 \347\254\224\350\256\260 npm http.md" | 93 +++++++++++++++++++ 2 files changed, 178 insertions(+) create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-20 \347\254\224\350\256\260 \345\256\217\344\273\273\345\212\241\345\276\256\344\273\273\345\212\241.md" create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-21 \347\254\224\350\256\260 npm http.md" diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-20 \347\254\224\350\256\260 \345\256\217\344\273\273\345\212\241\345\276\256\344\273\273\345\212\241.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-20 \347\254\224\350\256\260 \345\256\217\344\273\273\345\212\241\345\276\256\344\273\273\345\212\241.md" new file mode 100644 index 0000000..52f6d31 --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-20 \347\254\224\350\256\260 \345\256\217\344\273\273\345\212\241\345\276\256\344\273\273\345\212\241.md" @@ -0,0 +1,85 @@ +## js执行顺序入门 + +不论是面试求职，还是日常开发工作，我们经常会遇到这样的情况：**给定的几行代码，我们需要知道其输出内容和顺序**。因为javascript是一门单线程语言，所以我们可以得出结论： + +- javascript是按照语句出现的顺序执行的 + +正因为js是一行一行执行的，所以我们以为js都是这样的： + +```javascript +let a = '1'; +console.log(a); + +let b = '2'; +console.log(b); +复制代码 +``` + +然而实际上js是这样的： + +```javascript +setTimeout(function(){ + console.log('定时器开始啦') +}); + +new Promise(function(resolve){ + console.log('马上执行for循环啦'); + for(var i = 0; i < 10000; i++){ + i == 99 && resolve(); + } +}).then(function(){ + console.log('执行then函数啦') +}); + +console.log('代码执行结束'); +复制代码 +``` + +依照js是 按照语句出现的顺序执行 这个理念，它的输出结果是不是下面这样呢？ + +```javascript +//"定时器开始啦" +//"马上执行for循环啦" +//"执行then函数啦" +//"代码执行结束" +复制代码 +``` + +我们打开chrome浏览器验证一下： + +![在这里插入图片描述](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/0420b553057846bc81f918d849845047~tplv-k3u1fbpfcp-zoom-in-crop-mark:4536:0:0:0.awebp) + +可以发现我们前面推测的结果完全不对 ❗ + +讲到这里，应该已经发现我们必须要彻底弄明白javascript的执行机制。 + +**◾ 关于javascript** + +javascript是一门单线程语言，在最新的HTML5中提出了Web-Worker，但javascript是单线程这一核心仍未改变。所以一切javascript版的"多线程"都是用单线程模拟出来的，一切javascript多线程都是纸老虎！ + +## 事件循环 Event Loop + +既然js是单线程，那么js任务就要一个一个顺序执行。如果一个任务耗时过长，那么后一个任务也必须等着。那么问题来了，假如我们想浏览新闻，但是新闻包含的超清图片加载很慢，难道我们的网页要一直卡着直到图片完全显示出来？当然不需要，js任务分为两类： + +- 同步任务 +- 异步任务 + +当我们打开网站时，网页的渲染过程就是一大堆同步任务，比如页面骨架和页面元素的渲染。而像加载图片视频之类占用资源大耗时久的任务，就是异步任务。 + +![在这里插入图片描述](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/0b7bd7b91ba64c3caf7e61d7a26542b4~tplv-k3u1fbpfcp-zoom-in-crop-mark:4536:0:0:0.awebp) + +上述图片包含了几个知识点： + +- 同步和异步任务分别进入不同的执行"场所"，同步的进入主线程，异步的进入Event Table并注册函数。 +- 当指定的事情完成时，Event Table会将这个函数移入Event Queue `(事件队列)`。 +- 主线程执行栈的任务执行完毕为空，会去Event Queue读取对应的函数，进入主线程执行。 +- 上述过程会不断重复，也就是常说的Event Loop(事件循环)。 + +那怎么知道 **主线程执行栈 为空** 啊？js引擎存在monitoring process进程 `(监视进程)`，会持续不断的检查主线程执行栈是否为空，一旦为空，就会去Event Queue `(事件队列)` 那里检查是否有等待被调用的函数。 + + + +作者：圆圆01 +链接：https://juejin.cn/post/7020710294083092493 +来源：稀土掘金 +著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。 \ No newline at end of file diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-21 \347\254\224\350\256\260 npm http.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-21 \347\254\224\350\256\260 npm http.md" new file mode 100644 index 0000000..de20da0 --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-21 \347\254\224\350\256\260 npm http.md" @@ -0,0 +1,93 @@ +# NPM 使用介绍 + +NPM是随同NodeJS一起安装的包管理工具，能解决NodeJS代码部署上的很多问题，常见的使用场景有以下几种： + +- 允许用户从NPM服务器下载别人编写的第三方包到本地使用。 +- 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。 +- 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。 + +由于新版的nodejs已经集成了npm，所以之前npm也一并安装好了。同样可以通过输入 **“npm -v”** 来测试是否成功安装。命令如下，出现版本提示表示安装成功: + +``` +$ npm -v +2.3.0 +``` + +如果你安装的是旧版本的 npm，可以很容易得通过 npm 命令来升级，命令如下： + +``` +$ sudo npm install npm -g +/usr/local/bin/npm -> /usr/local/lib/node_modules/npm/bin/npm-cli.js +npm@2.14.2 /usr/local/lib/node_modules/npm +``` + +如果是 Window 系统使用以下命令即可： + +``` +npm install npm -g +``` + +> 使用淘宝镜像的命令： +> +> ``` +> npm install -g cnpm --registry=https://registry.npmmirror.com +> ``` + +------ + +## 使用 npm 命令安装模块 + +npm 安装 Node.js 模块语法格式如下： + +``` +$ npm install +``` + +以下实例，我们使用 npm 命令安装常用的 Node.js web框架模块 **express**： + +``` +$ npm install express +``` + +安装好之后，Express 包就放在了工程目录下的 node_modules 目录中，因此在代码中只需要通过 **require（'express'）** 的方式就好，无需指定第三方包路径。 + +``` +var express = require('express'); +``` + +------ + +## 全局安装与本地安装 + +npm 的包安装分为本地安装（local）、全局安装（global）两种，从敲的命令行来看，差别只是有没有-g而已，比如 + +``` +npm install express # 本地安装 +npm install express -g # 全局安装 +``` + +如果出现以下错误： + +``` +npm err! Error: connect ECONNREFUSED 127.0.0.1:8087 +``` + +解决办法为： + +``` +$ npm config set proxy null +``` + +### 本地安装 + +- \1. 将安装包放在 ./node_modules 下（运行 npm 命令时所在的目录），如果没有 node_modules 目录，会在当前执行 npm 命令的目录下生成 node_modules 目录。 +- \2. 可以通过 require（） 来引入本地安装的包。 + +### 全局安装 + +- \1. 将安装包放在 /usr/local 下或者你 node 的安装目录。 +- \2. 可以直接在命令行里使用。 + +如果你希望具备两者功能，则需要在两个地方安装它或使用 **npm link**。 + +接下来我们使用全局方式安装 Express \ No newline at end of file -- Gitee From 7254a54837f945e38127375608e0db7d51aa7f99 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=BF=97=E6=A2=81?= <2864599615@qq.com> Date: Sun, 26 Feb 2023 14:52:57 +0000 Subject: [PATCH 08/11] 0 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: 陈志梁 <2864599615@qq.com> --- ...-23 \347\254\224\350\256\260 sequelize.md" | 116 ++++++++++++++++++ ...4\350\256\260 \346\237\245\350\257\242.md" | 52 ++++++++ 2 files changed, 168 insertions(+) create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-23 \347\254\224\350\256\260 sequelize.md" create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-24 \347\254\224\350\256\260 \346\237\245\350\257\242.md" diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-23 \347\254\224\350\256\260 sequelize.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-23 \347\254\224\350\256\260 sequelize.md" new file mode 100644 index 0000000..fd1d83c --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-23 \347\254\224\350\256\260 sequelize.md" @@ -0,0 +1,116 @@ + + +[TOC] + +连接mssql数据库 + +const {Sequelize} = require("sequelize"); +var conObj = { + database:'TESTS110', + username:'sa', + pwd:'123456', + port:'1433' +} +const seq = new Sequelize(conObj.database,conObj.username,conObj.pwd,{ + host:'localhost', + // port:conObj.port, + dialect:'mssql', + dialectOptions: { + options: { + encrypt: true, + } + } +}) +//查看是否连接成功 +(async () => { + try { + await seq.authenticate(); + console.log('连接成功.'); + } catch (error) { + console.error('连接失败', error); + } +})() + +Sequelize是一款基于Promise的支持异步操作的Node.js ORM框架，支持Postgres、MySQL、SQLite和Microsoft SQL Server等多种数据库，具有强大的事务支持、关联关系、读取和复制等功能，很适合作为Node.js后端数据库的存储接口，有助于提高Node.js应用程序的开发效率。 + + + + + + + * MySQL数据库异步操作 + */ + +const util = require("util"); + +const sql = require("mysql2"); + +const Sequelize = require("sequelize"); + +//连接建立 +const sequelize = new Sequelize("studentdb","root","wlq0MySQL@",{ + host: 'localhost', // 数据库地址 + dialect: 'mysql', // 指定连接的数据库类型 + pool: { + max: 5, // 连接池的最大连接数量 + min: 0, // 连接池的最小连接数量 + idle: 10000 // 如果一个线程10秒钟内没有被使用，那么就释放线程 + } +}); + +sequelize.authenticate().then(()=>{ + console.log("数据库连接成功"); +}).catch((err)=>{ + console.error("数据库连接错误："+err); +}); + +//模型定义 +const Model = Sequelize.Model; +class Student extends Model{}; +Student.init({ + // Id:{type:Sequelize.INTEGER,allowNull:false}, + Name:{type:Sequelize.STRING}, + Age:{type:Sequelize.INTEGER}, + Weight:{type:Sequelize.FLOAT}}, + { + sequelize, + modelName:"student" + }); + +//模型与数据库同步 +Student.sync({force:false}).then(()=>{ + console.log("数据库中的表与模型定义一致"); + + //添加记录 + Student.create({Name:"Role",Age:23,Weight:24.5}).then(()=>{ + console.log("添加成功！"); + }).catch((err)=>{ + console.error("添加错误："+err); + }); + + //查询记录 + Student.findAll().then((res)=>{ + console.log("=====sequelize查询如下======="); + console.log(util.inspect(res[0].dataValues)) + }).catch((err)=>{ + console.error("查询错误"); + }); + + //修改记录 + Student.update({Age:55},{where:{id:1}}).then(()=>{ + console.log("修改成功"); + }).catch((err)=>{ + console.error("修改失败！"); + }); + + //删除记录 + Student.destroy({where:{id:1}}).then(()=>{ + console.log("删除记录成功"); + }).catch((err)=>{ + console.error("删除记录失败！"); + }); + +}).catch((err)=>{ + console.error("模型与数据库同步错误："+err); +}); + diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-24 \347\254\224\350\256\260 \346\237\245\350\257\242.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-24 \347\254\224\350\256\260 \346\237\245\350\257\242.md" new file mode 100644 index 0000000..2d6d753 --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-24 \347\254\224\350\256\260 \346\237\245\350\257\242.md" @@ -0,0 +1,52 @@ +##### 一对一 + +```js +// 定义关系 +// 1----1 一对一关系 +User.hasOne(UserInfo, {foreignKey: 'user_id', sourceKey: 'id'}); +UserInfo.belongsTo(User, {foreignKey: 'user_id', targetKey: 'id'}); +``` + +##### 一对多 + + 添加手机表，一个用户拥有多个手机 + +```js +// 手机表 +sequelize.define('phone', { + id: { + type: DataTypes.INTEGER, + allowNull: false, + primaryKey: true, + autoIncrement: true + }, + user_id: { + type: DataTypes.INTEGER, + allowNull: false + }, + name: { + type: DataTypes.INTEGER, + allowNull: false + }, + createdAt: { + type: DataTypes.DATE, + allowNull: true + }, + updatedAt: { + type: DataTypes.DATE, + allowNull: true + } + }, { + tableName: 'phone' + }); +}; +``` + +```js +// 定义关系 +// 1----n 一对多关系 +User.hasMany(Phone, {foreignKey: 'user_id', sourceKey: 'id'}) +Phone.belongsTo(User, {foreignKey: 'user_id', targetKey: 'id'}) +``` + +##### 多对多 \ No newline at end of file -- Gitee From 3293acdb15d46f96b47263a2b650b0e3492e6468 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=BF=97=E6=A2=81?= <2864599615@qq.com> Date: Wed, 1 Mar 2023 23:35:46 +0000 Subject: [PATCH 09/11] 0 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: 陈志梁 <2864599615@qq.com> --- ...023-2-27 \347\254\224\350\256\260 koa.md" | 78 ++++++++++ ...45\346\224\266\345\217\202\346\225\260.md" | 135 ++++++++++++++++++ 2 files changed, 213 insertions(+) create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-27 \347\254\224\350\256\260 koa.md" create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-28 \347\254\224\350\256\260 koa\346\216\245\346\224\266\345\217\202\346\225\260.md" diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-27 \347\254\224\350\256\260 koa.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-27 \347\254\224\350\256\260 koa.md" new file mode 100644 index 0000000..c10bf25 --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-27 \347\254\224\350\256\260 koa.md" @@ -0,0 +1,78 @@ +koa + +[Koa](https://link.juejin.cn?target=https%3A%2F%2Fkoa.bootcss.com%2F%23)基于node.js平台的下一代web开发框架。Koa 是一个新的 web 框架，由 Express 幕后的原班人马打造， 致力于成为 web 应用和 API 开发领域中的一个更小、更富有表现力、更健壮的基石。 通过利用 async 函数，Koa 帮你丢弃回调函数，并有力地增强错误处理。 Koa 并没有捆绑任何中间件， 而是提供了一套优雅的方法，帮助您快速而愉快地编写服务端应用程序 + + + +#### 新建一个demo.js + +内容放上5句 + +```ini +const Koa = require('koa'); +const app = new Koa(); +const main = ctx => { + ctx.response.body = 'Hello World'; +}; + +app.use(main); +app.listen(3000); + +复制代码 +``` + +执行： + +``` +node demo.js +复制代码 +``` + +然后用浏览器打开[http://localhost:3000/](https://link.juejin.cn?target=http%3A%2F%2Flocalhost%3A3000%2F) 可以看见Hello world实现成功。 + +我们现在就是用koa框架，架设一个 HTTP 服务。并通过Koa提供的Context对象，控制返回给用户的内容。 + +### 控制返回内容 + +我们在上一步已经学会了使用koa写个demo，那如果你不想简单返回`hello world`，这时候你可以返回一个自己写的本地模版 直接在刚刚的demo.js修改内容,并新建一个demo.html + +```ini +const Koa = require('koa'); +const app = new Koa(); +const fs = require('fs'); + +const main = ctx => { + ctx.response.type = 'html'; + ctx.response.body = fs.createReadStream('./demo.html'); +}; +app.use(main); +app.listen(3000); +复制代码 +``` + + + +当然除此 你也可以在抛出内容的时候进行一些定义， + +```ini +const Koa = require("koa"); +const app = new Koa(); +const main = (ctx) => { + if (ctx.request.accepts("html")) { + ctx.response.type = "html"; + ctx.response.body = "

Hello World

这是直接抛

"; + } +}; + +app.use(main); +app.listen(3000); + +复制代码 +``` + +### 小结 + +到此，你已经知道简单的使用koa输出内容了，机智的你肯定早就发现内容过于简单了吧，其实本来想输出中间间的用法。基本上，Koa 所有的功能都是通过中间件实现的，前面例子里面的`main`也是中间件。但是由于我也是在学习中，下次整理输出。 + + + diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-28 \347\254\224\350\256\260 koa\346\216\245\346\224\266\345\217\202\346\225\260.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-28 \347\254\224\350\256\260 koa\346\216\245\346\224\266\345\217\202\346\225\260.md" new file mode 100644 index 0000000..f1e1d08 --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-2-28 \347\254\224\350\256\260 koa\346\216\245\346\224\266\345\217\202\346\225\260.md" @@ -0,0 +1,135 @@ +获取请求的参数 +获取get请求的参数就比较简单了，可以直接通过ctx点语法出来，下面是获取get请求参数的代码 +const Koa = require('koa') +const app = new Koa() + +app.use( async (ctx) => { + ctx.body = { + url: ctx.url, + ctx_query: ctx.query, + ctx_querystring: ctx.querystring + } +}) + +app.listen(3000, () => { + console.log('start ok') +}) +1 +2 +3 +4 +5 +6 +7 +8 +9 +10 +11 +12 +13 +14 + + + + + + + +获取post请求参数，使用原生比较繁琐，需要转换，等等介绍一下使用中间件来获取post请求参数，就很简单方便了 +//使用原生方式 +const Koa = require('koa') +const app = new Koa() + +app.use( async (ctx) => { + let data = await parseData(ctx) + ctx.body = data +}) + +app.listen(3000, () => { + console.log('start ok') +}) + +function parseData(ctx) { + return new Promise((resolve, reject) => { + try { + let str = '' + ctx.req.on('data', (data) => { + str += data + }) + ctx.req.addListener('end', () => { + resolve(parseUrl(str)) + }) + } catch (err) { + reject(err) + } + }); +} + +function parseUrl(url) { + let obj = {} + let arr = url.split('&') + arr.forEach((e, i) => { + let temparr = e.split('=') + obj[temparr[0]] = temparr[1] + }); + return obj +} +1 +2 +3 +4 +5 +6 +7 +8 +9 +10 +11 +12 +13 +14 +15 +16 +17 +18 +19 +20 +21 +22 +23 +24 +25 +26 +27 +28 +29 +30 +31 +32 +33 +34 +35 +36 +37 +38 +下面这是使用中间件：koa-bodyparser，来获取post请求的参数 +首先先得安装好中间件 +npm install koa-bodyparser --save + + + +const Koa = require('koa') +const bodyParser = require('koa-bodyparser') + +const app = new Koa() + +app.use(bodyParser()) + +app.use( async (ctx) => { + ctx.body = ctx.request.body +}) + +app.listen(3000, () => { + console.log('start ok') +}) +------------------------------------------------ -- Gitee From 1f81f3841411eb320889cab474427a69864b0124 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=BF=97=E6=A2=81?= <2864599615@qq.com> Date: Tue, 7 Mar 2023 05:34:34 +0000 Subject: [PATCH 10/11] 0 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: 陈志梁 <2864599615@qq.com> --- ...-3-02 \347\254\224\350\256\260 koaview.md" | 78 +++++++++++++++++++ ...0\256\260 koa \350\267\257\347\224\261.md" | 72 +++++++++++++++++ 2 files changed, 150 insertions(+) create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-02 \347\254\224\350\256\260 koaview.md" create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-03 \347\254\224\350\256\260 koa \350\267\257\347\224\261.md" diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-02 \347\254\224\350\256\260 koaview.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-02 \347\254\224\350\256\260 koaview.md" new file mode 100644 index 0000000..234696f --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-02 \347\254\224\350\256\260 koaview.md" @@ -0,0 +1,78 @@ +``` +var views = require('koa-views'); + +const render = views(__dirname + '/views', { + map: { + html: 'underscore' + } +}) + +// Must be used before any router is used +app.use(render) +// OR Expand by app.context +// No order restrictions +// app.context.render = render() + +app.use(async function (ctx) { + ctx.state = { + session: this.session, + title: 'app' + }; + + await ctx.render('user', { + user: 'John' + }); +}); +``` + +有关更多示例，您可以查看[测试](https://github.com/queckezz/koa-views/blob/HEAD/test/index.js)。 + +## 简单的中间件 + +如果你需要简单地渲染带有局部变量的页面，你可以安装：`koa-views-render` + +``` +npm install koa-views-render +``` + +然后只需在您的路由上使用它，其参数将传递给 .`ctx.render` + +``` +var render = require('koa-views-render'); + +// ... + +app.use(render('home', { title : 'Home Page' })); +``` + +## 应用程序接口 + +#### `views(root, opts)` + +- `root`：视图所在的位置。必须是绝对路径。所有渲染的视图都相对于此路径 +- `opts`（可选） +- `opts.autoRender`：是否用于接收呈现的模板字符串。默认值为 。`ctx.body``true` + +``` +const render = views(__dirname, { autoRender: false, extension: 'pug' }); +app.use(render) +// OR +// app.context.render = render() + +app.use(async function (ctx) { + return await ctx.render('user.pug') +}) +``` + +与。 + +``` +const render = views(__dirname, { extension: 'pug' }) +app.use(render) +// OR +// app.context.render = render() + +app.use(async function (ctx) { + await ctx.render('user.pug') +}) +``` \ No newline at end of file diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-03 \347\254\224\350\256\260 koa \350\267\257\347\224\261.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-03 \347\254\224\350\256\260 koa \350\267\257\347\224\261.md" new file mode 100644 index 0000000..825bcd6 --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-03 \347\254\224\350\256\260 koa \350\267\257\347\224\261.md" @@ -0,0 +1,72 @@ +```javascript +const Koa = require('koa') +const Router = require('koa-router') + +const app = new Koa() +const router = new Router() + +router.get('/', ctx => { + ctx.body = '你好，测不准' +}) + +// 注册路由 +app.use(router.routes()) +// 自动丰富 response 相应头，当未设置响应状态(status)的时候自动设置，在所有路由中间件最后设置(全局，推荐)，也可以设置具体某一个路由（局部），例如：router.get('/index', router.allowedMethods()); 这相当于当访问 /index 时才设置 +app.use(router.allowedMethods()) + +app.listen(3000, () => { + console.log('监听3000端口') +}) +复制代码 +``` + +增删改查的路由 + +```ini +// 获取列表，返回数组 +router.get('/', ctx => { + ctx.body = [] +}) +// 根据id获取某一项，返回对象 +router.get('/:id', ctx => { + ctx.body = {} +}) +// 新建一项 +router.post('/', ctx => { + ctx.body = {} +}) +// 根据id更新某项 +router.put('/:id', ctx => { + ctx.body = {} +}) +// 根据id删除某一项 +router.delete('/:id', ctx => { + ctx.body = {} +}) +复制代码 +``` + +> `koa-router`（支持基础的常用的 `http` 方法（`'HEAD','OPTIONS','GET','PUT','PATCH','POST','DELETE'`），生僻的请求方法会返回 `501` 状态码） + +- 如果如要在路由前增加逻辑判断，例如是否有权限访问，可以在路由中插入中间件 + +```javascript +// 定义中间件 +const auth = async (ctx, next) => { + if (ctx.url !== '/users') { + ctx.throw(401) + } + await next() +} +// 注入 +router.post('/users', auth, ctx => { + ctx.body = ctx.request.body +}) +``` + + + +作者：测不准 +链接：https://juejin.cn/post/6920445522729762824 +来源：稀土掘金 +著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。 \ No newline at end of file -- Gitee From 07b4772265c5e645430e27a6d86bbb3d03dd645c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=BF=97=E6=A2=81?= <2864599615@qq.com> Date: Mon, 20 Mar 2023 13:58:28 +0000 Subject: [PATCH 11/11] 0 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: 陈志梁 <2864599615@qq.com> --- ...45\346\224\266\346\225\260\346\215\256.md" | 151 ++++++++++++++++++ ...023-3-07 \347\254\224\350\256\260 ajax.md" | 29 ++++ ...3-3-09 \347\254\224\350\256\260 cookie.md" | 47 ++++++ ...254\224\350\256\260 session$koa_static.md" | 17 ++ ...3-3-13 \347\254\224\350\256\260 ctting.md" | 35 ++++ 5 files changed, 279 insertions(+) create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-06 \347\254\224\350\256\260 ajax\345\217\221\351\200\201\344\270\216\346\216\245\346\224\266\346\225\260\346\215\256.md" create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-07 \347\254\224\350\256\260 ajax.md" create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-09 \347\254\224\350\256\260 cookie.md" create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-10 \347\254\224\350\256\260 session$koa_static.md" create mode 100644 "19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-13 \347\254\224\350\256\260 ctting.md" diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-06 \347\254\224\350\256\260 ajax\345\217\221\351\200\201\344\270\216\346\216\245\346\224\266\346\225\260\346\215\256.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-06 \347\254\224\350\256\260 ajax\345\217\221\351\200\201\344\270\216\346\216\245\346\224\266\346\225\260\346\215\256.md" new file mode 100644 index 0000000..bbf8f5e --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-06 \347\254\224\350\256\260 ajax\345\217\221\351\200\201\344\270\216\346\216\245\346\224\266\346\225\260\346\215\256.md" @@ -0,0 +1,151 @@ +**设置** + +类型：[普通对象](http://api.jquery.com/Types/#PlainObject) + +一组配置 Ajax 请求的键/值对。所有设置都是可选的。可以使用 [$.ajaxSetup（）](https://api.jquery.com/jQuery.ajaxSetup/) 为任何选项设置默认值。 + +- **接受**（默认：`depends on dataType`) + + 类型：[普通对象](http://api.jquery.com/Types/#PlainObject) + + 一组键/值对，用于将给定映射到其 MIME 类型，该类型在请求标头中发送。此标头告诉服务器它将接受哪种响应作为回报。例如，下面定义了要随请求一起发送的自定义类型：`dataType``Accept``mycustomtype` + + `$.ajax({ accepts: { mycustomtype: 'application/x-some-custom-type' }, // Instructions for how to deserialize a `mycustomtype` converters: { 'text mycustomtype': function(result) { // Do Stuff return newresult; } }, // Expect a `mycustomtype` back from server dataType: 'mycustomtype'});` + + **注意：**您需要为此类型指定一个补充条目，才能正常工作。`converters` + +- **异步**（默认：`true`) + + 类型：[布尔值](http://api.jquery.com/Types/#Boolean) + + 默认情况下，所有请求都是异步发送的（即默认设置）。如果需要同步请求，请将此选项设置为 。跨域请求和请求不支持同步操作。请注意，同步请求可能会暂时锁定浏览器，在请求处于活动状态时禁用任何操作。**从 jQuery 1.8 开始**，不推荐使用 with jqXHR （）;您必须使用成功/错误/完成回调选项，而不是 jqXHR 对象的相应方法，例如 。`true``false``dataType: "jsonp"``async: false``$.Deferred``jqXHR.done()` + +- **之前发送** + + 类型： [函数](http://api.jquery.com/Types/#Function)（ jqXHR [jqXHR](http://api.jquery.com/Types/#jqXHR)， [PlainObject](http://api.jquery.com/Types/#PlainObject) settings ） + + 一个预请求回调函数，可用于在发送之前修改 jqXHR（在 jQuery 1.4.x 中，XMLHTTPRequest）对象。使用它来设置自定义标头等。jqXHR 和设置对象作为参数传递。这是一个[阿贾克斯事件](https://api.jquery.com/Ajax_Events/)。在函数中返回将取消请求。**从 jQuery 1.5 开始**，无论请求的类型如何，都将调用该选项。`false``beforeSend``beforeSend` + +- **缓存**（默认：`true, false for dataType 'script' and 'jsonp'`) + + 类型：[布尔值](http://api.jquery.com/Types/#Boolean) + + 如果设置为 ，它将强制浏览器不缓存请求的页面。**注意：**设置为 false 只能正确处理 HEAD 和 GET 请求。它通过将“_={timestamp}”附加到GET参数来工作。其他类型的请求不需要该参数，但在 IE8 中，当对 GET 已请求的 URL 进行 POST 时除外。`false``cache` + +- **完成** + + 类型： [函数](http://api.jquery.com/Types/#Function)（ jqXHR [jqXHR](http://api.jquery.com/Types/#jqXHR)， [字符串](http://api.jquery.com/Types/#String)文本状态 ） + + 请求完成时要调用的函数（执行 和 回调之后）。该函数传递两个参数：jqXHR（在jQuery 1.4.x中，XMLHTTPRequest）对象和一个对请求状态进行分类的字符串（、或）。**从jQuery 1.5开始**，该设置可以接受一系列函数。将依次调用每个函数。这是一个[阿贾克斯事件](https://api.jquery.com/Ajax_Events/)。`success``error``"success"``"notmodified"``"nocontent"``"error"``"timeout"``"abort"``"parsererror"``complete` + +- **内容** + + 类型：[普通对象](http://api.jquery.com/Types/#PlainObject) + + 字符串/正则表达式对的对象，用于确定 jQuery 在给定其内容类型的情况下如何解析响应。 **（新增版本：[1.5](https://api.jquery.com/category/version/1.5/)）** + +- **内容类型**（默认：`'application/x-www-form-urlencoded; charset=UTF-8'`) + + 类型：[布尔值](http://api.jquery.com/Types/#Boolean)或[字符串](http://api.jquery.com/Types/#String) + + 将数据发送到服务器时，请使用此内容类型。默认值为“application/x-www-form-urlencoded;charset=UTF-8“，这在大多数情况下都很好。如果将内容类型显式传递给 ，则始终将其发送到服务器（即使不发送任何数据）。从jQuery 1.6开始，你可以告诉jQuery不要设置任何内容类型标头。**注意：**W3C XMLHttpRequest 规范规定字符集始终为 UTF-8;指定另一个字符集不会强制浏览器更改编码。**注意：**对于跨域请求，将内容类型设置为 、 或 以外的任何内容，将触发浏览器向服务器发送预检 OPTIONS 请求。`$.ajax()``false``application/x-www-form-urlencoded``multipart/form-data``text/plain` + +- **上下文** + + 类型：[普通对象](http://api.jquery.com/Types/#PlainObject) + + 此对象将是所有与 Ajax 相关的回调的上下文。默认情况下，上下文是一个对象，表示调用中使用的 Ajax 设置（与传递给 的设置合并）。例如，将 DOM 元素指定为上下文将使该元素成为请求回调的上下文，如下所示：`$.ajaxSettings``$.ajax``complete` + + `$.ajax({ url: "test.html", context: document.body}).done(function() { $( this ).addClass( "done" );});` + +- **转换器**（默认：`{"* text": window.String, "text html": true, "text json": jQuery.parseJSON, "text xml": jQuery.parseXML}`) + + 类型：[普通对象](http://api.jquery.com/Types/#PlainObject) + + 包含数据类型到数据类型转换器的对象。每个转换器的值都是一个函数，用于返回响应的转换值。 **（新增版本：[1.5](https://api.jquery.com/category/version/1.5/)）** + +- **跨域**（默认：`false for same-domain requests, true for cross-domain requests`) + + 类型：[布尔值](http://api.jquery.com/Types/#Boolean) + + 如果要在同一域上强制跨域请求（如 JSONP），请将跨域的值设置为 。例如，这允许服务器端重定向到另一个域。 **（新增版本：[1.5](https://api.jquery.com/category/version/1.5/)）**`true` + +- **数据** + + 类型：[普通对象](http://api.jquery.com/Types/#PlainObject)或[字符串](http://api.jquery.com/Types/#String)或[数组](http://api.jquery.com/Types/#Array) + + 要发送到服务器的数据。如果 HTTP 方法是不能具有实体正文（如 GET）的方法，则会将 追加到 URL。`data` + + 当是对象时，jQuery 从对象的键/值对生成数据字符串，除非该选项设置为 .例如，转换为字符串 。如果值是数组，jQuery 会根据设置的值序列化具有相同键的多个值（如下所述）。例如，成为具有默认设置的字符串。`data``processData``false``{ a: "bc", d: "e,f" }``"a=bc&d=e%2Cf"``traditional``{ a: [1,2] }``"a%5B%5D=1&a%5B%5D=2"``traditional: false` + + 当作为字符串传递时，它应该**已经**使用正确的编码进行编码，缺省情况下为 。`data``contentType``application/x-www-form-urlencoded` + + 在带有 或 的请求中，如果字符串在 URL 中的任何位置包含双问号 （） 或在查询字符串中包含单个问号 （），则将其替换为 jQuery 生成的值，该值对于页面上库的每个副本都是唯一的（例如 ）。`dataType: "json"``dataType: "jsonp"``??``?``jQuery21406515378922229067_1479880736745` + +- **数据过滤器** + + 类型：[函数](http://api.jquery.com/Types/#Function)（字符串数据，[字符串](http://api.jquery.com/Types/#String)类型） => [任何东西](http://api.jquery.com/Types/#Anything) + + 用于处理 XMLHttpRequest 的原始响应数据的函数。这是一个预过滤功能，用于清理响应。您应该返回经过净化的数据。该函数接受两个参数：从服务器返回的原始数据和“数据类型”参数。 + +- **数据类型**（默认值：`Intelligent Guess (xml, json, script, or html)`) + + 类型：[字符串](http://api.jquery.com/Types/#String) + + 您希望从服务器返回的数据类型。如果未指定任何内容，jQuery 将尝试根据响应的 MIME 类型进行推断（XML MIME 类型将生成 XML，在 1.4 中 JSON 将生成一个 JavaScript 对象，在 1.4 中脚本将执行脚本，其他任何内容都将作为字符串返回）。可用类型（以及作为成功回调的第一个参数传递的结果）为： + + - `"xml"`：返回可通过 jQuery 处理的 XML 文档。 + - `"html"`：以纯文本形式返回 HTML;在 DOM 中插入时，将评估包含的脚本标记。 + - `"script"`：以 JavaScript 形式评估响应，并将其作为纯文本返回。通过将查询字符串参数 ， 附加到 URL 来禁用缓存，除非该选项设置为 。**注意：**这会将 POST 转换为远程域请求的 GET。在 jQuery 3.5.0 之前，仍然会执行脚本的不成功的 HTTP 响应。`_=[TIMESTAMP]``cache``true``Content-Type` + - `"json"`：以 JSON 形式评估响应并返回 JavaScript 对象。具有回调占位符的跨域请求（例如 ）使用 [JSONP](https://bob.ippoli.to/archives/2005/12/05/remote-json-jsonp/) 执行，除非请求包含在其请求选项中。JSON 数据以严格的方式解析;任何格式错误的 JSON 都将被拒绝，并引发解析错误。从 jQuery 1.9 开始，空响应也被拒绝;服务器应返回 OR 的响应。（有关正确 JSON 格式的详细信息，请参阅 [json.org](https://json.org/)。`"json"``?callback=?``jsonp: false``null``{}` + - `"jsonp"`：使用 [JSONP](https://bob.ippoli.to/archives/2005/12/05/remote-json-jsonp/) 在 JSON 块中加载。在 URL 末尾添加额外内容以指定回调。通过将查询字符串参数 ， 附加到 URL 来禁用缓存，除非该选项设置为 。`"?callback=?"``"_=[TIMESTAMP]"``cache``true` + - `"text"`：纯文本字符串。 + - 多个空格分隔的值：**从 jQuery 1.5 开始，jQuery** 可以将数据类型从它在 Content-Type 标头中接收的内容转换为您需要的值。例如，如果希望将文本响应视为 XML，请使用 for 数据类型。你也可以发出一个JSONP请求，让它作为文本接收，并由jQuery解释为XML：。类似地，速记字符串（如 ）将首先尝试从 jsonp 转换为 xml，如果失败，则从 jsonp 转换为文本，然后从文本转换为 xml。`"text xml"``"jsonp text xml"``"jsonp xml"` + +- **错误** + + 类型： [函数](http://api.jquery.com/Types/#Function)（ jqXHR [jqXHR](http://api.jquery.com/Types/#jqXHR)， 字符串文本状态， [字符串](http://api.jquery.com/Types/#String)错误抛出 ） + + 请求失败时要调用的函数。该函数接收三个参数：jqXHR（在 jQuery 1.4.x 中，XMLHttpRequest）对象、描述所发生错误类型的字符串和可选的异常对象（如果发生）。第二个参数（除了 ）的可能值为 、、 和 。发生 HTTP 错误时， 接收 HTTP 状态的文本部分，例如“未找到”或“内部服务器错误”。（在HTTP / 2中，它可能是一个空字符串）**从jQuery 1.5开始**，该设置可以接受一系列函数。将依次调用每个函数。**注意：***跨域脚本和跨域 JSONP 请求不会调用此处理程序。*这是一个[阿贾克斯事件](https://api.jquery.com/Ajax_Events/)。`null``"timeout"``"error"``"abort"``"parsererror"``errorThrown``error` + +- **全局**（默认值：`true`) + + 类型：[布尔值](http://api.jquery.com/Types/#Boolean) + + 是否为此请求触发全局 Ajax 事件处理程序。缺省值为 。设置为 以防止触发全局处理程序（如 或）。这可用于控制各种 [Ajax 事件](https://api.jquery.com/Ajax_Events/)。`true``false``ajaxStart``ajaxStop` + +- **标头**（默认：`{}`) + + 类型：[普通对象](http://api.jquery.com/Types/#PlainObject) + + 其他标头键/值对的对象，要与使用 XMLHttpRequest 传输的请求一起发送。始终添加标头，但可以在此处更改其默认值。还可以从函数内部覆盖设置中的值。 **（新增版本：[1.5](https://api.jquery.com/category/version/1.5/)）**`X-Requested-With: XMLHttpRequest``XMLHttpRequest``headers``beforeSend` + +- **ifModified**（默认：`false`) + + 类型：[布尔值](http://api.jquery.com/Types/#Boolean) + + 仅当响应自上次请求以来发生更改时，才允许请求成功。这是通过检查“上次修改时间”标头来完成的。默认值为 ，忽略标头。在jQuery 1.4中，此技术还会检查服务器指定的“etag”以捕获未修改的数据。`false` + +- **是本地**（默认：`depends on current location protocol`) + + 类型：[布尔值](http://api.jquery.com/Types/#Boolean) + + 允许将当前环境识别为“本地”（例如文件系统），即使 jQuery 默认不将其识别为“本地”。以下协议当前被识别为本地协议：、 和 。如果设置需要修改，建议在方法中修改一次。 **（新增版本：[1.5.1](https://api.jquery.com/category/version/1.5.1/)）**`file``*-extension``widget``isLocal``$.ajaxSetup()` + +- **JSONP** + + 类型：[字符串](http://api.jquery.com/Types/#String)或[布尔值](http://api.jquery.com/Types/#Boolean) + + 覆盖 JSONP 请求中的回调函数名称。将使用此值代替 url 中查询字符串的“callback=？”部分中的“回调”。因此会导致传递到服务器。**从 jQuery 1.5 开始**，设置选项以防止 jQuery 将“？callback”字符串添加到 URL 或尝试使用“=？”进行转换。在这种情况下，还应显式设置设置。例如。如果不信任 Ajax 请求的目标，请考虑出于安全原因将该属性设置为 。`{jsonp:'onJSONPLoad'}``'onJSONPLoad=?'``jsonp``false``jsonpCallback``{ jsonp: false, jsonpCallback: "callbackName" }``jsonp``false` + +- **jsonp回调** + + 类型：[字符串](http://api.jquery.com/Types/#String)或[函数](http://api.jquery.com/Types/#Function)() + + 指定 JSONP 请求的回调函数名称。将使用此值代替 jQuery 自动生成的随机名称。最好让jQuery生成一个唯一的名称，因为它可以更轻松地管理请求并提供回调和错误处理。当您想要对 GET 请求启用更好的浏览器缓存时，您可能希望指定回调。**从 jQuery 1.5 开始**，您还可以为此设置使用函数，在这种情况下，的值设置为该函数的返回值。`jsonpCallback` + +- **方法**（默认：`'GET'`) + + 类型：[字符串](http://api.jquery.com/Types/#String) + + 用于请求的 HTTP 方法（例如、、）。 **（新增版本：[1.9.0](https://api.jquery.com/category/version/1.9.0/)）**`"POST"``"GET"``"PUT"` \ No newline at end of file diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-07 \347\254\224\350\256\260 ajax.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-07 \347\254\224\350\256\260 ajax.md" new file mode 100644 index 0000000..e789f1c --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-07 \347\254\224\350\256\260 ajax.md" @@ -0,0 +1,29 @@ +#### jqXHR 对象 + +jQuery XMLHttpRequest （jqXHR） 对象从 **jQuery 1.5 开始**返回，是浏览器本机 XMLHttpRequest 对象的超集。例如，它包含 和 属性，以及一个方法。当传输机制不是 XMLHttpRequest 时（例如，JSONP 请求的脚本标记），对象会尽可能模拟本机 XHR 功能。`$.ajax()``responseText``responseXML``getResponseHeader()``jqXHR` + +从jQuery 1.5.1开始，该对象也包含该方法（它在jQuery 1.4.x中也可用，但在**jQuery 1.5**中暂时删除）。该方法可用于回调函数，例如，修改响应内容类型标头：`jqXHR``overrideMimeType()``.overrideMimeType()``beforeSend()` + +``` +$.ajax({ url: "https://fiddle.jshell.net/favicon.png", beforeSend: function( xhr ) { xhr.overrideMimeType( "text/plain; charset=x-user-defined" ); }}) .done(function( data ) { if ( console && console.log ) { console.log( "Sample of data:", data.slice( 0, 100 ) ); } }); +``` + +从 jQuery 1.5 开始返回的 jqXHR 对象实现了 Promise 接口，为它们提供了 Promise 的所有属性、方法和行为（有关更多信息，请参阅[延迟对象](https://api.jquery.com/category/deferred-object/)）。这些方法采用请求终止时调用的一个或多个函数参数。这允许您在单个请求上分配多个回调，甚至可以在请求完成后分配回调。（如果请求已完成，则会立即触发回调。jqXHR 对象的可用承诺方法包括：`$.ajax()``$.ajax()` + +- jqXHR.done（function（ data， textStatus， jqXHR ） {}）; + + 成功回调选项的替代构造，有关实现详细信息，请参阅。`deferred.done()` + +- jqXHR.fail（function（ jqXHR， textStatus， errorThrow ） {}）; + + 作为错误回调选项的替代构造，该方法将替换已弃用的方法。有关实现详细信息，请参阅。`.fail()``.error()``deferred.fail()` + +- **jqXHR.always（function（ data|jqXHR， textStatus， jqXHR|errorThrow ） { }）;**（在 jQuery 1.6 中添加） + + 作为完整回调选项的替代构造，该方法将替换已弃用的方法。`.always()``.complete()` + + 为了响应成功的请求，函数的参数与 ：data、textStatus 和 jqXHR 对象的参数相同。对于失败的请求，参数与 jqXHR 对象、textStatus 和 errorThrow 的参数相同。有关实现详细信息，请参阅。`.done()``.fail()``deferred.always()` + +- jqXHR.then（function（ data， textStatus， jqXHR ） {}， function（ jqXHR， textStatus， errorThrow ） {}）; + + 包含 and 方法的功能，允许（从 jQuery 1.8 开始）操作底层 Promise。有关实现详细信息，请参阅 [`deferred.then（）。`](https://api.jquery.com/deferred.then/)`.done()``.fail()` \ No newline at end of file diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-09 \347\254\224\350\256\260 cookie.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-09 \347\254\224\350\256\260 cookie.md" new file mode 100644 index 0000000..7166b64 --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-09 \347\254\224\350\256\260 cookie.md" @@ -0,0 +1,47 @@ +1.引入jquery.js + +```xml + +``` + +2.引入jquery cookie插件 + +```xml + +``` + +3.调用插件封装好的方法 + +a)设置新的cookie: + +```ruby +$.cookie('name'，'dumplings'); //设置一个值为'dumplings'的cookie +设置cookie的生命周期 +``` + + `$.cookie('key', 'value', { expires: 7 }); //设置为7天，默认值：浏览器关闭` + +``` +设置cookie的域名： +$.cookie('name'，'dumplings', {domain:'qq.com'}); //设置一个值为'dumplings'的在域名'qq.com'的cookie +``` + +设置cookie的路径： + +```ruby +$.cookie('name'，'dumplings', {domain:'qq.com'，path:'/'}); +//设置一个值为'dumplings'的在域名'qq.com'的路径为'/'的cookie +``` + +b)删除cookie + +```javascript +$.removeCookie('name',{ path: '/'}); //path为指定路径，直接删除该路径下的cookie +$.cookie('name',null,{ path: '/'}); //将cookie名为‘openid’的值设置为空，实际已删除 +``` + +c)获取cookie + +```javascript +$.cookie('name') //dumplings +``` \ No newline at end of file diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-10 \347\254\224\350\256\260 session$koa_static.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-10 \347\254\224\350\256\260 session$koa_static.md" new file mode 100644 index 0000000..7d19040 --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-10 \347\254\224\350\256\260 session$koa_static.md" @@ -0,0 +1,17 @@ +koa-static 是一个提供静态资源访问的中间件。 + + + +代码案例 +const Koa = require('koa'); // 引入koa +const app = new Koa(); // 创建koa应用 +const static = require('koa-static'); + +app.use(static(__dirname + '/public', { + index: false, // 默认为true 访问的文件为index.html 可以修改为别的文件名或者false + hidden: false, // 是否同意传输隐藏文件 + defer: true // 如果为true，则在返回next()之后进行服务，从而允许后续中间件先进行响应 +})) + +app.listen(3000); +访问时不需要加上 pubilc 只需要 “http://127.0.0.1:3000/文件名” 这种形式即可访问 \ No newline at end of file diff --git "a/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-13 \347\254\224\350\256\260 ctting.md" "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-13 \347\254\224\350\256\260 ctting.md" new file mode 100644 index 0000000..9846563 --- /dev/null +++ "b/19\351\231\210\345\277\227\346\242\201/\347\254\224\350\256\260/2023-3-13 \347\254\224\350\256\260 ctting.md" @@ -0,0 +1,35 @@ +**通过 jQuery，您可以把动作/方法链接起来。** + +**Chaining 允许我们在一条语句中允许多个 jQuery 方法（在相同的元素上）。** + +## jQuery 方法链接 + +直到现在，我们都是一次写一条 jQuery 语句（一条接着另一条）。 + +不过，有一种名为链接（chaining）的技术，允许我们在相同的元素上运行多条 jQuery 命令，一条接着另一条。 + +**提示：**这样的话，浏览器就不必多次查找相同的元素。 + +如需链接一个动作，您只需简单地把该动作追加到之前的动作上。 + +### 例子 1 + +下面的例子把 css(), slideUp(), and slideDown() 链接在一起。"p1" 元素首先会变为红色，然后向上滑动，然后向下滑动： + +``` +$("#p1").css("color","red").slideUp(2000).slideDown(2000); +``` + +如果需要，我们也可以添加多个方法调用。 + +**提示：**当进行链接时，代码行会变得很差。不过，jQuery 在语法上不是很严格；您可以按照希望的格式来写，包含折行和缩进。 + +### 例子 2 + +这样写也可以运行： + +``` +$("#p1").css("color","red") + .slideUp(2000) + .slideDown(2000); +``` \ No newline at end of file -- Gitee