respect778-优快云博客

原创从单 Token 到双 Token（前端部分）

双 Token 机制通过分离访问能力（access token）和续签能力（refresh token），有效解决了单 Token 方案在安全性和用户体验间的矛盾。access token 短期有效，refresh token 长期存于 HttpOnly Cookie 用于换发新 access token，并设置绝对会话上限防止无限续命。实现上需后端签发双 Token、新增 refresh 接口，前端需处理 token 自动更新和失效重试。该方案兼具安全性（access token 短期化）、体验（静默续签

2026-03-17 19:45:48 471

原创在 React 中，何时使用 useEffect ？

React开发中useEffect常被滥用，本文分析了其正确使用场景。关键区分在于：当逻辑仅涉及状态计算时（如派生状态），应直接在渲染时计算而非使用useEffect；而当需要与外部系统（如DOM操作、事件监听、第三方库等）交互时，才应使用useEffect进行初始化和清理。典型误用包括：用useEffect派生状态、在渲染可完成的计算中使用它、将其作为默认数据获取方案。正确场景包括：绑定/清理事件、DOM操作、第三方库集成、定时器管理等。记住核心原则：仅在需要与React外部系统同步时使用useEffec

2026-03-12 17:21:21 387

原创 React 状态管理：从 Redux Toolkit 到 Jotai、Zustand等主流库中，应该如何在项目中进行选择。

本文系统梳理了React状态管理的演进路线。首先指出状态管理的核心是解决状态存放和更新问题，而非单纯使用某个库。文章提出四层渐进方案：1）简单场景优先使用useState/useRef管理局部状态；2）共享但不复杂时采用Jotai原子状态；3）状态模块化时选择Zustand组织store；4）复杂项目使用ReduxToolkit确保工程化规范。强调应根据项目实际复杂度选择工具，而非盲目引入状态库，关键在于建立"状态靠近使用处"和"工具匹配问题"的思维模式。

2026-03-10 20:28:19 524

原创 Claude Code 的使用手册

本文介绍了ClaudeCode的多种实用功能和快捷操作。

2026-03-09 10:20:38 5725

原创从一次内存泄漏到彻底搞懂 React 数据流：useState 与 useRef 的深层辨析

本文深入剖析了React函数式组件中状态管理的核心问题。通过一个滚动监听Hook引发的三个疑问（cleanup执行时机、闭包状态新鲜度、内存泄漏），系统梳理了useEffect和useRef的本质差异。重点指出：1）cleanup函数执行取决于依赖项变化；2）闭包陷阱导致异步回调读取过期状态；3）useRef可保持引用稳定性，解决事件监听和状态同步问题。文章通过对比useState和useRef的特性，提出了决策矩阵：UI响应数据用useState，异步逻辑用useRef。最终揭示React函数式模型的核心

2026-01-31 13:52:22 929

原创 VUE 的基本原理

Vue响应式原理的核心是通过数据劫持和发布订阅模式实现数据驱动视图。Vue2使用Object.defineProperty劫持数据属性，Vue3改用Proxy。当组件渲染时，会触发属性的getter进行依赖收集，将当前Watcher记录到Dep中；当数据变化时触发setter，Dep通知所有关联Watcher重新渲染组件。整个过程实现了数据变更自动更新视图的效果，开发者无需手动操作DOM。

2026-01-27 10:23:35 678

原创 JavaScript 对 Promise、async 函数的理解，以及它们之间的对比

摘要：Promise是JS异步编程的核心工具，通过状态管理（Pending/Fulfilled/Rejected）和链式调用解决回调地狱问题。async/await作为Promise的语法糖，让异步代码呈现同步风格，具有更优的可读性、传值方式和错误处理。两者结合使用能有效简化复杂异步流程，其中Promise提供基础机制，async/await优化开发体验，特别适合多步依赖场景。

2026-01-09 13:38:03 650

原创 JavaScript 对异步编程的理解

JavaScript异步编程是一种处理耗时操作时组织程序执行顺序的思想。其实现方式包括：1）回调函数，但易产生回调地狱；2）Promise通过链式调用解决嵌套问题；3）Generator函数可暂停执行，但需外部执行器；4）async/await是Generator和Promise的语法糖，能以同步方式编写异步代码。这些方式使异步代码更易维护和理解。

2026-01-09 11:47:36 423

原创 JavaScript 对作用域、作用域链的理解

在当前作用域中查找所需的变量，如果找不到，就去其父级作用域找，依次向上一级作用域查找，直到访问到全局作用域（window）为止，这样一层层的查找就是作用域链。作用域链就是底层的变量查找机制1.嵌套关系的作用域串联起来形成了作用域链2.相同作用域链中按着从小到大的规则查找变量3.子作用域能够访问父作用域，父级作用域无法访问子级作用域（里层能访问外层，外层不能访问里层）

2026-01-08 14:25:00 213

原创 JavaScript 对 this 对象的理解

JavaScript中this指向由调用方式决定：1）函数调用模式指向全局对象；2）方法调用模式指向调用对象；3）构造器调用模式指向new创建的新对象；4）apply/call/bind可显式指定this。四种模式的优先级为：构造器模式 > apply/call/bind > 方法模式 > 函数模式。特别地，bind绑定的this只能通过new改变，其他方式无法覆盖。

2026-01-06 20:02:20 327

原创 JavaScript 数据类型检测的方式有哪些

JavaScript类型检测方法比较：typeof能检测基本类型但无法区分数组和null；instanceof通过原型链判断引用类型；constructor可访问构造函数但不安全；Object.prototype.toString.call()直接读取引擎内部类型标签，不受重写影响，是最可靠的解决方案。在需要严谨类型判断时应优先使用Object.prototype.toString.call()方法。

2025-12-14 00:26:09 629

原创 JavaScript 原型链理解

本文系统讲解了JavaScript原型链的核心概念，重点解析了三种关键关系：构造函数的prototype属性、实例对象的__proto__属性和实例化关系。通过分析Function和Object这两个特殊构造函数的结构，以及普通构造函数A的原型链示例，揭示了原型链的整体运作机制。文章指出所有函数都是Function的实例，所有prototype最终都指向Object.prototype，而Object.prototype是原型链的终点。掌握这些核心关系就能理解JavaScript的继承机制，解答常见的原型链

2025-12-12 22:03:43 568

原创手写Promise 思路加实现

本文详细介绍了手写Promise的实现过程，分为三个主要部分：基础结构、实例方法和静态方法。首先构建Promise类的基本框架，包括状态管理和resolve/reject功能；然后实现核心的then方法及其链式调用，处理各种返回值情况，并完成catch和finally方法；最后实现静态方法如resolve、reject、race、all、allSettled和any，处理不同参数类型的响应逻辑。整个过程遵循原生Promise的行为规范，包括状态不可变性、异步执行、错误处理等特性，为理解Promise的工作原

2025-11-27 10:57:21 1092

respect778的博客