自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(64)
  • 收藏
  • 关注

原创 TypeScript:判断两个 Date 对象是否为同一天

【代码】TypeScript:判断两个 Date 对象是否为同一天。

2025-03-25 22:08:38 70

原创 TypeScript:根据指定的键值(默认为id)从数组A中筛选出存在于数组B中的元素,支持自定义键名,适用于多种数据结构的过滤场景。

【代码】TypeScript:根据指定的键值(默认为id)从数组A中筛选出存在于数组B中的元素,支持自定义键名,适用于多种数据结构的过滤场景。

2025-03-25 20:14:17 66

原创 TypeScript 生成指定范围内的随机数,并支持控制小数点后的位数

【代码】TypeScript 生成指定范围内的随机数,并支持控制小数点后的位数。

2025-03-20 15:33:24 167

原创 自用基于 TypeScript 的 WebSocket 客户端封装

【代码】自用基于 TypeScript 的 WebSocket 客户端封装。

2025-03-19 22:43:49 308

原创 通过 JS 根据屏幕宽度自动设置 1rem 的大小

本示例代码以屏幕宽度 1920 为基础,根据屏幕缩放比例自动调整 1rem 的大小。

2025-02-21 11:21:12 122

原创 使用 Node.js 读取当前 Linux 发行版信息

【代码】使用 Node.js 读取当前 Linux 发行版信息。

2025-02-15 21:48:16 135

原创 自用的让 AI 生成符合要求的JSDoc 注释的提示词(prompt)

【代码】自用的让 AI 生成符合要求的JSDoc 注释的提示词(prompt)

2025-02-15 12:19:51 125

原创 对于 NestJS + TypeORM 查询构造器分页功能的简单二次封装

NestJS 作为 Node.js 领域备受欢迎的框架,其与 TypeORM 的结合为开发者提供了强大的 ORM 能力,简化了数据库操作。然而,在处理分页查询时,直接在每个服务方法中重复编写分页逻辑既不高效也容易出错。为此,我们可以通过创建一个通用的分页处理函数,将分页逻辑从业务逻辑中抽离出来,达到代码复用和模块化的目的。

2025-01-11 21:51:18 486

原创 对于 TypeORM 精准&模糊查询的简单二次封装

笔者目前在做 `NestJS + TyoeORM` 项目,需要对查询逻辑进行二次封装,以适应多变的查询需求。本文将通过一个具体的示例——`addQueryFilterConditions` 函数,探讨如何在 TypeORM 中实现精确匹配和模糊查询的灵活结合,从而提升查询的灵活性和可维护性。

2025-01-10 20:09:50 847

原创 JavaScript:在树形的对象数组中,给定一个键(key)及其对应的值,寻找并返回该对象下另一个指定键的值。

【代码】JavaScript:在树形的对象数组中,给定一个键(key)及其对应的值,寻找并返回该对象下另一个指定键的值。

2025-01-10 00:26:51 119

原创 JavaScript 在对数组进行 map 或者 forEach 的时候有办法知道当前遍历的元素是最后一个元素吗?

方法本身并没有提供直接的方式来知道当前遍历的元素是否是数组的最后一个元素。不过,可以通过数组的长度来判断当前元素是否是最后一个元素。就是用来判断当前元素是否是最后一个元素。在 JavaScript 中,

2024-11-27 21:19:13 229

原创 JavaScript:遍历一个对象数组,获取每个对象中 mainKeyId 对应的值,并以这个值作为新属性的键名,给该对象添加一个新属性。

假设我们有一个对象数组,每个对象包含一个mainKeyId字段,以mainKeyId的值作为新的键名,并给它添加一个新的属性。

2024-11-26 21:54:19 285

原创 暂时性死区是什么?

具体来说,从作用域开始到变量声明的这段时间,变量处于暂时性死区。只有在变量实际被声明并初始化之后,才能正常访问它。声明变量时,这些变量在声明之前无法访问,即便是声明了该变量,但只要在声明之前尝试访问它,就会抛出。暂时性死区(Temporal Dead Zone,简称 TDZ)是 JavaScript 中。暂时性死区的引入是为了避免在变量声明之前访问它们,确保代码更加安全和可预测。这段时间就称为暂时性死区。变量声明的一种行为。会触发暂时性死区,导致抛出。

2024-08-23 13:00:00 242

原创 如何通过 JavaScript 实现点击按钮下载

在现代 Web 开发中,有时我们需要提供用户点击按钮直接下载文件的功能,而不是简单地让浏览器直接访问链接。这种方式更加直观且用户体验更好,因为它避免了用户在新标签页或当前页面中打开文件的麻烦。

2024-08-22 18:29:18 1238 2

原创 算法题:使用 JavaScript 将罗马数字转换成阿拉伯数字

上一篇我们讲到了将阿拉伯数字转换成罗马数字,这一篇反其道行之。

2024-07-30 21:00:22 368

原创 算法题:使用 JavaScript 将阿拉伯数字转为罗马数字

数组包含罗马数字符号及其对应的整数值,从大到小排列,以便于按顺序处理。

2024-07-30 20:46:23 454

