lio_zero-CSDN博客

原创前端这两年的文章总结

这几天整理的一下过往的文章和笔记，备份到了 Github 上，地址👉 blog。如果我的内容帮助到了您，欢迎点个 🎉🎉🎉 鼓励鼓励 😃 ~~ 👆我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。以下整理一份分类清单（将跳转至 Github）：因为时间有限，这里只整理了一部分。其他文章会陆续整理….........

2022-06-16 23:46:11 174

原创 Node REPL

REPL(Read Eval Print Loop，交互式解释器)是一个处理 Node.js 表达式的交互式 shell，类似 Window 系统的终端或 Unix/Linux shell，我们可以在终端中输入命令，并接收系统的响应。REPL 与 Node.js 安装捆绑在一起，并执行以下所需的任务：Read − 读取用户输入的 JavaScript 代码Eval − 解释代码行的结果P...

2022-09-10 00:28:35 375

原创在 HTML canvas 绘制文本

绘制文本有两种方式：fillText(text, x, y)strokeText(text, x, y)下面，我们来看看如何在 canvas 上绘制文本。我们先创建一个 canvas 标签，并设置基本的宽高：<canvas width="200" height="400"></canvas>首先，获取对画布的引用：const canvas = docume...

2022-09-08 14:21:59 913

原创每日一算法：二分搜索

二分搜索算法是一种经典算法，它允许我们在时间复杂度为 O(log n) 的有序数组中查找给定元素的索引。在本文中，我们将回顾该算法的工作原理，并学习如何在 Javascript 中实现它。一个概念性的例子二分搜索的工作原理是连续将数组一分为二，并查看中间的数字，直到找到匹配项(或未找到匹配项)。假设我们有一个数组 [2, 3, 4, 6, 7, 9, 10]，我们需要找到数字 7 的索引。...

2022-08-18 19:42:32 322

原创实现一个 JavaScript 模板引擎

模板引擎(这里特指用于 Web 开发的模板引擎)是为了使用户界面与业务数据(内容)分离而产生的，它可以生成特定格式的文档，用于网站的模板引擎就会生成一个标准的 HTML 文档。模板引擎以一种相当简单的方式工作：您创建一个模板，并使用适当的语法将变量传递给它。例如：ES6 的模块字符串或 Underscore _.template 方法，它们都以类似的方式工作。有一些开发者将它们封装成更加健...

2022-08-12 19:59:19 166

原创 DNS — 域名系统

你通常不会尝试使用 IP 地址访问网站。可以这么做，但这很罕见。你通常使用域名。比如 baidu.com 或 lio-zero.com。这非常方便，因为例如，我可以更改用于托管网站的服务器和公司，同时保持相同的域名。将人类可读的域名映射为机器可读的 IP 地址的系统称为 DNS(域名系统)。DNS 是一个服务器网络。您的提供商将拥有自己的 DNS，您的路由器已经预先配置好使用它。您也可以...

2022-08-06 12:14:16 115 1

原创 HTTP 缓存

强缓存HTTP/1.0 使用的是 Expires 字段，HTTP/1.1 使用的是 Cache-Control 字段。Expires 即过期时间，时间是相对于服务器的时间而言的，存在于服务端返回的响应头中，在这个过期时间之前可以直接从缓存里面获取数据，无需再次请求。但这种方式存在一个问题：无需再次请求服务器的时间和浏览器的时间可能并不一致。在 HTTP 1.1 中，使用的是 Cache-...

2022-08-04 16:14:49 71

原创 URL 重定向

URL 重定向(URL redirection)—— 一种将网站访问者从一个 URL 转移到另一个 URL 的 Web 服务器技术。当用户访问其浏览器中的某个 URL 时，服务器会发回一条消息，告诉浏览器改为访问其他 URL。第二个 URL 可以在同一个域上，也可以在不同的域上。有两种常见的 URL 重定向类型。301(Moved Permanently) — 告诉浏览器(和搜索引擎)重定...

2022-08-03 20:07:12 1017

原创 HTTP 中 GET 和 POST 的区别

从原理性看：根据 HTTP 规范，GET 请求用于获取信息，而且应该是安全和幂等的，而 POST 请求表示可能修改服务器上资源从表面上看：GET 请求的数据会附在 URL 后面(浏览器地址栏、Req Header 上)，POST 的数据放在 HTTP 包体(Req Body 上)POST 安全性比 GET 安全性高GET 请求：GET 请求可以被缓存GET 请求保留在浏览器...

2022-08-03 09:19:35 127

原创 Node.js 读取环境变量

什么是环境变量？在软件开发中，“环境”是程序或进程运行的环境。环境变量是以某种方式调整环境(进程)的值。例如，考虑一些变量，在本地开发和在生产中运行时，您希望它们的值不同。虽然可以通过在代码中编写条件变量来实现这一点，但使用环境变量更容易(也是更好的做法)。下面是一个 Node.js 应用程序中的示例：// badconst env = isProduction ? 'producti...

