Luke Paul Na-CSDN博客

原创暂时性死区是什么？

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

2024-08-23 13:00:00 148

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

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

2024-08-22 18:29:18 587

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

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

2024-07-30 21:00:22 306

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

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

2024-07-30 20:46:23 329

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

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

2024-07-30 15:51:31 579

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

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

2024-07-23 13:09:00 250

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

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

2024-07-22 12:45:17 139

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

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

2024-07-22 00:35:09 494

原创什么是 BEM 规范

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

2024-07-05 12:23:20 298

原创什么是 TypeScript 的函数重载

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

2024-07-04 23:50:09 343

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

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

2024-07-03 17:29:47 338

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

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

2024-07-03 12:00:00 282

原创理解 Node.js 中的缓冲区（Buffer）

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

2024-07-03 00:06:50 526

原创理解 React 的严格模式

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

2024-07-02 08:00:00 601

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

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

2024-07-01 17:24:35 475

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

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

2024-07-01 14:40:11 495

原创什么是抽象语法树（AST），以及 AST 在前端的应用。

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

2024-06-27 08:00:00 508

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

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

2024-06-26 19:31:34 435

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

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

2024-06-26 10:59:03 552

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

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

2024-06-15 00:00:00 584

原创什么是 OSI 模型？

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

2024-06-13 20:26:17 416

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

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

2024-06-13 06:00:00 691

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

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

2024-06-12 17:07:18 523

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

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

2024-06-12 06:00:00 177

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

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

2024-06-10 20:55:50 527

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

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

2024-06-10 16:57:16 293

原创 JavaScript 寻找两个数的交集

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

2024-06-10 16:16:10 328

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

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

2024-06-08 22:43:42 931

原创基于 JavaScript fetch() API 的简单封装

JavaScript 的 `fetch()` API 提供了一种现代、易用的接口，用于从服务器异步获取资源。然而，在实际项目中，我们通常需要对基础的 `fetch(）` 进行封装，以实现诸如添加默认配置、处理响应状态、自动解析响应数据、以及处理认证令牌等常见需求。

2024-04-15 22:41:02 627 2

原创给 NestJS 增加一个全局 Guard

笔者最近在写 Nest JS 后端项目，这里写一个全局守卫的示例，方便大家学习。

2024-04-14 22:27:31 1809

原创对象数组中，找出所有 type 为 “b” 的对象，把这些对象的 num 属性的值加在一起。

【代码】对象数组中，找出所有 type 为 “b” 的对象，把这些对象的 num 属性的值加在一起。

2024-02-21 19:30:00 123

原创用 JavaScript 计算两个日期之间有多少天

【代码】用 JavaScript 计算两个日期之间有多少天。

2024-02-18 13:45:40 513

原创遍历对象数组，统计符合特定条件的对象个数

在 JavaScript 开发中,我们常需要遍历对象数组,统计其中匹配指定条件的对象个数。我们假设有一个对象数组，每个对象都有一个名为prop的属性。

2024-02-18 13:34:58 343

原创 JavaScript 中如何判断对象是否相等？

在 JavaScript 中判断两个对象是否相等是一个常见的需求。1. 有唯一标识属性的（比如说对象里有唯一的 ID），很简单，只需要对比它里面的唯一标识的属性，比如 id。3. 键不同或递归比较值也不同则返回 false。1. 先判断类型,如果不是对象就直接比较。4. 全部键和值都相同则返回 true。2. 对象就遍历键并递归比较值。

2024-02-02 18:47:57 377

原创用 JavaScript 实现 rem 和 px 的互相转换

可视化大屏往往会用到 ECharts，且可视化大屏也往往需要适配不同的屏幕分辨率。在使用 ECcharts 时，我们会发现它不支持 rem 作为大小属性的单位，只支持 px。但是我们在 CSS 中习惯使用 rem 实现自适应。这就需要在 JavaScript 编写一个函数，用于实现 rem 和 px 单位的互相转换。这个函数可以自动获取根元素的字体大小，这样省去了手动定义的步骤。

2024-02-01 21:38:51 1086