原创 在 Git 中完全同步分支至主分支状态及团队成员同步其本地分支至远程仓库的最新状态,同时保留未提交的更改。

在 Git 中完全同步分支至主分支状态及团队成员可以安全地同步其本地分支至远程仓库的最新状态,同时保留未提交的更改。

2024-07-30 15:51:31 848

原创 为什么 Vue Router 的 History 模式和 React Router 的 Browser 模式需要服务器支持?

为了防止这种情况,服务器需要被配置为在接收到任何未知路径的请求时,都返回 SPA 的入口 HTML 文件(通常是。或者通过书签访问某个页面时,浏览器会向服务器发送一个请求,期望从服务器获取相应的资源。这样,前端 JavaScript 才有机会接管路由,解析 URL 并渲染正确的页面。动态生成的,服务器上并没有对应的物理文件。如果没有正确的服务器配置,当用户尝试访问。这里的问题是,在单页应用(SPA)中,所有的“页面”实际上都是由前端。模式下的 URL 更像是传统的服务器路由,当用户直接在地址栏输入。

2024-07-23 13:09:00 305

原创 【基础知识】有了 var 为什么还要用 let 声明变量?

ES6 带来了新的变量声明方式:`let` 和 `const`。 `var`、`let` 都可以用来声明非常量的变量,但它们有一些重要的区别,使得 `let` 在很多情况下更优于 `var`。

2024-07-22 12:45:17 171

原创 使用原生 HTML + JS 实现类似 ChatGPT 的文字逐字显示效果

ChatGPT 的逐字显示效果很酷炫,那么我们可以尝试实现类似的效果。

2024-07-22 00:35:09 666

原创 什么是 BEM 规范

BEM(Block, Element, Modifier)是一种 CSS 命名规范,旨在提高代码的可读性和可维护性。BEM 规范通过明确的命名规则来定义组件和组件的各个部分,使开发者能够更容易地理解和维护代码。

2024-07-05 12:23:20 424

原创 什么是 TypeScript 的函数重载

函数重载的第一步是定义多个函数签名。这些签名包括函数名称、参数类型和返回类型,但没有函数体。在这个例子中,我们定义了两个重载签名,一个接受两个字符串参数并返回一个字符串,另一个接受两个数字参数并返回一个数字。

2024-07-04 23:50:09 417

原创 React 函数式组件里面有生命周期吗?没有怎么办?

React 函数式组件没有像类组件那样传统的生命周期方法,但是通过 React Hooks,可以在函数式组件中实现类似的生命周期行为。

2024-07-03 17:29:47 412

原创 如何解决因过度渲染导致 React 项目出现安全和性能问题

尽管重新渲染本身并非直接的安全威胁源,但它潜在地与一些间接的安全隐患相关联,尤其是当渲染过程缺乏适当的控制和管理时。:频繁且不受控制的重新渲染可能导致应用程序在不经意间展示或记录敏感信息,尤其是在处理用户输入或动态数据时。如果数据清理和验证逻辑不够严谨,就可能在多个渲染周期中暴露不应公开的信息。:持续的重新渲染会消耗大量计算资源,包括 CPU 周期和内存。在极端情况下,这可能使应用变得响应迟缓,甚至完全无响应,为分布式拒绝服务(DDoS)攻击创造了条件,即攻击者通过诱导应用进行大量不必要的计算来耗尽其资源。

2024-07-03 12:00:00 350

原创 理解 Node.js 中的缓冲区(Buffer)

在 Node.js 中,缓冲区(Buffer)是用于处理二进制数据的类。尤其是处理像 TCP 流、文件 I/O 等数据流时非常有用,由于 JavaScript 原生不支持二进制数据操作,Buffer 类填补了这一空白,提供了高效且安全的内存管理机制。Buffer 类是 Node.js 处理二进制数据的核心,它的高效特性和丰富的功能使其在处理 I/O 密集型任务时表现出色,是构建高性能服务器端应用的关键组件。在进行字符串与 Buffer 之间转换时,确保使用正确的字符编码,以免数据丢失或错误。

2024-07-03 00:06:50 623

原创 理解 React 的严格模式

React 的 Strict Mode(严格模式)是一种用于检测应用中潜在问题的开发工具。它不会渲染任何可见的 UI 元素,而是通过激活额外的检查和警告来辅助开发。Strict Mode 主要在开发模式下工作,不会影响生产环境的构建。通过 Vite 脚手架创建的 React 项目默认已经设置了严格模式。

2024-07-02 08:00:00 1056

原创 浏览器沙盒机制及其作用

沙盒机制指的是浏览器为每个网站或每个标签页创建一个独立的运行环境,这个环境与操作系统和其他标签页隔离开来。这样即使某个网站上的代码恶意或包含漏洞,它也只能在自己的沙盒中运行,不会影响其他网站或操作系统本身。浏览器的沙盒机制通过隔离网站内容、限制权限访问和实施严格的安全策略,有效地保护了用户的隐私和系统的安全,防止恶意代码造成更大的危害。这是现代浏览器提供的重要安全特性之一,也是 Web 安全的基本保障。

2024-07-01 17:24:35 700

原创 什么是 XSS 攻击?如何防范

跨站脚本攻击(XSS)是一种常见的网络安全威胁,它允许恶意攻击者在受害者浏览器中注入并执行未经授权的脚本代码。这些脚本能够盗取敏感信息、操控网页内容或模拟用户行为,严重威胁用户数据安全及网站信誉。

2024-07-01 14:40:11 549

原创 什么是抽象语法树(AST),以及 AST 在前端的应用。

抽象语法树(Abstract Syntax Tree,AST)是一种抽象表示源代码结构的树形数据结构它以直观的方式展现了代码的逻辑组成。通过 AST,编程语言的复杂结构被简化为一系列节点和边,便于程序理解和操作。

2024-06-27 08:00:00 667

原创 关系型数据库和非关系型数据库

关系型与非关系型数据库各具特色,选择依据在于具体需求:数据结构复杂性、查询需求、系统可扩展性及一致性的要求。理解两者差异,有助于做出更合适的数据库选型决策。

2024-06-26 19:31:34 461

原创 React 中 useState 和 useReducer 的联系和区别

useReducer 和 useState 是 React 中用于管理组件状态的两个不同的 Hook。

2024-06-26 10:59:03 606

原创 Web Works API 和 Promise 的对比和区别

Web Workers 和 Promise 都是强大的工具,用于不同的异步处理场景。Web Workers 适用于需要并行处理的复杂任务,通过后台线程避免阻塞主线程。而 Promise 则简化了单线程中的异步操作管理,使代码更加清晰和结构化。根据具体需求选择合适的技术,可以显著提升网页的性能和用户体验。

2024-06-15 00:00:00 687

原创 什么是 OSI 模型?

OSI 模型(开放式系统互联模型)是一个由国际标准化组织(ISO)提出的概念模型,旨在为计算机网络的互联互通提供标准框架(定义于 ISO/IEC 7498-1)。该模型将通信系统中的数据流划分为七个层,从分布式应用程序数据的最高层表示到跨通信介质传输数据的物理实现。

2024-06-13 20:26:17 561

原创 什么是 RESTful API?谈谈你对它的理解。

(Representational State Transfer API)是一种基于 REST 架构风格的应用程序接口(API)。REST 由 Roy Fielding 在 2000 年提出,主要用于创建网络应用程序,使客户端和服务器之间可以通过 HTTP 协议进行通信。RESTful API 遵循一组约束和原则,旨在提高系统的可扩展性、性能和简洁性。

2024-06-13 06:00:00 747

原创 JavaScript 在浏览器和 Node.js 里的运行流程

当所有回调函数执行完毕,没有更多事件等待处理,且没有其他 JavaScript 代码正在执行时,Node.js 进程结束。:浏览器首先加载 HTML 文档,并开始解析构建 DOM 树。这一步骤包括下载并解析所有的 HTML 标记。标签时,解析过程会暂停并开始加载和执行 JavaScript 文件。如果是外部脚本(通过。属性链接),则需等待下载完成后再执行;如果是内联脚本,则立即执行。:启动 Node.js 进程时,首先加载环境和模块(如。的模块系统),以及用户的主脚本。

2024-06-12 17:07:18 566

原创 JavaScript:移除数组中的重复元素

移除数组中的重复元素是指在数组中去掉所有重复的元素,使得数组中每个元素都是唯一的。这是数据清洗和去重的基本操作。

2024-06-12 06:00:00 250

原创 基于 Vue 3 封装一个 ECharts 图表组件

在前端开发中,数据可视化是展示数据的重要方式之一。ECharts 是一个强大的开源可视化库,能够帮助我们轻松地创建各种图表。本文将介绍如何在 Vue 3 项目中使用 ECharts 封装一个图表组件。

2024-06-10 20:55:50 600

原创 JavaScript 将数组中的所有元素向右移动 K 位

将数组中的所有元素向右移动 k 位是一个常见的数组操作,目的是将数组中的每个元素向右移动 k 个位置,如果超出数组长度则循环到数组的开始位置。

2024-06-10 16:57:16 365

原创 JavaScript 寻找两个数的交集

找出数组交集在数据处理、集合操作等场景中非常常见。例如,在数据分析中需要找出两个数据集的共同元素,或在处理用户权限时需要找出两个权限集合的交集。数组的交集是指两个数组中都包含的元素集合。即在两个数组中都存在的元素所组成的新的数组。

2024-06-10 16:16:10 519

原创 为什么我要使用诸如 Redux、Vuex 和 Pinia 的状态管理库,而不是封装 localStorage 或者 sessionStorage?

笔者之前在某家公司面试,我在介绍我简历上的 Pinia 的时候,面试官问了我这样一道题:为什么你选择用 Pinia 而不是封装 localStorage 或者 sessionStorage?当时把我问住了,只能搪塞过去。使用诸如 Redux、Vuex 和 Pinia 这样的状态管理库,而不是直接封装或数据管理复杂性性能优化开发效率调试和测试支持代码维护性以及跨平台适用性。

2024-06-08 22:43:42 1006

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除