2022-07-29 08:49:22 1270

原创 UDP 协议

UDP，即用户数据报协议，是一种传输协议，是 TCP 的替代协议。它与 TCP 的主要区别在于它是无连接的。这意味着它更快，每个发送的数据包更轻量级，因为它不包含 TCP 所需的所有信息，并且它确实具有更轻的握手过程。缺点是 UDP 不如 TCP 可靠。在 TCP 中，如果数据包丢失，协议能够处理它并重新发送数据包。在 UDP 中，这不是内置在协议中的，必须在更高级别(构建在它之上)进行...

2022-07-28 11:49:56 138

原创 TCP 协议

TCP 表示传输控制协议，它是 Web 和其他应用程序(如电子邮件)的基础。TCP 在 1981 年的 RFC 793 中定义，是 Internet 最古老的支柱之一。TCP 位于 Internet 协议(IP)之上，并构建了一个基础系统，HTTP、FTP、IMAP 等应用程序级协议都基于该系统。与 IP 和 UDP 不同，TCP 是面向连接的。在通过 TCP 进行传输之前，必须建立连接。...

2022-07-27 11:26:19 444

原创 JSDoc

JSDoc 是许多代码库中使用的一种流行的内联文档方法。编写 JSDoc 是为了增强代码的可读性，以及方便导出 API 文档。为什么要使用 JSDoc？JSDoc 是 DocBlock 的 JavaScript 实现，DocBlock 是一种用于各种编程语言(包括 PHP、Ruby 和 Python)的文档方法。它提供了一种一致且可识别的文档方法。还有几个工具可以根据 JSDoc 注释自动...

2022-07-24 11:54:37 1002

原创每日一算法：选择排序

选择排序是一个很容易理解排序算法。思路：我们选择第一项。然后我们将其与第二项进行比较。如果第二项较小，我们将其与第一项交换。以此类推，我们将第一项与数组中的每一项进行比较。一旦我们知道我们有最小的项，我们就切换到第二个元素，并将它与数组中的每一项进行比较，忽略索引 0，因为我们已经知道这是最小值。以此类推，直到数组结束。如您所见，该算法非常昂贵。它不仅迭代数组的每一项：对于每一项，它都会...

2022-07-23 06:51:27 132

本文已整理到 Github，地址 ???? blog。本文的目标是编写一个与 then/promise 类似的符合 Promise/A+ 的实现。以下前半部分译自 Implementing promises from scratch，也是本文的重点。你可以查看原文，它还使用 TDD 方式，编写一些测试用例，帮助你理解。下半部分是 Promise 各个方法的实现。Promise 状态Promis...

2022-07-11 21:47:46 168

原创 Vue Props

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。Props 是任何现代 JavaScript 框架的重要组成部分。在组件之间传递数据的能力是 Vue 项目的基本要素。在 Vue3 中，访问 props 的方式与以前有所不同...

2022-06-25 17:00:55 248

原创 Vue3 使用 Event Bus

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。在 Vue2 中，创建 Event Bus 如下：export const bus = new Vue()bus.$on(...)bus.$emit(...)在 Vue...

2022-06-25 16:45:13 3029

原创重定向到另一个页面

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。使用 HTML：<meta http-equiv="refresh" content="0;URL=https://github.com/lio-zero" /&gt...

2022-06-25 00:26:39 735

原创构建模块打包器

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。本文的模块打包器来自示例 Minipack，我们将来了解它是如何一步步实现的。首先，我们先来了解实现一个模块打包器所需要依赖的 babel 插件：@babel/trav...

2022-06-24 19:13:25 114

原创实现一个 add 方法

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。实现一个 add 方法，预期效果如下：add(1)(2, 3)(4).value() // 10实现如下：function add(...args) { const ...

2022-06-24 01:55:42 426

原创实现 JSON.parse

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。之前在 JavaScript Eval 中有提到过，在没有 JSON.parse 方法之前，我们使用 eval 来对 JSON 字符串进行反序列化。偶然间发现了一篇 JSON...

2022-06-24 01:40:43 229

原创 Git hooks

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。Git hooks 是每次 Git 存储库中发生特定事件时自动运行的脚本。它们允许您定制 Git 的内部行为，并在开发生命周期的关键点触发可定制的操作。在提交创建过程...

2022-06-21 17:48:11 229

原创什么是包管理器？

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。包管理器允许您管理项目正常工作所需的依赖项(您或其他人编写的外部代码)。包管理器是分布式软件的集合。它是一个巨大的插件库，不是环境或编程语言的原生代码库，而是在其上提供一些...

