- 博客(109)
- 收藏
- 关注
原创 Day8 完整学习包(Vue 基础 & 响应式)——2026 0320
Vue 响应式是「数据驱动视图」的底层机制:当数据(data/props/computed 等)发生变化时,视图会自动、高效更新,无需手动操作 DOM,核心目标是让开发者聚焦数据逻辑,而非 DOM 操作。劫持数据的读取 / 修改操作,在数据变化时自动触发视图更新,无需手动操作 DOM,是 Vue 区别于原生 JS/jQuery 的核心特性。核心考点:Vue2/Vue3 响应式的实现差异、依赖收集 / 派发更新流程、响应式失效的解决方法;实战重点:掌握$set(Vue2)、
2026-03-20 17:44:48
330
原创 Day6 完整学习包(async/await)——2026 0318
核心考点:async/await 是 Promise 的语法糖,底层基于 Generator + Promise,核心优势是 “同步风格写异步”;实战重点:掌握try/catch错误处理、并行请求优化,这是前端接口封装的核心技能;易错点:避免无意义的串行 await、不要遗漏错误捕获,这是面试中体现工程化思维的关键。
2026-03-18 18:18:54
297
原创 Day5 完整学习包(Promise 基础)——2026 0316
核心考点:Promise 状态的 “不可逆性” 和链式调用的 “返回新实例” 规则,是异步编程的核心基础;实战重点:熟练用 Promise 封装异步操作,掌握 catch 统一错误处理,为后续学 async/await 打基础;易错点:忽略链式调用的 return 传递规则、未捕获异步错误,开发中需养成 “必写 catch” 的习惯。
2026-03-16 17:57:22
346
原创 Day4 完整学习包(this 指向)——2026 0313
核心考点:this 指向的核心是 “执行时绑定”,优先级顺序和箭头函数特性是面试高频考点;实战重点:解决业务中 “this 丢失” 问题(箭头函数 /bind/ 保存 that),是前端开发必备技能;易错点:混淆箭头函数与普通函数的 this 规则、忽略严格模式对 this 的影响。
2026-03-13 16:57:42
387
原创 Day3 完整学习包(原型 & 原型链)——2026 0312
核心考点:原型链的核心是「__proto__串联prototype的查找链路」,继承是其核心应用;实战重点:必须能手写原型继承(call()+ 修复 constructor),这是 ES5 继承的核心;易错点:避免直接修改__proto__、注意修复 constructor 指向、区分原型链的 “读 / 写” 逻辑。
2026-03-12 18:22:56
215
原创 Day2 完整学习包(闭包 & 立即执行函数)——2026 0311
闭包是 JavaScript 作用域链的特殊表现:当内层函数引用外层函数的变量 / 参数,且内层函数被外层作用域之外的地方调用时,外层函数的执行上下文不会被垃圾回收机制销毁,从而形成闭包。其核心是「延长了外部变量的生命周期,同时实现变量私有化」。核心考点:闭包的定义要紧扣「作用域链 + 变量引用 + 外部访问」,用途需结合业务场景(而非纯理论);实战重点:防抖 / 节流、模块化是闭包最核心的业务落地场景,必须能手写;易错点。
2026-03-11 11:28:42
323
原创 Day1 完整学习包(var/let/const + 作用域)——2026 0310
核心考点:var/let/const 的核心差异集中在作用域、变量提升、赋值规则三个维度,是前端基础高频面试题;实战重点:开发中优先用 const,其次 let,彻底弃用 var,避免变量污染和逻辑漏洞;易错点:const 并非 “常量不可变”,而是 “引用地址不可变”,复杂类型的属性 / 元素仍可修改。
2026-03-10 16:26:19
360
原创 前端数组去重(高级视角 + 场景 + 精简)——2026 0309
反向遍历 + 缓存场景:购物车合并同款商品(保留最后加入的商品规格);实现:反向遍历数组,用对象缓存已出现的 key,保留最后一项。简单数据:Set 极简高效,适配小数据量业务场景;复杂对象:Map / 对象缓存,O (n) 性能适配业务列表去重;超大数组:排序后去重,平衡性能与内存占用。核心思路:去重方案需结合「数据类型、数据量、业务规则(保留项)」选择,而非单一方案,体现性能与业务适配思维。
2026-03-09 17:55:47
43
原创 前端数组核心方法(高级视角 + 场景 + 精简)——————2026 0309
基础方法:push/splice 侧重业务操作,需注意原数组修改风险;高阶方法:map/filter/reduce 体现数据加工能力,纯函数特性适配框架;性能考量:find/slice 减少无效遍历,大数据场景优先选择。核心思路:数组方法选择需结合「是否修改原数组、遍历效率、框架特性」,而非单纯记忆 API,体现工程化和性能思维。
2026-03-09 17:55:04
56
1
原创 Flutter 实战经验(场景 + 落地)——0309
实战落地:结合电商 / IoT 场景,体现 Flutter 在跨端效率、交互性能上的落地价值;避坑经验:聚焦渲染 / 兼容 / 原生交互核心坑点,给出具体解决方案;选型思维:明确 Flutter 的适用边界,体现技术选型的合理性(而非盲目跨端)。核心思路:Flutter 的核心价值是「跨端效率 + 原生级体验」,落地时需结合业务场景平衡复用率与原生能力,规避渲染性能、平台兼容等核心坑点。
2026-03-09 17:47:18
272
原创 前端优化——2026 0309
下载速度:通过「体积压缩 + 请求策略」减少资源加载耗时,优先保障首屏核心资源;运行性能:通过「虚拟列表 + 非主线程计算」减少主线程阻塞,提升交互流畅度;体验兜底:弱网 / 异常场景下的降级方案,保障基础体验。核心思路:前端性能优化是「分层优化 + 场景适配」,先通过构建 / 网络层降低下载成本,再通过运行时减少渲染 / 计算开销,最后通过兜底方案保障极端场景体验。
2026-03-09 17:46:25
280
原创 uni-app 轨迹回放实现(场景 + 方案)——2026 0309
数据层:标准化经纬度 + 时间戳的轨迹数据,预处理计算时长 / 距离;渲染层:跨端适配地图 SDK,用 polyline 绘轨迹、marker 标当前位置;控制层:时间轴驱动遍历轨迹点,封装播放 / 暂停 / 倍速核心方法,兼顾性能优化。核心思路:轨迹回放本质是「时间轴 + 地图元素动态更新」,跨端开发需优先适配各端地图组件特性,通过数据预处理和定时器控制实现流畅的回放体验。
2026-03-09 17:45:22
100
原创 uni-app 核心坑点及解决方案——2026 0309
跨端兼容:样式 / API 差异通过「动态计算 + 统一封装」解决,适配不同端特性;性能优化:长列表用虚拟列表 / 分段加载,图片压缩 + 懒加载提升首屏速度;工程化避坑:异步 API Promise 封装、路由传参用 ID 替代复杂对象,降低跨端异常概率。核心思路:uni-app 坑点多源于「跨端特性差异」,高级工程师需围绕「统一封装、适配降级、性能优化」三大原则,结合业务场景给出可落地的解决方案,而非仅罗列问题。
2026-03-09 17:44:05
423
原创 Vue3 相对 Vue2 的核心改进——2026 0309
响应式:Proxy 解决 Vue2 监听缺陷,电商 / 表单场景无需额外 API,代码更健壮;组合式 API:按业务逻辑聚合代码,通用逻辑抽离为组合函数,后台系统复用性大幅提升;性能 + 工程化:按需打包、静态提升优化渲染性能,原生 TS 支持适配大型项目,降低协作成本;新特性:Teleport/Suspense/ 多根节点等,解决移动端弹窗、异步加载等实际场景痛点。核心思路:Vue3 并非对 Vue2 的颠覆,而是在工程化、性能、类型支持、开发体验。
2026-03-09 17:39:23
344
原创 实时协同白板实现
其他端 ← 重绘 Canvas ← drawingHistory 更新 ← 解析消息 ← WebSocket 接收。用户操作 → 本地 drawingHistory 更新 → 重绘 Canvas → WebSocket 发送。要点:本地先更新并重绘,再发消息,保证本地体验流畅。要点:用百分比坐标,保证不同分辨率下图形比例一致。// 1. 打开白板。// 2. 下发历史。
2026-03-04 18:20:46
358
原创 对于新的 vue3 的 composition API有什么样的认识?和 Vue2 的写法相比,更喜欢哪种写法?谈谈原因?
它不是对 Vue2 的否定,而是对复杂场景下前端工程化能力的升级—— 既解决了 Vue2 在逻辑组织、复用、类型支持上的痛点,又保持了 Vue 的易用性,更适配企业级项目的长期维护和扩展需求。
2026-02-28 11:15:25
269
原创 Vue3+JS 高级前端面试题
响应式正确性:避免直接替换reactive对象的根引用(如需替换,用解构响应式状态时,使用toRefs保证响应式不丢失;深层嵌套对象无需手动递归代理,Vue3 Proxy 会懒递归处理。性能优化:计算属性依赖 “最小化”(如用而非整个list做依赖);避免在循环中定义计算属性 / 方法,减少不必要的响应式依赖。工程化:统一通过 Pinia 方法修改状态,避免组件直接修改,保证状态可追溯。编译优化核心::将静态节点提升到渲染函数外部,避免每次渲染重新创建;
2025-12-16 17:36:13
936
原创 手写自适应码率切换(ABR)播放器控制逻辑
该播放器是基于 Vue3 + TypeScript + HLS.js 开发的自适应码率(ABR, Adaptive Bitrate Streaming)视频播放组件,核心能力是,同时支持手动控制与策略配置,兼顾播放流畅性与画质体验。
2025-11-26 18:18:42
982
原创 视频截图功能
该组件的视频截图功能支持在摄像头预览或录制过程中快速捕获视频帧,生成高清 PNG 格式截图,提供截图预览、下载、清除等完整操作流程,同时适配普通预览和全屏预览两种场景,兼顾易用性与兼容性。
2025-11-25 17:47:24
833
原创 视频放大(全屏预览)功能
该组件的视频放大功能核心为「全屏预览」能力,支持在不中断录制流程的前提下,将摄像头实时画面或录制中的视频以全屏模式展示,提升视觉体验与画面细节查看效率,同时提供便捷的操作入口与退出方式。
2025-11-25 17:44:50
653
原创 链接生成二维码组件
该组件是一个基于 Vue3 + TypeScript 开发的轻量化工具组件,核心功能为,并提供二维码预览、链接复制、二维码下载等一站式操作,适用于会议分享、资源分发等需要快速将链接转化为可扫描形式的场景。
2025-11-25 16:32:36
642
原创 2025-11-11
当 A 用户输入内容时,B 用户的光标位置需要根据 A 的输入动态调整(例如 A 在 B 光标前插入文字,B 的光标应自动后移)。:内容管理系统中,不同角色有不同的菜单访问权限,需根据用户角色权限过滤树形菜单(仅保留有权限的菜单及其父节点,无权限的子节点隐藏)。:远程会议的聊天区中,需要计算用户当前未读消息数量。:地图导航 APP 中,用户搜索 "咖啡店" 后,需根据用户当前坐标计算各店铺的直线距离,并按距离由近到远排序。的去重合并能力、贪心算法在优惠计算中的应用,实际项目中用于购物车性能优化与价格计算。
2025-11-11 18:28:22
265
原创 2025-11-10
v-forv-if二,场景:老师在白板绘图时,学生端需实时显示同步轨迹。核心:用 WebSocket 实现双向通信,Vue 响应式数据lines驱动两端视图同步,通过角色区分控制发送权限。三,场景:老师上传 100MB + 课件,需支持断点续传、进度显示。优势:通过文件 hash 实现断点续传,分片上传减少单次请求压力,实时进度反馈提升远程教学中的用户体验。:根据组件关系选择(父子 / 跨级 / 兄弟),实际项目中需结合场景灵活运用。
2025-11-10 18:27:30
272
原创 format的理解(json-schema以及自定义format)
使用场景:企业内部规范(如 11 位手机号、18 位身份证)、特定编码格式(如自定义订单号实现方式// 自定义手机号校验});// 使用自定义 format// true。
2025-11-10 11:05:08
310
原创 2025 -11 -4——vue3
在会诊系统这类逻辑复杂、复用需求高、类型安全要求严的大型项目中,Composition API 通过 “逻辑聚合、明确复用、类型友好” 三大特性,显著降低了代码维护成本和出错风险,这是 Options API 难以比拟的。
2025-11-04 17:43:41
984
原创 vue3+ts——JSX,SFC
都是在描述 “组件的渲染逻辑、交互行为和样式规则”,最终都会被编译为渲染函数,生成虚拟 DOM,再映射为真实 DOM。,无优劣之分,关键是理解底层编译逻辑和框架设计理念。
2025-10-31 15:04:56
397
原创 vue3+ts,技巧
对于需要更复杂逻辑的组件,可以使用显式定义组件选项。<template></div><slot /></div></div>// 定义 props 接口// 卡片标题title?: string// 是否有阴影shadow?: boolean// 自定义样式// 定义 emits 接口name: 'Card', // 显式指定组件名(利于调试和 IDE 提示)props: {title: {},shadow: {},},// 计算属性(带类型推断)}))
2025-10-31 14:34:51
854
原创 数据可视化
************************思考:Antv G2 的绘图流程是怎样的?*********************1.编写 canvas 标签(注意指定宽高。5.调用 zrender add 方法绘图。2.获取 canvas DOM 对象。4.初始化 zrender 绘图对象。3.初始化 zrender 对象。3.获取 Canvas 对象。1.引入 zrender 库。Zrender:绘图流程。highcharts介绍。2.编写 div 容器。WebGL:绘图流程。
2025-09-11 16:29:47
339
原创 面试技巧——仅个人观点
1.关于简历:简洁明了,突出个人技能和项目经验(项目技术栈)2.把个人博客、开源作品放在简历中3.保证能力真实性(避免使用精通导致造成面试攻击)4.面试过程注意事项(1)如何看待加班:像借钱,救急不救穷(2)千万不要挑战面试官,反考面试官(3)学会给面试官惊喜,处理问题的解决方案(4)遇到不会的问题,说出你知道的部分即可,别岔开话题(5)谈谈你的缺点:说一下你最近在学习什么即可
2025-08-12 15:14:28
144
原创 白板功能文档
医学白板是一个支持多人协作的绘图工具,主要用于医疗场景下的图形标注、测量及文字说明。支持多种绘图工具(手绘笔、直线、箭头、矩形、圆形等),并具备图形选择、移动、删除等编辑功能,同时支持直线距离测量(以厘米为单位)。坐标系统:使用百分比坐标而非像素坐标,确保在不同尺寸的画布上正确显示绘图历史:通过数组存储所有绘图动作,支持撤销、重绘和协作同步图形命中检测:实现了不同图形的点击检测算法,支持精确选择测量功能:通过像素距离与实际尺寸的转换(1cm = 37.8px)实现距离测量协作机制。
2025-08-12 14:43:31
330
原创 标注工具组件功能文档
该标注工具是一个基于 Canvas 的交互式绘图组件,支持多种绘图工具、测量功能、隐私遮挡(蒙版和马赛克)以及协作标注等功能。组件采用 Vue 3 + TypeScript 开发,结合 Element Plus 组件库,提供了丰富的标注能力和友好的用户界面。
2025-08-12 14:39:05
461
原创 weakMap和weakSet区别?
WeakMap 和 WeakSet 均通过弱引用机制优化内存管理,主要区别在于存储结构(键值对 vs 单一对象集合)和弱引用的目标(键 vs 存储的对象本身),适用于需临时关联对象数据的场景。
2025-08-12 11:18:46
326
原创 2025面试题——(11)
script>变为 <script>,直接显示,而不会作为脚本执行。脚本内容:获取 cookie,发送到我的服务器(服务器配合跨域。一个博客网站,我发表一篇博客,其中嵌入<script>脚本。发布这篇博客,有人查看它,我轻松收割访问者的 cookie。替换特殊字符,如 <变为 < >变为 >前端要替换,后端也要替换,都做总不会有错。
2025-08-07 11:24:49
208
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