<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[zyl20031021的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/zyl20031021</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; zyl20031021]]></copyright><item><title><![CDATA[封装Axios拦截器实现用户无感刷新AccessToken实践指南]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/146200692</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/146200692</guid><author>zyl20031021</author><pubDate>Wed, 12 Mar 2025 11:38:52 +0800</pubDate><description><![CDATA[用户无感知：自动处理令牌刷新高可靠性：完善的错误处理机制高性能：请求队列避免重复刷新后续优化方向：添加请求重试次数限制实现滑动过期时间增加网络异常处理结合WebSocket实时更新通过合理的前端Token管理策略，可以显著提升用户体验，降低重复登录频率。本方案已在生产环境稳定运行，可满足大多数SSO场景需求。]]></description><category></category></item><item><title><![CDATA[14个适合后台管理系统快速开发的前端框架]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/146199269</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/146199269</guid><author>zyl20031021</author><pubDate>Wed, 12 Mar 2025 10:56:03 +0800</pubDate><description><![CDATA[文档地址：https://demos.creative-tim.com/material-dashboard/docs/2.1/getting-started/introduction.html。文档地址：https://panjiachen.github.io/vue-element-admin-site/zh/文档地址：https://2x.antdv.com/docs/vue/introduce-cn/效果预览：https://d2.pub/d2-admin/preview/#/index。]]></description><category></category></item><item><title><![CDATA[深入理解JavaScript深拷贝：从原理到实践，轻松应对面试与项目]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/146100647</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/146100647</guid><author>zyl20031021</author><pubDate>Fri, 07 Mar 2025 17:25:55 +0800</pubDate><description><![CDATA[当我们将对象A赋值给对象B时，如果修改B的属性会影响A，这就是浅拷贝。它只复制对象的第一层属性，深层属性仍然共享内存地址。// 输出3会递归复制对象的所有层级属性，新旧对象完全独立，互不影响。这是处理复杂数据结构的必备技能。]]></description><category></category></item><item><title><![CDATA[手写Vue Router核心原理详解与动态路由结合面包屑导航栏实战指南]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/146043190</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/146043190</guid><author>zyl20031021</author><pubDate>Wed, 05 Mar 2025 15:02:30 +0800</pubDate><description><![CDATA[通过深入理解Vue Router的实现原理，结合本文的实践方案，开发者可以构建出高性能、易维护的企业级路由管理系统。建议根据实际业务需求进行调整优化，持续提升用户体验。]]></description><category></category></item><item><title><![CDATA[基于Vue3+Canvas实现跨设备签名板（移动端/PC双适配）]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/146036728</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/146036728</guid><author>zyl20031021</author><pubDate>Wed, 05 Mar 2025 11:22:19 +0800</pubDate><description><![CDATA[本文实现的签名板具备良好的设备兼容性，核心代码不足200行。我们在Vue3项目下添加的所以，可以根据自己的目录结构去写，这里做一个示例。：解决Canvas物理像素与CSS像素的差异，避免高分屏下的绘制偏差。压力敏感度支持（需配合Pointer Events API）：控制线条交汇处形状（bevel|round|miter）：控制线条端点形状（butt|round|square）注：笔画有黑色效果是录制缺帧导致，实际不会哈。CSS属性防止页面滚动。鼠标/触摸双模式绘制。及时释放内存避免泄漏。]]></description><category></category></item><item><title><![CDATA[2025年Web前端自学路线：阶段性规划与实战指南（附资源推荐）]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/145993730</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/145993730</guid><author>zyl20031021</author><pubDate>Mon, 03 Mar 2025 17:24:57 +0800</pubDate><description><![CDATA[掌握网页结构与样式基础，能独立完成静态页面开发：标签语义化、盒模型、浮动/定位/Flex布局、响应式设计（媒体查询、rem/vw适配）：仿京东/小米首页布局，实现PC端与移动端适配，代码符合W3C规范：深入理解JS底层原理，掌握数据操作与异步编程：作用域链、闭包、原型链、this指向、ES6+（let/const、解构、箭头函数）：Promise/async-await、Ajax（Fetch/XHR）、DOM/BOM操作：数组/字符串/对象的高阶方法（map/filter/reduce等）]]></description><category></category></item><item><title><![CDATA[速通Vue3：从入门到实战（附图解+对比）]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/145990086</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/145990086</guid><author>zyl20031021</author><pubDate>Mon, 03 Mar 2025 17:01:11 +0800</pubDate><description><![CDATA[针对Vue2转Vue3开发者 / 刚接触框架的新手，快速掌握核心差异与实战技巧。]]></description><category></category></item><item><title><![CDATA[从浏览器多进程到异步原理了解前端事件循环]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/145968672</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/145968672</guid><author>zyl20031021</author><pubDate>Sun, 02 Mar 2025 19:52:44 +0800</pubDate><description><![CDATA[理解事件循环机制需要把握三个关键点：浏览器多进程架构的底层支持渲染主线程的单线程特性与异步实现不同任务队列的优先级调度策略高频面试题解析Q：为什么Promise比setTimeout先执行？A：Promise回调属于微任务队列，而setTimeout属于宏任务队列。事件循环每执行一个宏任务后，就会立即清空整个微任务队列。未来趋势随着WebAssembly的普及和OffscreenCanvas等新API的出现，前端对多线程的运用将更加深入，但事件循环作为基础调度机制的地位不会改变。学习建议。]]></description><category></category></item><item><title><![CDATA[浏览器页面渲染原理深度解析（附完整流程图解）]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/145944565</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/145944565</guid><author>zyl20031021</author><pubDate>Sat, 01 Mar 2025 11:34:42 +0800</pubDate><description><![CDATA[现代浏览器通过多线程协作和流水线优化实现了高效渲染，关键点在于：解析阶段的预加载优化分层机制的局部更新策略GPU加速的合成处理异步化的任务调度理解这些原理有助于开发者：编写高性能的前端代码合理使用硬件加速避免常见的性能陷阱制定有效的优化策略。]]></description><category></category></item><item><title><![CDATA[人工智能浪潮下，大学生与实习生如何做好职业过渡？从学习到实践的全方位指南]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/145897828</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/145897828</guid><author>zyl20031021</author><pubDate>Thu, 27 Feb 2025 11:55:33 +0800</pubDate><description><![CDATA[AI时代，成功属于“技术敏感型人才”——既懂代码逻辑，又能用AI赋能业务创新；既保持学习饥渴，又具备不可替代的软实力。正如Cengage报告所指出的：“教育机构需培养适应GenAI职场的毕业生”，而个体的主动进化才是应对变革的核心。从今天起，用AI工具武装自己，用批判性思维突破边界，你终将在浪潮中站稳脚跟。]]></description><category></category></item><item><title><![CDATA[JavaScript作用域与闭包：变量世界的「楼层规则」与「魔法背包」]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/145896494</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/145896494</guid><author>zyl20031021</author><pubDate>Thu, 27 Feb 2025 10:24:58 +0800</pubDate><description><![CDATA[闭包函数就像冒险者，即使离开城堡（外层函数），仍能通过魔法背包（词法环境引用）使用城堡内的物品（变量）。通过Sources面板的Call Stack查看执行路径。是建筑师设计图纸时就确定的楼层功能划分。断点调试时观察Scope面板的变量查找过程。当访问变量时，JS引擎就像智能电梯。]]></description><category></category></item><item><title><![CDATA[JavaScript原型与原型链深度解析：从设计模式到Class实现]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/145880297</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/145880297</guid><author>zyl20031021</author><pubDate>Wed, 26 Feb 2025 16:11:28 +0800</pubDate><description><![CDATA[继承方式优点缺点原型链继承简单直观引用类型共享问题构造函数继承解决引用共享无法继承原型方法组合继承结合两者优势两次调用父类构造函数原型式继承灵活的对象创建类似原型链的问题寄生组合继承最优解决方案实现稍复杂ES6 class 继承语法糖，易用性强需要转译器支持旧览器原型链全貌理解原型链与继承机制是掌握JavaScript面向对象的核心，ES6的class让代码更清晰，但底层仍依赖原型。掌握手动实现继承和new操作符有助于深入理解语言设计。]]></description><category></category></item><item><title><![CDATA[TypeScript核心概念与实用技巧详解：从基础到进阶实战]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/145869641</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/145869641</guid><author>zyl20031021</author><pubDate>Wed, 26 Feb 2025 11:54:02 +0800</pubDate><description><![CDATA[类型命名规范T开头（如TUser组件名+Type（如工具类型：动词+名词（如类型安全实践// 优先使用unknown进行类型收窄组件开发规范// 使用InstanceType获取组件实例类型// 带泛型的组件定义props: {data: {});掌握这些TypeScript核心概念和实战技巧，将显著提升代码的类型安全性和可维护性。建议结合XMind思维导图系统梳理知识体系，并在实际项目中不断实践应用。]]></description><category></category></item><item><title><![CDATA[深入浅出防抖与节流：原理、实现与场景解析]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/145848926</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/145848926</guid><author>zyl20031021</author><pubDate>Tue, 25 Feb 2025 11:51:54 +0800</pubDate><description><![CDATA[防抖适用于结果导向型场景（如搜索建议）节流适用于过程持续性场景（如滚动加载）复杂场景可组合使用两种方案根据具体需求选择合适的时间间隔通过合理使用防抖与节流，可在保证功能完整性的同时，显著提升页面性能与用户体验。建议开发者在高频事件处理时优先考虑这两种优化方案。]]></description><category></category></item><item><title><![CDATA[Git从入门到精通：三千字长文详解开发必备的45个核心命令]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/145847342</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/145847342</guid><author>zyl20031021</author><pubDate>Tue, 25 Feb 2025 11:08:57 +0800</pubDate><description><![CDATA[掌握这些Git命令和技巧，将使你的版本控制效率提升200%！如果遇到特殊场景问题，欢迎在评论区留言讨论！]]></description><category></category></item><item><title><![CDATA[基于Vue+Element UI的智能表单交互设计与符合人体工学的搜索实现]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/145829501</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/145829501</guid><author>zyl20031021</author><pubDate>Mon, 24 Feb 2025 15:58:38 +0800</pubDate><description><![CDATA[通过本文的代理模式实现，不仅减少了30%的代码量，还能让搜索响应速度提升2倍！现在就开始改造你的搜索框，让用户每一次回车都变成愉悦的体验升级吧。]]></description><category></category></item><item><title><![CDATA[在Vue3项目当中，嵌入一个deepseek/Kimi对话框]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/145820216</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/145820216</guid><author>zyl20031021</author><pubDate>Mon, 24 Feb 2025 09:57:52 +0800</pubDate><description><![CDATA[四步让你在自己的vue项目里面创建deepseek对话框]]></description><category></category></item><item><title><![CDATA[前端开发中条件判断的优雅优化方案]]></title><link>https://blog.youkuaiyun.com/zyl20031021/article/details/143116694</link><guid>https://blog.youkuaiyun.com/zyl20031021/article/details/143116694</guid><author>zyl20031021</author><pubDate>Mon, 21 Oct 2024 17:07:26 +0800</pubDate><description><![CDATA[这样看起来比用 if/else 清晰多了，还有一个小技巧：当 两个逻辑相同时，可以省略执行语句和 break，这样上一个逻辑就会自动执行下一个的逻辑。把判定条件作为对象的属性名，把处理逻辑作为对象的属性值，通过查找对象属性进行逻辑判断。可以将两个条件拼接成一个字符串，以拼接后的条件字符串为键，以处理函数为值，通过 Map 对象查找并执行。利用数组循环的特性，满足正则表达式条件的逻辑就会被执行，这样就可以同时执行通用逻辑和个别逻辑。大家很容易就提出使用 switch 进行代码重写方案。]]></description><category></category></item></channel></rss>