2022-06-18 12:16:48 1331

原创 Mongoose 更新文档

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。Mongoose 有 4 种不同的方式来更新文档。Document.save()Model.updateOne()和 updateMany()Document.u...

2022-06-14 00:01:43 546

原创 Mongoose 解决 Query was already executed 问题

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。当给定查询执行两次时，Mongoose 会抛出 "Query was already executed"(查询已执行)错误。对此最常见的解释是您正在混合 await 和回调。...

2022-06-14 00:01:23 1157

原创 Mongoose 插入文档

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。在 MongoDB 中，upsert 是指在没有文档匹配 filter 的情况下插入新文档的更新。要在 Mongoose 中插入文档，应将 upsert 选项设置为 Mode...

2022-06-13 13:29:32 315

原创 Mongoose 中的枚举

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。Mongoose String 和 Number 类型有一个 enum 验证器。enum 验证器是一个数组，它将检查给定的值是否是数组中的项。如果该值不在数组中，当您尝试 s...

2022-06-13 13:22:43 301

原创 Mongoose 中的 Promise

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。Mongoose 内置了对 promises 的支持。在 Mongoose 5.x 以上的异步操作中，如 .save() 和 .find().exec() 返回一个 Prom...

2022-06-13 00:18:13 437

原创 Mongoose 数组

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。Mongoose 的 Array 类使用额外的 Mongoose 功能扩展了普通的 JavaScript 数组。例如，假设您有一个带有 tags 数组的 BlogPost ...

2022-06-13 00:17:55 394

原创 CSS 实现文本溢出省略效果

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。单行文本溢出以下是截断单行长文本的 CSS 片段：.truncate { width: 250px; overflow: hidden; text-overf...

2022-06-13 00:09:54 346

原创 Mongoose Schema 和 SchemaTypes

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。在 Mongoose 中，Schema 是模型的配置对象。 Schema 不允许您从 MongoDB 读写，这就是模型的用途。它可以：定义保存在 MongoDB 中的文...

2022-06-12 14:54:44 951

原创在 Mongoose 中使用 MongoDB Explain

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。在 MongoDB 中，explain 命令告诉 MongoDB 服务器返回有关其如何执行查询的统计信息，而不是查询结果。Mongoose 查询有一个 explain() 方...

2022-06-12 14:54:25 207

原创 Mongoose aggregate

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。Mongoose aggregateMongoose 的 aggregate() 方法是如何将 MongoDB 的聚合框架与 Mongoose 一起使用的。Mongoose...

2022-06-12 14:54:11 1003

原创 Mongoose Populate

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。在 Mongoose 中，Populate 允许您引用其他集合中的文档。其类似于 SQL 中的左外部连接，但区别在于 Populate 发生在 Node.js 应用程序中，而...

2022-06-12 14:53:56 1644

原创 Mongoose 查询文档

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。查找所有文档Mongoose Model.find(filter, callback) 方法允许您查询具有给定键/值的文档，它将返回与给定过滤器匹配的文档数组。假设你有一...

2022-06-12 14:09:49 980

原创什么是 XSS 攻击？

这几天整理的一下过往的文章和笔记，备份到了 Github 上，地址???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~ ????我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。XSS(Cross Site Scripting)是跨站脚本攻击。它是一种网站应用程序的安全漏洞攻击，是代码注入的一种。它允许恶...

2022-06-09 15:21:58 388

原创使用 v-once 和 v-memo 指令来提升性能

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。优化渲染的一种极其简单的方法是仅重新渲染所需要的内容。每当组件的数据发生更改时，该组件及其子组件将重新渲染，Vue 中的 v-once 和 v-memo 指令可以减少这种不必...

2022-05-31 16:46:18 428

原创使用 Styled Components 编写样式化组件

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。Styled Components 是一个 CSS-in-JS 库，可让您编写常规 CSS 并将其附加到 JavaScript 组件。使用 styled-components，...

2022-05-31 15:58:41 640

原创 JavaScript Eval

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。先说明。eval 已过时，尽量不要在使用它。eval 执行包含代码的字符串，例如：eval('var x = "Hello eval!"')x // 'Hello...

2022-05-31 13:45:43 62

原创 JavaScript 函数记忆

本文已整理到 Github，地址 ???? blog。如果我的内容帮助到了您，欢迎点个 Star ???????????? 鼓励鼓励 :) ~~我希望我的内容可以帮助你。现在我专注于前端领域，但我也将分享我在有限的时间内看到和感受到的东西。Memoization — 函数记忆或函数缓存，是一种优化技术，用于许多编程语言中，以减少冗余、昂贵的函数调用。这是通过缓存函数的返回值来实现的。以下是一个昂贵的函数调用，它...

2022-05-31 00:17:15 204

空空如也

空空如也