- 博客(141)
- 收藏
- 关注
RSS订阅原创 React 第三十六节 Router 中 useParams 的具体使用及详细介绍
核心用途：提取动态路由参数。关键注意点：处理 undefined、类型安全、参数命名一致性、组件更新逻辑。最佳实践：始终为参数设置类型，使用可选链或默认值，并通过useEffect监听参数变化。通过合理使用useParams，我们可以高效实现动态路由功能，同时避免常见的参数处理陷阱。
2025-04-30 17:05:57
495
原创 25年第八本【活着】
这种叙事减法产生了惊人的效果：当政治话语的油彩被擦除，露出的是人性最原始的生存图景。福贵在埋葬亲人时近乎仪式化的平静，恰似海明威笔下的冰山，八分之一的表象下涌动着八分之七的生命暗流。家珍的软骨病隐喻着精神钙质的流失，有庆的献血之死揭示制度暴力如何渗透毛细血管。这种近乎禅宗的顿悟，使小说超越了简单的苦难叙事，抵达了形而上的哲学高度。从被宰杀的老牛到被剥皮的羊羔，这些沉默的受难者与人类形成残酷的互文。当福贵笑着讲述自己的故事时，他已然完成了从悲剧主人公到存在智者的蜕变，在死亡的灰烬中窥见了生命的磷火微光。
2025-04-29 15:41:15
130
原创 React 第三十五节 Router 中useNavigate 的作用及用途详解
是中引入的一个钩子函数，用于。它替代了旧版本（v5及以下）中的useHistory，提供了更简洁的 API 来实现页面跳转、历史记录操作（如前进/后退）等功能。
2025-04-29 15:26:49
633
原创 React 第三十四节 Router 开发中 useLocation Hook 的用法以及案例详解
传递的数据会存储在浏览器历史记录中，敏感数据应避免使用。，只能在函数组件或自定义 Hook 中使用。该对象是只读的，修改不会影响实际路由。完整示例：带参数过滤的商品列表。注：如有错误地方，欢迎批评指正。location 对象。，可用于跟踪用户历史操作。1、不可在类组件中使用。
2025-04-29 14:30:02
373
原创 25年第七本【一句顶一万句】
这种后现代的荒诞，在今天的视频通话时代显得尤为尖锐——我们拥有了即时对话的技术，却失去了促膝长谈的能力。就像当下社交媒体中的表情包狂欢，看似热闹的交流背后，是意义在符号转换中的持续流失。就像当下网络空间中永不停歇的弹幕风暴，人们在语言的狂欢中获得的不是共鸣，而是更深的孤独。当我们不再执着于"一句顶一万句"的终极答案，反而能在语言的缝隙中触摸到真实的存在温度。从"杨百顺"到"杨摩西"再到"罗长礼"，每个名字都是社会关系强加的符码，是生存困境中的临时庇护所。这种沉默的智慧，在信息爆炸的今天显得尤为珍贵——
2025-04-19 18:07:37
376
原创 电脑 访问 github提示 找不到网页，处理方案
如果有，则需要 检查 github.com 与 github.global.ssl.fastly.net 前面的ip是否正常；如果文件中没有 github的配置，需要自己手动添加上去；用管理员身份打开 hosts 文件。
2025-04-19 17:53:59
455
原创 React 第三十三节 ReactRouter 中 useSearchParams 使用详解及注意事项
定义：用于返回当前 URL 的的元组和用于更新它们的函数。设置会导致导航。// ...返回两个参数： 当前实例的对象，这上面挂载了 获取设置等URL 参数值方法：更新 searchParams 的 Set函数；
2025-04-19 17:46:42
509
原创 React 之 Redux 第三十二节 Redux 常用API及HOOKS，以及Redux Toolkit核心API使用详解
优先使用 Redux Toolkit 替代传统 Redux（减少样板代码）严格遵循不可变性原则reducer避免单个文件过大异步操作规范化： 使用或中间件性能敏感场景 使用记忆化选择器（reselect通过结合React Hooks 和 Redux Toolkit，可以显著简化Redux的使用复杂度，同时保持代码的可维护性和性能。
2025-04-14 16:53:06
456
原创 React 之 Redux 第三十一节 useDispatch() 和 useSelector()使用以及详细案例
1、使用 redux 方便在 reducer 中集中式管理业务代码，提升代码的维护性；2、使用 store 统一管理 购物车的状态，方便代码进行复用，只需要传入对应参数即可；3、如果是简单的逻辑，使用redux 进行状态管理，会增加代码的负责性，不如 直接使用 React 中自带的 HOOKS 进行实现；4、多页面共享数据状态，业务逻辑复杂的，使用 redux 更方便一些；
2025-04-09 22:43:41
555
原创 React 第三十节 使用 useState 和 useEffect Hook实现购物车
setXX()函数进行修改 对象类型时候，需要修改指针和值这样才会触发唯一性进行数据更新；实现的购物车，只能在当前页使用，使用 React 自带的 useState()、useEffect()。Hook 即可实现购物车。监测 商品列表的变化。b、列表中每一项需要有。
2025-04-09 22:33:40
367
原创 前端大文件上传方案【断点续传】与【切片上传】的差异
断点续传：解决传输中断的恢复问题；切片上传：解决大文件传输的效率问题；断点续传本质是一种容错恢复机制；切片上传本质是一种分而治之的传输策略；
2025-04-07 18:00:49
318
原创 大文件上传之断点续传实现方案与原理详解
将大文件切割为固定大小的块（如5MB）：上传中断后根据记录继续上传未完成块。：所有块上传完成后进行有序合并。：根据网络状况动态调整分块尺寸。可显著提升大文件传输的可靠性。按索引顺序合并保证文件正确性。：持久化存储已上传分块信息。上传前先查询服务端上传进度。：通过哈希值验证块完整性。合并完成后清理临时分块。服务端保存每个文件的。跳过已上传成功的分块。
2025-04-07 17:21:50
308
原创 前端加密方式 AES对称加密 RSA非对称加密 以及 MD5哈希算法详解
MD5：仅用于生成不可逆哈希，无法解密。加密解密：使用AES 等对称加密算法，但需注意前端安全性局限。敏感操作尽量依赖后端，结合 HTTPS 和现代加密算法。
2025-04-03 11:04:08
590
原创 25年第六本【自我与本我】
读完弗洛伊德的《自我与本我》，我最大的感受就是：原来每个人的心里都住着三个小人儿，天天在吵架！？"这本书就像给我们的内心装了个监控摄像头，把那些自己都说不清的心理活动拍得明明白白。
2025-04-02 11:24:07
543
原创 JS开发中常用数组方法使用注意事项及详解【面试题】
无返回值（push 返回新长度，pop 返回被删元素）、不会修改数组原有序列。遍历数组并返回新数组，每个元素经过回调函数处理。时间复杂度高（每次操作需要移动所有元素），避。回调函数需返回布尔值（true 保留元素）（频繁增删建议使用 Set 或链表）遍历数组，执行回调函数（无返回值）元素，通过指定位置和数量操作。过滤数组，保留符合条件的元素。（第二个参数）建议明确指定，，返回被删除元素组成的数组。findIndex: 返回。unshift: 在数组。，会破坏原有数组的序列。组的某部分，生成新数组。
2025-03-24 16:36:51
397
原创 js 中 如何获取数组的交集【面试题】
在现代浏览器中支持良好，若需支持旧环境（如 IE），需引入 Polyfill。提高查询效率，然后遍历第一个数组并过滤出同时存在于 Set 中的元素。如果对象没有唯一标识符，或需要比较所有属性，可以使用。过滤基准集合，最终返回所有数组的共同元素。：如果输入空数组或交集为空，直接返回空数组。：深比较需要递归处理嵌套对象，确保。确保第一个数组中的元素唯一。：如果多个数组中的对象实际上是。：返回的交集元素始终唯一。，优先使用唯一标识符方案。，对象元素需额外处理。如果对象有唯一标识符。
2025-03-24 16:27:23
472
原创 开发中常用的设计模式 用法及注意事项【面试题】
单例模式： 用于全局状态管理、配置共享，注意避免全局污染；工厂模式： 用于动态创建对象，注意新增类型需修改工厂函数观察者/发布订阅模式： 用于事件驱动、数据绑定，注意防止内存泄漏、命名冲突装饰器模式： 用于功能扩展（AOP 编程），注意增加代码复杂度策略模式： 用于替换条件分支，注意管理大量策略对象代理模式： 用于访问控制、缓存，注意性能开销模块模式： 用于封装私有逻辑，注意现代开发优先使用设计原则不要过度设计：仅在复杂度需要时引入设计模式。优先使用语言特性：如ES6 的 Proxy、class。
2025-03-22 11:25:23
398
原创 Javascript 中事件环以及宏任务微任务详细介绍【面试题】
执行同步代码从调用栈中执行当前所有同步任务，直到调用栈清空。清空微任务队列依次执行微任务队列中的所有任务（包括执行过程中新产生的微任务），直到队列为空。渲染更新（浏览器）如果需要，浏览器会执行页面渲染（重绘、布局等）。执行一个宏任务从宏任务队列中取出队列头的第一个任务（如 setTimeout 回调），执行它。重复循环回到第一步，开启新的事件循环。宏任务：用于处理需要延迟执行或与外部交互的任务（如定时器、I/O）。微任务：用于处理需要立即执行的高优先级任务（如 Promise 回调）。
2025-03-19 18:17:00
653
原创 25年第五本 【理解人性】
不同于佛洛依德执著于潜意识深渊的探照灯，这位个体心理学开创者更像手持毛刷的考古学者，将人性层层叠叠的文明沉积物轻柔拂去，在行为碎片与语言化石之间，寻找着人类心灵最初的纹样。这场精神考古揭示的不仅是人性的生成密码，更是一份关于如何重构自我的工程图纸。当那些深埋地下的记忆陶片被精心拼接，展现在我们眼前的不仅是过往的图景，更是一幅可以重新绘制的未来蓝图。那个在幼儿园争夺玩具的孩童，与成年后在职场竞争的中年人，本质上都在重复着同一种行为模式——这种惊人的发现让人意识到，所谓人性不过是早期生活方式的永恒复现。
2025-03-19 17:03:38
490
原创 React Vue 项开发中组件封装原则及注意事项
良好的组件封装需平衡功能独立性与灵活性，通过清晰的接口、严格的隔离和详尽的文档，最终实现 “一次封装，多处复用” 的目标。这个组件能否不修改代码直接复用到其他项目？其他人能否仅看文档就正确使用该组件？修改组件内部逻辑是否会影响外部调用？
2025-03-13 21:50:05
1228
原创 TypeScript 中 interface 与 type的使用注意事项 及区别详细介绍
interfacetypeinterface更适合面向对象的类型设计，强调可扩展性和实现。type更灵活，适合定义任意复杂类型，尤其是联合类型或工具类型。两者在大部分场景下可以互换，但需根据语义和需求选择。实际开发中，团队可根据规范统一选择，例如默认使用 interface 定义对象，用 type 处理复杂类型。
2025-03-13 21:40:22
188
原创 React 之 Redux 第二十九节 Redux各项组成详解
Redux 是一个用于JavaScript 状态容器，提供可以预测的状态管理Redux 可以让我们的构建一致化的应用，运行于不同的环境，客户端、浏览器、服务器，并且易于测试；Redux 除了和React一起使用，还支撑其他界面库，并且体检很小，只有2kb。
2025-03-11 21:28:14
747
原创 开发中常见状态码以及状态码用途【面试题】
前端与后端进行数据交互时候，可以根据不同的状态码，快速定位问题所做，同时帮助我们能够更好的进行 SEO；通常分为1xx到5xx。1xx是信息响应，2xx是成功，3xx是重定向，4xx客户端错误，5xx服务器错误比如302和307重定向的区别，301是永久重定向，302是临时，而307是更严格的临时重定向。比如403 Forbidden表示权限问题，而401需要认证比如502和504，都是网关错误，但502是上游服务器无效响应，而504是网关超时。
2025-03-11 21:03:43
403
原创 25年第四本【认知觉醒】
书中揭示的"元认知"概念，犹如在意识穹顶安装的全息投影仪。当我们学会用认知透镜观察思维活动，用行动探针刺激神经重塑，那些困扰现代人的焦虑、拖延与迷茫，终将在认知进化的光芒中冰消瓦解。当我们用"大概""可能"等模糊词汇思考时，就像处于量子叠加态的粒子，既在此处又在彼处。某位连续创业者的实践颇具启发性：他在决策笔记本上开辟"模糊清算区"，强迫自己将"市场前景不明"转化为"需要验证的三个核心假设"。在信息爆炸的焦虑时代，我们像被抛入湍流的溺水者，拼命抓取各种自我提升的浮木，却在知识的漩涡中越陷越深。
2025-03-04 22:28:59
375
原创 React 之 Redux 第二十八节 学习目标与规划大纲及概要讲述
纯函数，接收旧状态和 Action，返回新状态，禁止直接修改原状态，返回新对象。（State is Read-Only，通过 Action 修改）开发工具中间件（redux-devtools-extension）MobX、Recoil、Zustand（其他状态管理方案）日志中间件（redux-logger）持久化 Store 到本地存储。redux-form（表单管理）（生成 Action 的函数）：集中式、可预测的状态管理。：描述状态变化的普通对象（（复杂应用、多组件交互）前端状态管理的挑战（
2025-03-03 22:04:20
580
原创 React 各模块相关全面面试及答案解析
答案：捕获子组件错误的类组件，需定义static getDerivedStateFromError()和componentDidCatch()。答案：JSX是语法扩展，允许在JS中写类似HTML的结构。答案：虚拟DOM是内存中的轻量DOM表示，React通过Diff算法比较新旧虚拟DOM差异，最小化真实DOM操作。答案：React.lazy() + Suspense，或Webpack的import()动态导入。答案：在React合成事件和生命周期中是异步的，在setTimeout或原生事件中是同步的。
2025-03-03 21:03:34
919
原创 React 第二十七节 ＜StrictMode＞ 的使用方法及注意事项
StrictMode是 React 开发者必备的质量保障工具。通过强制性的开发时检查，它能有效提升代码健壮性，平均减少 30% 的隐蔽性问题。建议在新项目中全程启用，老项目可分模块逐步应用。结合的Profiler和StrictMode特性，可以构建出符合工业级标准的 React 应用。
2025-02-27 22:08:47
508
原创 25年第三本【乌合之众】
【乌合之众】：可能绝大多数人都是乌合之众，【乌合之众】不是让我们称为乌合之众，而是了解群体的心理，在群体的洪流中，自己依然是那棵屹立不倒的树苗，可能现在很渺小，但时间会证明，你终将会成为那棵参天大树；当 外卖软件上弹出的“万人好评”，直播间里倒数的“最后100单”，热搜榜上血红色的“爆”字——我们每天都在被看不见的群体力量推搡着向前。翻开勒庞这本写于19世纪的《乌合之众》，惊觉书页间抖落的灰尘，竟与当代人手机屏幕上的指纹重叠。
2025-02-26 11:02:46
243
原创 25年第二本书【你的生存本能正在杀死你】
合上书页时，急诊室心电监护仪的滴滴声仿佛在耳边回响——那是无数现代人被生存本能劫持的生命节拍。但本书带来的不是绝望，而是充满力量的觉醒：当我们理解大脑警报系统的运行逻辑，那些曾让我们窒息的焦虑，终将成为认知升级的燃料。不再做本能的奴隶，也不妄想成为绝对理性的机器，而是在原始冲动与文明理性之间，找到那个充满张力的平衡点。就像冲浪者驾驭海浪，我们终将学会在生存本能的波涛之上，舞出属于现代人的生命之诗。
2025-02-17 08:45:39
794
原创 React 第二十六节 ＜Profiler＞＜/Profiler＞ 的用途使用方法
不仅是性能分析工具，更是理解React运行时机制的窗口。当开发者学会用Profiler的视角观察组件生命周期，那些曾令人头痛的卡顿问题，终将化作性能优化道路上的精准坐标。在这个用户体验至上的时代，掌握这把「渲染手术刀」的前端工程师，正在重新定义Web 应用的性能边界。
2025-02-16 23:19:29
1030
原创 React 第二十五节 ＜Fragment＞＜/Fragment＞ 的用途以及使用注意事项详解
1、破坏布局结构：多余的 DOM 节点可能干扰 CSS 布局（如 Flex/Grid）3、避免深度嵌套：超过 3 层应考虑组件拆分，考虑组件的单一性易维护性。增加类型检查，避免使用人员传入不符合类型的数据。5、性能敏感场景实测：大数据列表优先选择。2、性能损耗：增加无意义的 DOM 层级。添加 DOM 节点是否会影响父级布局？2、多层 Fragment 嵌套。这个容器是否需要任何样式或交互？6、最后：当你在纠结是否使用。满足这两个条件，可以放心使用。不创建真实 DOM 节点。3、语义污染：无关的。
2025-02-12 21:18:12
657
4
原创 25年第一本书【被讨厌的勇气】
在这个充满评判的世界里，愿我们都能拥有这份勇气，在别人的期待里找到自己，在生命的旅程中活出真我。阿德勒心理学告诉我们，生命的意义在于此时此刻的体验，而不是他人的认可。建立健康的人际关系，需要我们在保持独立性的同时，又不失与他人的联结。在现实生活中，活出真实的自我需要极大的勇气。为了获得他人的认可，我们不断压抑真实的自我，扮演着他人期待的角色。它告诉我们，每个人都要为自己的选择负责，而不能将他人的期待作为自己的责任。
2025-02-10 17:47:50
325
原创 React 第二十四节 useDeferredValue Hook 的用途以及注意事项详解
React 18 引入的是优化渲染性能的重要工具，特别适用于处理高开销的更新（如实时搜索、大型列表渲染）。它通过延迟非紧急的 UI 更新，保证用户交互的流畅性。然而，若使用不当，可能引发意外问题。本文将通过实际案例解析其使用注意事项。的正确使用需遵循以下原则：1、精准定位性能瓶颈：优先优化渲染逻辑，再考虑延迟更新。2、数据简化：延迟值尽量为原始类型或稳定对象。3、协同其他 API：结合实现完整优化链路。4、用户体验优先：通过加载状态提示和防抖减少延迟带来的感知问题。5、通过合理应用，
2025-02-10 15:52:46
732
原创 React 第二十三节 useTransition Hook 的使用注意事项详解
React 中 useTransition Hook 是一个在不阻塞UI渲染的情况下更新数据状态，它会降低当前视图的渲染优先级，而优先执行视图中其它用户交互操作，比如 Tab切换、搜索加载等。
2025-02-08 11:11:24
978
原创 React 第二十二节 useSyncExternalStore Hook 常见问题及用法详解
在React 中我们通常会使用进行数据状态更新，但是当我们需要对外部的数据状态进行处理时候，我们需要使用React 提供的新让我们可以在React 内部订阅外部数据属性的状态，当订阅的外部状态发生改变时候，会触发React进行重新渲染；
2025-02-06 10:51:05
1055
原创 React 第二十一节 useDeferredValue 开发中用法注意事项
useDeferredValue 在React 的用途，使用注意事项，是用于延迟渲染视图UI组件的，可以帮助我们管理视图渲染过程中的状态，并提高程序运行的性能；
2025-01-17 10:36:33
495
原创 2024年度总结，希望25年一切顺利
并且这种小本买卖，发现做的人很多，几个商场、公园都是晚上有很多摆地摊的，只有哪些单价稍晚高的，而且容易吸引小朋友的玩具，才更好销售，并且需要品类多一些，客户不喜欢这个，说不定会喜欢其它的东西，准备过节时候再搞一些试试；今年开通了快手，抖音，并且在上面更新了一些技术之外的视频，日常生活视频，尝试在寻找新的收益点；日常有时候还跑一跑滴滴，可惜没有证件，很容易被查，而且现在没有证件就之间不让跑了，跑滴滴现在也是需要花费时间熬，时间成本很高，专业跑滴滴应该是拿命在换钱，并且不敢喝水，跑一天发现腰疼脖子疼的；
2024-12-29 20:54:19
1013
7
原创 React 第二十节 useRef 用途使用技巧注意事项详解
有时我们需要在父组件直接访问子组件的属性方法，可以结合forwardRef 访问到子组件的方法；操作，尽可能使用数据驱动操作，触发现有方案无法满足，才使用useRef访问DOM。来访问真实DOM，进而操作原生DOM的一些增删改查、颜色位置等操作；可以在重新渲染直接存储信息，普通的对象每次重新渲染会将信息重置。，访问其它组件的事件，会使组件本身变得不那么稳定健壮；在子组件暴露出父组件需要访问的属性或方法，类似与。，可以直接操作input 原生事件，如。可以直接访问自身组件中的事件，但是。
2024-12-26 18:02:10
739
原创 React 第十九节 useLayoutEffect 用途使用技巧注意事项详解
是useEffect的一个衍生版本，只是他们的执行时机不同用于在DOM更新执行完成之后浏览器渲染绘制之前执行，这会阻塞浏览器的渲染；useEffect的执行时机是在组件首次渲染和更新渲染之后异步执行的，这就意味着useEffect的执行并不会阻塞组件的渲染，也不会影响到用户的交互体验；由于useEffect执行的的异步操作，那么在其副作用函数中执行，数据请求DOM操作定时任务，即使有大量的计算耗时，也不会让用户感觉到界面卡顿现象；而执行的是同步操作，不适用于大量耗时的进程。
2024-12-24 10:39:59
749
空空如也
那种微前端使用范围更有前景
2024-12-05
程序员如何突破35岁
2024-12-05
TA创建的收藏夹 TA关注的收藏夹
TA关注的人