- 博客(50)
- 收藏
- 关注
RSS订阅原创 前端面试应对技巧
不要流水账！控制在 60–90 秒，模板： 您好，我叫 XX，有 2 年前端开发经验，主要技术栈是 Vue3、TypeScript、Vite，熟悉 VueRouter、Pinia、Element Plus，也会原生微信小程序开发。之前主要做中后台管理系统开发，参与过医疗相关后台、一卡通系统，负责页面开发、接口联调、权限路由、列表组件封装、表单校验等工作。平时也会学习 React 基础，了解 TS 类型约束、打包优化这些内容。我比较注重代码规范和问题排查，遇到 bug 习惯梳理复现链路解决，希望能加入贵公司。
2026-10-23 18:26:24
159
原创 前端动态路由实现方案（Vue3 + VueRouter4）｜后台权限路由实战
动态路径参数，同一个组件根据参数渲染不同数据（简单参数匹配）权限型动态路由（本文重点）：登录之后，根据当前用户角色，从后端接口拿到菜单路由列表，运行时动态添加路由，不同用户看到不同页面、不同侧边菜单，这也是后台系统最常用的 RBAC 权限方案。传统写死在的静态路由，所有用户都能访问，无法满足权限隔离。Vue Router4 提供来完成运行时注册路由，是这套方案的核心 APIVue Router。
2026-10-23 18:23:53
313
原创 从零上手油猴 (Tampermonkey) 脚本开发：编写、调试、完整 Demo、发布全流程
油猴（Tampermonkey，也叫篡改猴）是一款浏览器脚本管理器。不同于普通 Chrome 扩展，油猴运行UserScript 用户脚本，通过 JS 直接修改网页 DOM、样式、拦截请求，实现网页增强：去除广告、网页自定义样式、自动化操作等能力。只需要基础 JavaScript 知识，就可以编写脚本改造任意网页。本文带大家从脚本语法、实战 Demo，再到脚本发布完整走一遍流程。注意：油猴脚本≠Chrome 扩展 crx，不能直接提交 Chrome 应用商店，脚本是.user.js格式。
2026-10-08 16:07:05
518
原创 Vue3 + Vue‑Router4 登录后后端返回菜单，实现动态路由与左侧权限菜单完整实战
后台管理系统几乎都会遇到权限菜单需求：菜单不是前端写死，由后端根据当前登录用户权限返回不同菜单树，前端解析生成路由并渲染侧边栏。网上很多动态路由教程存在各种坑：刷新页面白屏、嵌套子路由不显示、挂载后丢失 Layout 布局、404 拦截动态路由、addRoute参数传错等。本篇基于真实踩坑完整复盘，实现一套可直接落地的动态权限菜单。❌，第一个参数写 path。✅ 第一个参数是父路由的name，我们项目写Layout；报错就是这个原因，现象：页面打开没有 Layout 框架，只有裸页面。
2026-10-08 15:31:23
276
原创 Git仓库超全详解｜从零搭建、日常开发、团队协作、面试避坑（前端必备）
Git 仓库（Repository）：用来存放项目所有代码、版本记录、提交日志、分支信息的“版本数据库”。本地仓库：自己电脑上的 .git 隐藏文件夹，记录所有版本远程仓库：GitHub / Gitee / GitLab 云端仓库，用于团队共享、备份、部署仓库本质 = 版本快照 + 分支管理 + 多人协作记录掌握本文内容，足以搞定：个人项目、企业团队开发、前端面试90%的 Git 考题。
2026-09-24 17:18:42
155
原创 前端必懂｜浏览器七大网络协议超全详解（面试满分版）
HTTP1/2 → 基于 TCPHTTP3 → 基于 QUIC（UDP）HTTP：明文、无状态、网页基础传输HTTPS：HTTP+加密、安全、全站主流TCP：可靠、握手、稳、慢UDP：无连接、快、不保证可靠DNS：域名转IP，上网第一步WebSocket：双向长连接、实时推送QUIC：UDP升级版、HTTP3底层、解决队头阻塞、极速低延迟。
2026-09-24 17:14:59
310
原创 前端面试全套技巧｜从准备、答题、避坑到通关（保姆级攻略）
自我介绍不要流水账！身份 + 技术栈 + 擅长方向 + 项目亮点 + 求职态度1. 知识点结构化输出，不零散、不口语化2. 项目讲难点、讲优化、讲思考，不讲流水账3. 不会的题讲逻辑不摆烂4. 答题有条理、态度稳、心态平5. 每场面试必复盘，持续补盲区技术决定你的上限，面试表达决定你的能不能拿到offer。
2026-09-24 17:13:07
230
原创 UniApp 如何打包编译成微信小程序（实战面试题）
UniApp 不是打包成一个小程序安装包，而是编译转换：把 uni 的代码（vue 文件、js、css）编译成微信小程序原生代码（），之后放到微信开发者工具预览 / 上传。
2026-09-19 08:49:13
302
原创 UniApp / 微信小程序实战拓展面试题｜业务坑点、工程化、跨端踩坑（2026 前端进阶）
很多前端面试问到小程序，只背页面生命周期、双向绑定。真机坑、分包加载、权限、图片上传、性能优化、UniApp 跨端差异、和 Web 项目的区别。小程序环境不是浏览器，是双线程模型，很多 Web 端写好的逻辑直接搬过来会失效。下面全部是项目实战衍生的拓展面试题。原生组件（camera、video、map、canvas）是微信客户端原生渲染，层级高于普通 webview 渲染组件。坑：原生组件层级最高，普通 view、弹窗浮层盖不住原生组件；不能用 z-index 控制。解决办法：弹窗弹出时临时隐藏原生组件。
2026-09-19 08:45:12
827
原创 Vue vs React 实战拓展面试题｜摒弃基础八股，聚焦业务开发核心难点（2026前端进阶）
绝大多数前端面试，基础八股人人都会框架实战思维、业务场景选型、底层坑点规避、性能优化落地。本文不讲“Vue双向绑定原理、React虚拟DOM”这种烂大街基础题，全部是中高级前端面试高频拓展题，贴合真实后台、中台、列表、表单、弹窗业务场景，同时对比 Vue / React 设计差异、优缺点、选型逻辑，可直接用于面试背诵、项目复盘、技术博客沉淀。1.Vue 适合快速开发、表单密集、后台系统；React 适合复杂交互、高复用、大型工程。2.Vue 响应式自动更新，React 依赖状态地址变更主动更新。3.
2026-09-19 08:14:36
207
原创 UniApp 万字核心通关指南｜从原理、实战到面试高频考点（2026最新）
UniApp 是基于 Vue.js 的跨端开发框架，一套代码可同时编译发布到：微信/支付宝/百度/抖音小程序iOS、Android 原生APPH5 网页端原理通透、生命周期清晰、多端适配熟练、避坑意识强、优化思路到位。本文覆盖 90% 企业UniApp面试高频考点，通读一遍可搞定初级、中级前端跨端岗位面试与项目开发复盘。
2026-09-17 08:32:53
287
原创 2026前端高频面试核心考点全集｜零基础吃透大厂八股
本文覆盖2026年前端初级-中级高频核心考点，全部为面试当场原题，无冗余冷门知识。前端面试核心在于基础扎实、原理清晰、场景明确，熟练掌握以上知识点，可应对80%以上的前端面试基础与手写题。
2026-09-17 08:29:19
183
原创 微信小程序原生 API 深度实战指南｜从回调地狱到优雅异步，避坑干货全集
微信小程序所有的能力，本质都是由微信开放给开发者的内置接口（API）完成。页面跳转、弹窗提示、网络请求、下载保存图片、本地缓存、获取用户权限，全部离不开wx.xxx系列原生方法。网络请求还没返回数据，页面已经渲染完毕；想直接保存一张网络图片，代码报错失败；多层异步嵌套，写出回调地狱，代码可读性极差；模拟器一切正常，真机上线直接失效。本文就从API 分类、异步底层原理、Promise 封装实战、高频业务案例、全网高频踩坑清单、线上排查方案六个维度带你吃透小程序内置接口。
2026-08-22 15:21:58
209
原创 深度对比：微信小程序开发 VS VSCode常规Web/App 开发（全维度差异解析）
绝大多数前端开发者都使用 VSCode 开发 Vue、React、原生Web、移动端H5、混合App项目，上手小程序时总会出现大量适配问题：语法不兼容、API报错、路由失效、样式错乱、打包逻辑不同。很多人误以为小程序就是“精简版Web”，实则二者是完全不同的运行环境、编译机制、语法体系、工程逻辑。本文从运行环境、语法规范、渲染机制、路由、工程化、部署发布、权限性能等全维度，深度拆解小程序与常规VSCode前端开发的核心差异，帮开发者快速完成技术思维切换。常规VSCode前端开发的核心是。
2026-08-21 10:06:10
167
原创 微信小程序开发核心知识点全景解析（前端必备硬核基础）
对于前端开发者而言，微信小程序并不是“简化版H5”，而是一套拥有独立运行容器、双线程架构、语法规范、路由体系、权限沙箱的完整移动端开发体系。很多新手开发小程序频繁踩坑：视图不更新、路由跳转失效、tabBar报错、样式兼容异常、生命周期混乱，本质都是没有吃透小程序底层核心机制。本文系统性梳理小程序开发所有核心知识点，从架构原理到落地规范，覆盖日常开发99%的场景，帮助开发者建立完整的小程序技术认知。微信小程序不是简单的前端简写，而是一套架构独立、规则严谨、约束明确的移动端开发体系。
2026-08-21 10:05:29
464
原创 微信小程序对接 AI 大模型踩坑全记录｜本地成功、体验版手机却报网络异常
最近在开发一款景区问答助手微信小程序，前端使用微信原生小程序，后端对接阿里云百炼大模型实现 AI 问答。电脑模拟器一切正常，扫码上传体验版，手机访问直接提示「网络异常，请重试」。折腾许久，才彻底搞懂小程序为什么不能直接请求第三方 AI 接口，写下这篇博客记录完整排坑过程，也给后来的开发者避坑。模拟器能跑 ≠ 手机线上环境能跑。开发工具的「不校验域名」只是临时调试开关，不能当作线上环境的解决方案。凡是第三方扣费类接口（AI 大模型、短信、支付），密钥一律禁止放到小程序前端代码，必须后端中转。
2026-08-20 10:31:31
240
原创 【React进阶】Ant Design 超详细入门实战教程（零基础保姆级）
本文带你从零入门 antd，包含：环境安装、全局配置、布局系统、常用组件、表单表格实战、样式统一、常见踩坑解决方案，适合所有 React 初学者和后台开发人员。掌握 antd 核心布局、表单、表格、弹窗四大模块，即可完成 95% 以上的企业后台管理页面开发。新增数据" open={visible} onCancel={close} onOk={submit}></Modal><Col span={8}>1/3 区域</Col>自动适配、边框、斑马纹、固定列、分页、排序、筛选一站式支持。
2026-07-26 16:06:35
256
原创 TypeScript 完全指南：从基础语法到工程化类型实战
在前端项目从“页面开发”走向“大型工程化”的过程中，JavaScript 动态类型的短板被无限放大：变量类型不可控、接口参数随意传递、隐性报错遍布运行时、多人协作代码无规范。TypeScript 的出现，彻底解决了 JS 的工程化痛点。TypeScript 是微软推出的JavaScript 超集，兼容所有 JS 语法，在此基础上新增静态类型系统、接口、泛型、高级类型、装饰器等能力，最终编译为原生 JS 运行在浏览器/Node 环境。
2026-07-17 15:39:04
670
原创 2026最新React快速入门教程：Vite从零搭建+基础实战+完整配置指南
时至今日，React 已经成为前端主流框架之一，广泛应用于企业级后台、移动端、中大型Web项目。在2026年的当下，官方已彻底放弃 CRA(create-react-app)，全面推荐Vite作为 React 项目构建工具，具备启动极速、热更新秒级响应、打包性能极强的优势。本篇教程面向零基础前端开发者，全程手把手带你完成：环境安装、项目创建、目录解析、JSX语法入门、组件编写、状态使用、项目打包部署，看完即可上手开发React项目。（零基础友好，无需TS基础）
2026-07-14 13:52:25
307
4
原创 Element Plus 企业级实战指南：从配置、高频组件到性能优化与封装
原生支持 TS：所有组件自带完整类型定义，搭配 TS 实现强类型约束，减少类型报错Vue3 专属重构：摒弃 Element UI 的 Vue2 冗余逻辑，适配组合式 API，性能更优组件全覆盖：表单、表格、弹窗、权限、菜单、树形结构等中后台核心组件一应俱全可定制性极强：支持全局主题、局部样式、变量覆盖，适配项目自定义 UI 规范生态成熟稳定：社区活跃、迭代稳定，踩坑方案丰富，适配各类后台管理系统样式不生效：未开启，样式未按需加载表单重置失效：未绑定 ref、未使用TS 类型报错。
2026-07-13 14:19:48
497
原创 TypeScript 超全入门指南！零基础吃透 TS 核心知识点
TS 要求数组内元素类型统一，提供两种定义方式：// 方式1：类型[] let arr1: string[] = ["张三", "李四"];// 方式2：Array<类型>（泛型写法） let arr2: Array<number> = [1, 2, 3];本篇博客覆盖了90% 前端开发常用的 TS 核心知识点，从基础类型、接口、元组，到泛型、枚举、联合类型，都是企业项目开发的刚需内容。简单梳理学习优先级：基础类型注解 → 夯实语法基础数组、元组、函数类型 → 日常高频使用。
2026-07-13 14:16:07
251
原创 Vue 从零配置与完整使用教程（零基础保姆级）
<div class="hello"> <h3>{{ title }}</h3> <p>Vue3 工程化组件使用成功！</p> </div> // Vue3 主流语法：setup 语法糖 const title = '欢迎使用 Vue3 + Vite' .hello { padding: 20px;}
2026-07-02 09:33:31
314
原创 Vue.js 全方位入门详解：渐进式前端框架的核心魅力
Vue（读音 /vjuː/，同 view）是一套基于标准 HTML、CSS、JavaScript 构建的渐进式 JavaScript 前端框架，由华人开发者尤雨溪于2014年正式发布，核心用于构建交互式、高性能的用户界面。相较于 Angular、React 等框架，Vue 最核心的标签是渐进式。不同于重型框架强制开发者全套使用其技术体系，Vue 支持自底向上逐层应用：既可以仅引入核心库，对传统静态页面做简单交互增强；
2026-07-02 09:24:55
497
原创 Vue3 极简实现购物车（全选、编辑、小计、批量操作）
js运行cartList.filter(i=>i.checked).reduce((s,i)=>s+i.price*i.num,0).toFixed(2)购物车是前端项目里非常经典的业务场景，包含新增商品、单行编辑、数量增减、单选 / 全选、自动计算选中总价、单行删除等核心功能。六、总结这个购物车案例覆盖了 Vue3 最常用的基础语法：双向绑定、条件渲染、列表循环、响应式数据、事件绑定、数组遍历运算。编辑模式输入框：直接 v-model="item.name"，修改内容会同步到数组原始数据。
2026-06-27 10:46:48
193
原创 告别只会API调用！前端核心进阶拓展知识点全总结
前端的进阶之路，从来不是不停学新框架、新API，而是夯实底层基础，吃透拓展原理。普通前端靠框架写业务，高阶前端靠底层原理优化性能、排查疑难bug、设计通用架构、解决复杂业务场景。
2026-06-10 09:35:12
312
原创 从零吃透 Git 仓库：本地+远程完整实操指南（新手保姆级）
Git 仓库就是代码的“云端日记本+时光机”。它会自动记录项目每一次的代码改动，保存每一个版本，支持随时回溯、对比、备份、多人同步。本地仓库：存在自己电脑上，离线可用，负责日常代码编写、版本记录、临时存储远程仓库：托管在网络平台（GitHub / Gitee / GitLab），负责云端备份、跨设备同步、多人协作开发核心优势：只要代码提交到 Git 仓库，永远不会丢、随时能回退、随时可同步，是所有开发者的必备基础技能。Git 仓库不是复杂的工具，而是开发者的代码安全底座本地仓库负责版本记录、离线开发；
2026-06-09 18:12:55
667
原创 前端期末必考核心知识点总结（超全刷题复盘版）
本次核心考点全部围绕前端期末考试基础题型，重点攻克 input 类型、数组创建方式、数组三大属性、易混概念辨析。所有知识点均针对考试踩分点整理，无冗余内容，背诵后可直接应对选择、填空、简答、实操题型，完美避开常见扣分陷阱！
2026-06-08 20:12:01
913
原创 万字吃透ES6核心特性：从语法糖到工程实战，前端开发必备基石
很多同学会疑惑：如今ES7+、ES11+新特性层出不穷，为什么还要深耕ES6？ES6是现代JavaScript的底层地基。后续所有JS新特性，都是在ES6的语法体系、编程思想上的延伸和优化。1.工程必备：模块化、Promise、箭头函数、解构赋值是所有项目的默认写法；2.性能优化：let/const块级作用域、Module静态加载、Set/Map高效数据结构，从底层优化代码性能；3.进阶基础：async/await、Proxy、Reflect、装饰器等高级特性，均依赖ES6语法；4.面试核心。
2026-06-03 20:16:39
282
原创 JavaScript核心基础通关指南：运算符、入口函数与DOM获取
可精准转为布尔值，如!3. 条件判断时，隐式类型转换可能导致判断逻辑错误（如0 == false为true），优先使用===规避。真题示例（必背）：10 === '10' → false（类型不同）、10 === 10 → true（类型和值都相同）、0 === false → false（类型不同）、null === undefined → false（类型不同）。==会触发隐式类型转换，===不转换类型，开发及笔试中优先使用===，避免隐藏bug（如'' == 0 → true，笔试常考判断对错）。
2026-06-01 07:48:23
425
原创 JS 前端基础面试题
使用对象字面量方式创建对象，通过一对大括号 {} 定义对象，内部包含对象的属性和方法。while 循环先执行一次循环体，再判断条件，无论条件是否成立，至少执行一次。in 遍历键名，可遍历对象和数组，会遍历继承属性，不推荐遍历数组。of 遍历键值，支持数组、字符串等可迭代对象，支持中断，语法简洁。forEach 是数组方法，简洁遍历数组每一项，不能中断循环，无返回值。遍历数组常用 forEach 方法，循环遍历数组每一项，无法中断循环。for 循环适用于已知循环次数的场景，通过初始值、条件、自增控制循环。
2026-05-31 21:45:34
224
原创 JS 前端高频面试题
完整实现逻辑为，首先获取页面中全部 input 标签元素，接着循环遍历每一个 input 标签，通过条件判断当前元素 type 属性值是否为 checkbox，之后新建一个空数组，将筛选出的复选框元素依次存入数组，最后遍历该数组即可得到页面中所有 checkbox 元素。onchange 事件在元素内容修改完成，且元素失去焦点后才会触发，支持 input、textarea、select、keygen 元素，适用于输入完成后校验场景。也可以使用元素.innerText 赋值，仅展示纯文本内容不解析标签。
2026-05-31 21:45:01
228
原创 前端项目统一开发规范与避坑注意事项
前端开发规范是团队协作、项目维护、代码质量、项目稳定性的核心基石。无规范的项目，会出现代码杂乱、命名混乱、层级混乱、Bug频发、难以迭代、新人上手困难等一系列问题。本文整理一套通用、落地性强、适配原生/移动端/后台管理系统的前端开发规范，包含命名规范、代码书写规范、HTML/CSS/JS编码规范、Git提交规范、性能规范、兼容性规范及高频开发避坑事项，可直接作为团队开发标准文档使用。前端开发规范不是束缚，而是项目稳定、团队高效、个人进阶的核心能力。初级前端重实现功能，中高级前端重。
2026-05-18 09:26:15
501
原创 Web前端全方位性能优化方案
前端性能优化遵循「先减负、后提速、再优化感知、持续监控迭代」的原则：首先通过压缩、懒加载、分包减少资源体积，再通过缓存、协议升级缩短网络耗时，接着优化渲染与代码逻辑解决卡顿问题，最后通过体验优化弱化等待感，配合监控实现长期稳定的高性能体验。本方案适配PC端、移动端、H5各类前端项目，可根据项目体量（小型项目/中大型项目）按需选用对应优化策略。
2026-05-12 09:49:20
754
原创 深入理解 HTML 与 CSS：前端开发的基石核心
HTML 定义「页面是什么」，CSS 定义「页面长什么样」。二者相辅相成，构成前端页面的全部静态基础。熟练掌握语义化、文档流、盒模型、选择器权重、Flex 布局这些核心知识点，才能从容应对复杂页面开发，为后续 JavaScript 交互、高级布局、响应式开发打下牢固基础。基础不牢，上层必晃，深耕 HTML + CSS，是每一位前端开发者的必经之路。
2026-04-24 13:29:26
720
原创 从零搭建 AI 功能前端项目
搭建 AI 功能前端项目的过程，就像搭积木 —— 先把骨架搭稳，再一点点填充细节。从梳理文件夹结构，到每一行 HTML 的编写、每一个 JS 函数的封装，都是让 AI 功能从 “想法” 变成 “可用产品” 的必经之路。如果你也在做小型 AI 前端项目，不妨试试这套简洁的文件夹结构，或者根据自己的需求调整。毕竟，好的项目结构，是高效开发和轻松维护的第一步。
2026-04-23 20:36:50
467
原创 手把手搭建炫酷大数据可视化展板 —— 基于 ECharts 的实战指南
本文基于 ECharts 实现的大数据可视化展板，核心在于 “通用化 + 定制化” 的平衡：通过统一的布局和样式保证模板的复用性，通过个性化的图表配置和视觉设计打造独特的视觉效果。无论是前端开发者入门数据可视化，还是企业快速搭建数据展板，这套模板都具备极高的参考价值。ECharts 的灵活性和原生 HTML/CSS 的可控性，让我们能快速落地从 “数据” 到 “视觉” 的转化，而细节处的样式优化（如边角线条、渐变配色）则是提升展板质感的关键。
2026-04-23 09:12:08
1023
原创 隔行换色功能制作
表格隔行换色看似简单，但背后是「数据驱动视图」的核心思想 —— 这也是 Vue、React 等框架的底层逻辑。新手学习时，不要只抄代码，要理解「为什么先操作数据，再渲染 DOM」，这种思维能帮你避开很多 DOM 操作的坑。如果是刚入门前端的同学，建议先手写原生 JS 版本，再用 jQuery 简化，对比两种写法的差异，能快速提升 DOM 操作能力～
2026-04-22 17:41:04
315
原创 基于高德地图 API 实现地址搜索与经纬度拾取功能
在日常开发中，地图相关功能是高频需求，比如地址定位、经纬度拾取、POI 搜索等。本文将分享如何基于高德地图 JS API 2.0 快速实现一套轻量、易用的地址搜索 + 地图点击拾取经纬度的功能，包含完整的代码解析和核心逻辑拆解。
2026-04-22 08:00:20
931
原创 从零实现前端模糊搜索：从基础匹配到智能检索
前端模糊搜索的核心是「兼容用户的输入不确定性」：从基础的 “字符包含” 到进阶的 “编辑距离容错”，本质是让检索逻辑更贴近用户的真实使用场景。这份游戏名称模糊搜索的案例，从极简版到优化版的改造，覆盖了 “匹配逻辑、交互体验、兼容性” 三大核心维度，你可以直接复用这套思路到电商、文档、通讯录等各类检索场景中。
2026-04-21 14:37:33
667
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人