
分类:编程语言 · JavaScript

前端面试深度解析:核心概念与代码实践
综述由AI生成整理了前端面试中高频出现的概念与手写代码实现,包括ES6常用特性、跨域方案、Vue响应式原理、v-if/v-show差异、性能优化手段、浏览器渲染流程、防抖节流、闭包应用、事件循环机制、Vue3与Vue2对比、new操作符、call/apply/bind、TypeScript装饰器、10万数据虚拟列表渲染,以及时间切片等,均附有可运行的代码示例。

用 Nginx 部署 Vue 项目全过程
综述由AI生成前端Vue项目打包后部署到Nginx服务器,主要涉及Nginx安装、配置文件修改以及处理单页应用路由。Nginx优点包括高并发、低内存消耗等。部署时,通过npm run build生成dist,配置server区块设置root指向dist,并用try_files和@router解决刷新404问题。最后nginx -s reload生效。

前端地图开发核心概念:坐标系、SDK与GeoHash实践
综述由AI生成前端地图开发涉及矢量地图、卫星图、地形图三种服务类型,以及 WGS84、GCJ-02、BD09 三大坐标系。国内地图服务需强制使用加密坐标系,不同平台间坐标转换需注意偏移。主流地图 SDK 如高德、百度、腾讯、Google Maps、Mapbox GL JS 各有适用场景和免费额度。常见面试考点包括 Web Mercator 投影、GeoJSON、瓦片机制、海量点渲染优化、GeoHash 编码等,掌握这些基础即可应对多数地图开发需求。

前端错误处理:try/catch 与 Promise 的正确姿势
综述由AI生成前端错误处理容易混用 try/catch,尤其在异步和 fetch 场景下极易漏掉异常。文章区分了同步与异步的捕获边界,解释了 fetch 对 HTTP 错误码不抛异常的特点,并给出业务异常和系统异常的分类处理方法,包括 JSON 安全解析和错误上报等实践建议。

宜搭低代码实践:待办应用从表单到列表全流程
综述由AI生成通过宜搭低代码平台搭建待办事项应用,覆盖普通表单设计、自定义列表页面配置、数据获取、分页搜索、增删改查、行选择转移及消息通知等完整功能。记录了表单字段创建、远程 API 调用、变量绑定与事件处理的具体实现,指出字段唯一标识映射是易错点,强调需根据实际环境替换 AppType 和 FormUuid。代码示例与配置步骤均基于认证实操,表述直白。

JS 流程控制:条件与循环核心用法
综述由AI生成通过实例讲解 JavaScript 中的 if、switch 和循环基础,涵盖 == 与 === 的区别、逻辑运算符、三目运算符以及 for、while、for...of 的用法,适合快速回顾。

用 DeepSeek API 生成贪吃蛇游戏与扩展
综述由AI生成通过 DeepSeek API 生成贪吃蛇游戏核心代码,快速搭建 Canvas 渲染、碰撞检测与计分机制,并进一步扩展 WebSocket 多人联机、动态难度调整、本地存档回放及跨平台移植等特性。
WebSocket 客户端实践:重连、心跳与可靠通信
综述由AI生成从零搭建一个健壮的 WebSocket 客户端,涵盖自动重连、心跳保活和消息分发,避免原生 API 在断开、空闲回收和逻辑散乱方面的常见陷阱。给出基础封装类、React 集成示例,并扩展到认证、指数退避重试和消息队列等生产常用变体。同时提供 Node.js 服务端简单实现及前端多连接管理方案,最后讨论何时该用 WebSocket 以及运维注意事项。

用 Composition API 和 Hook 做前端权限控制
综述由AI生成前端权限控制如果直接散落在组件里,很快会变成重复判断和维护负担。把权限逻辑抽成自定义 Hook 或 Vue 3 的 Composition API,可以统一处理按钮级、字段级和菜单级权限。文中分别给出了 Vue 的 usePermission、useAccess,以及 React 对应的 Custom Hook 写法,并补充了按权限列表、角色判断和动态更新的处理方式。实际落地时,computed 或 useMemo 适合缓存结果,权限变…
前端下载二进制流文件的几种做法
综述由AI生成前端下载 application/octet-stream 文件的关键是把后端返回的二进制响应转成 Blob,再通过临时 URL 触发浏览器下载。文章分别给出 fetch 和 axios 两种实现,说明了如何从 Content-Disposition 里解析文件名,如何兼容成功返回文件、失败返回 JSON 的接口,以及大文件流式下载、IE 兼容和对象 URL 释放这些容易漏掉的细节。

Vue 3 和 React 文件上传实战指南
综述由AI生成对比了 Vue 3 和 React 下单文件、多文件、拖拽、手动上传以及进度监听的常见实现方式。原生方案主要依赖 input、FormData、fetch 和 XMLHttpRequest,控制力更强;Element Plus、Ant Design 这类组件库能明显减少样式和交互代码。文中还强调了字段名与后端参数一致、beforeUpload 和 maxCount 这类校验点,以及 React Upload 中 originFileOb…

Vue 基础语法与响应式原理笔记
综述由AI生成这份笔记梳理了 Vue 2 的基础语法和响应式思路:从 MVVM、实例创建、模板与数据绑定,到常用指令、过滤器、计算属性、watch、生命周期,再到 class/style 绑定和表单收集。重点放在这些语法背后的工作方式和实际取舍,比如 v-if 与 v-show 的使用场景、v-for 为什么要加 key,以及 Vue 2 通过 Object.defineProperty 做数据代理的原理。

Vue Router 实战:守卫、嵌套路由和状态管理
综述由AI生成Vue Router 的几个进阶能力主要集中在守卫、嵌套路由、重定向/别名、history 模式和 meta 元信息上:守卫负责权限校验、离开确认和埋点,嵌套路由依赖父组件中的 router-view,history 模式则要根据部署方式选择 Hash、History 或 Memory。后半部分补充了 Pinia 与 Vuex 的取舍、Pinia 的基础写法,以及用本地存储或 Cookie 做简单持久化的示例。

Page-Agent:把大模型放进前端 DOM 里的新做法
综述由AI生成Page-Agent 把智能体放进浏览器前端,通过注入 JavaScript 直接读取 DOM、继承登录态,并把自然语言转成点击、输入和滚动等页面操作。它用 DOM 脱水替代截图式视觉识别,支持接入不同大模型,也保留人机协同,适合表单录入、报表导出、后台操作和跨标签页数据搬运这类重复性强的网页场景。

前端保存并恢复用户上次阅读位置的几种做法
综述由AI生成在阅读类、资讯类和博客类页面中,回到上次阅读位置通常有三种实现:用 localStorage 记录 scrollY 并在加载时 scrollTo 恢复;用 Intersection Observer 给章节前插入探针,记录当前可见章节并在刷新后滚回对应位置;或者把当前位置同步到 URL hash,让浏览器天然支持跳转和分享。scrollTop 方案最简单,适合静态短页;探针方案更适合长内容和结构清晰的文章;hash 方案便于分享,但要考…

腾讯前端 AI 面试考点整理:基础、原理与系统设计
综述由AI生成腾讯前端 AI 方向面试覆盖网络、缓存、React 合成事件、动态路由权限、DOM/BOM、性能优化、HMR 和 SSR 等高频考点,题目偏基础纵深与原理追问。文章按知识点拆解了输入 URL 到页面渲染的完整链路、强缓存与协商缓存的适用场景、React 事件系统的实现差异,以及权限路由和 SSR 的工程取舍,结论是大厂更看重能否把原理讲成完整链路,而不是死记答案。
前端 XSS 防护:layui util 与 js-xss 的实用写法
综述由AI生成前端防 XSS 的常见做法有两类:一类是像 layui 的 util.escape() 这样做 HTML 转义,把危险字符变成实体,适合普通文本输出;另一类是用 js-xss 按白名单过滤富文本,保留安全标签并移除危险标签和属性。文章分别给出了安装方式、基础用法、自定义白名单、标签与属性钩子示例,以及评论和富文本编辑器的典型场景。最后强调,前端过滤只能减轻风险,服务端还要再做一层校验,不能把安全完全寄托在浏览器端。

Web 端 3D 开发的实用技术栈梳理
综述由AI生成Web 端 3D 做数字孪生或智慧工厂,核心不是单个工具,而是 Blender、Three.js、数据通信和工程化的一整套链路。文章梳理了 Three.js 与 Blender 的基础职责,R3F、Babylon.js、Redux/Zustand 等交互与状态方案,MQTT/WebSocket、Cesium、LOD、InstancedMesh 等实时与性能手段,以及 D3/ECharts、Ammo.js、GSAP、Vite、glTF 压…
SSE 在前端流式输出中的实现与取舍
综述由AI生成SSE 是一种基于 HTTP 的服务器推送机制,适合 AI 聊天流式输出、实时通知和日志流展示。文章说明了 SSE 的消息格式、EventSource 与 fetch + ReadableStream 两种前端接入方式,以及 Express + LangChain 的后端实现。重点放在流式分包解析、TextDecoder 解码、错误处理和 UI 状态管理上,并对比了 SSE 与 WebSocket 的适用边界:前者适合单向文本推送,后者…
