自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

涂涂

一只正在爬的小蜗牛猿

  • 博客(364)
  • 资源 (2)
  • 收藏
  • 关注

原创 requestAnimationFrame和requestIdleCallback分别是什么,是用在什么场景下

**深入解析 `requestAnimationFrame` 和 `requestIdleCallback`**

2025-03-24 15:50:18 933

原创 UniApp 高频面试题

Redux 和 MobX 是 React 生态中的两大状态管理方案,在面试中常涉及。RTK 是 Redux 官方推荐的。,用于管理应用的全局状态。,而 Context 适用于。,助你轻松应对面试!

2025-03-11 22:49:45 858

原创 Redux 和 MobX 高频面试题

Redux 和 MobX 是 React 生态中的两大状态管理方案,在面试中常涉及。RTK 是 Redux 官方推荐的。,用于管理应用的全局状态。,而 Context 适用于。,助你轻松应对面试!

2025-03-11 22:06:06 579

原创 前端状态管理 pinia和vuex高频面试题

是 Vue 生态中常用的状态管理方案,在面试中经常涉及。TypeScript,直接定义。,相比 Vuex 更简单。,助你轻松应对面试!,支持时间旅行调试。

2025-03-11 21:57:59 745

原创 Taro 面试题

JSX → AST 解析 → 代码转换 → 输出小程序。JSX 解析 → 转换 AST → 生成小程序代码。,React Hooks 可以。,无需编译 Nerv.js。Taro 3 直接使用。

2025-03-11 21:45:32 913

原创 Webpack & Vite 前端高频面试题

🔥 什么是热更新(HMR - Hot Module Replacement)?热模块替换(Hot Module Replacement, HMR)是前端开发中的一个优化机制,它允许在代码修改后不刷新整个页面,只更新变化的模块,从而加快开发效率,保持应用状态不丢失。🔥 Vite 的 HMR vs Webpack 的 HMRVite HMR原理利用浏览器原生 ESM,按需更新模块基于 WebSocket 监听变化,触发更新编译方式依赖ESBuild,即时编译速度快使用。

2025-03-11 17:04:20 1319

原创 前端非技术性场景面试题

性能核心React:控制重渲染范围(虚拟化 + Memo)Vue:缩减响应式依赖(shallowRef + 计算按需)协作挑战规范先行:React 推行 Hooks 纯净性原则(禁止条件内声明);Vue 制定 Composition API 代码组织规范(功能聚合式开发)。工具赋能React:ESLint 插件强制检测依赖项完整性Vue:定制 CLI 生成器规范组件结构可度量改进性能指标纳入 CI/CD 卡控(如 Lighthouse 评分 ≥80)

2025-03-11 00:25:37 1111

原创 http和浏览器相关的高频面试题

一、HTTP相关问题 1. HTTP状态码及其含义 ✅ HTTP 状态码分类: 1xx(信息响应):101(协议切换) 2xx(成功):200(OK)、201(Created) 3xx(重定向):30

2025-03-10 17:59:35 993

原创 TypeScript的高频面试题

✅ TypeScript 的主要优势:✅ TS vs JS 主要区别:二、类型系统3. 和类型的区别4. 接口(Interface)与类型别名(Type Alias)的区别5. 联合类型(Union Types)与交叉类型(Intersection Types)三、高级特性6. 泛型(Generics)的作用及示例7. 枚举(Enum)与常量枚举(Const Enum)的区别8. 类型守卫(Type Guards)的作用及实现方式四、工程化与配置9. 如何处理可空类型(

2025-03-10 17:40:09 668

原创 CSS面试题

答:HTML 语义化标签是指标签本身具有明确的意义,能够清晰表达结构和内容,使代码更具可读性和可维护性,同时有利于 SEO。常见的语义化标签:优点:答: 和 作用:示例:3. 如何关闭 iOS 键盘首字母自动大写?答:在 或 中添加 :或者:此外,也可以使用 来避免 iOS 设备自动填充历史记录。答:Chrome 默认不允许小于 的字体,但可以通过 绕过限制:或者,使用 :特殊情况:答:示例:使用建议:答:iOS 设备在点击按钮或链接时,默认会有灰色半透明背景,可以使用

2025-03-10 17:02:16 863

原创 JavaScript面试宝典

JavaScript 由以下三部分组成:JavaScript 具有以下内置对象:数组方法可以分为几类:闭包(Closure) 是指函数可以访问其外部作用域的变量,即使外部函数已经执行结束。特点:示例:闭包(Closure)是指一个函数能够访问其外部作用域中的变量,即使在外部函数执行结束后,仍然可以保留对外部变量的访问权限。闭包的主要使用场景如下:闭包可以创建私有变量,防止外部直接访问或修改数据。🔹 应用场景:闭包常用于事件监听器或回调函数,使得事件处理函数能够访问外部作用域中的变量。🔹 应用场景

2025-03-10 14:51:42 1665

原创 前端非技术性场景面试题

性能核心React:控制重渲染范围(虚拟化 + Memo)Vue:缩减响应式依赖(shallowRef + 计算按需)协作挑战规范先行:React 推行 Hooks 纯净性原则(禁止条件内声明);Vue 制定 Composition API 代码组织规范(功能聚合式开发)。工具赋能React:ESLint 插件强制检测依赖项完整性Vue:定制 CLI 生成器规范组件结构可度量改进性能指标纳入 CI/CD 卡控(如 Lighthouse 评分 ≥80)

2025-03-07 18:32:50 850

原创 vue面试宝典之二

Vue2:基于正则和递归下降解析,生成较通用的渲染函数,静态优化有限。Vue3:采用逐字符扫描和 Block Tree,结合 PatchFlag,实现精准更新。编译时优化程度更高,直接提升运行时性能。什么是“刷新后二次加载路由”?刷新后二次加载路由,指的是在 Vue 项目中,用户刷新页面后,路由会重新解析并加载,但由于某些原因(如异步路由、权限控制、动态添加路由等),导致路由数据丢失或需要二次加载,甚至页面 404 或白屏的问题。动态路由未持久化(如基于权限的addRoute()添加路由)。

2025-03-06 23:53:39 966

原创 vue面试宝典之一

功能Vue 2 生命周期Vue 3 生命周期(组合式 API)使用场景数据初始化createdsetup初始化数据、调用 API初次渲染mountedonMountedDOM 操作、动画数据更新updatedonUpdated监听和响应数据变化组件销毁destroyed清理定时器、事件监听依赖追踪不适用调试性能问题在 Vue 3 中,组合式 API 带来了更高的灵活性,支持更加简洁的生命周期钩子函数,同时还允许在setup阶段完成更多初始化工作。

2025-03-06 18:50:01 828

原创 前端面试技术性场景题

通过分片上传、断点续传、并发控制、进度反馈等技术组合,可有效解决大文件上传的稳定性、性能和用户体验问题。核心在于前端合理拆分任务,服务端高效管理分片,同时结合业务需求优化传输策略。核心功能可视化座位布局(Canvas/SVG + 动态数据渲染)。实时选座状态同步(WebSocket + 乐观锁冲突处理)。限制选座逻辑(最大数量、相邻推荐)。技术实现前端:状态管理(Redux/Zustand)、交互优化(高亮/动画)。后端:座位库存管理(Redis锁+事务)、API设计(查询/锁定/合并)。

2025-03-04 18:15:25 681

原创 React面试葵花宝典之三

Monorepo 通过集中化管理和代码共享,解决了多仓库协作的碎片化问题,尤其适合复杂项目或需要高度协作的团队。选择时需权衡项目规模、工具链支持与团队能力,合理使用工具(如 Turborepo 或 Nx)可大幅降低维护成本。服务端渲染(SSR) vs. 客户端渲染(CSR)服务端渲染(SSR - Server-Side Rendering)客户端渲染(CSR - Client-Side Rendering)它们的区别在于HTML 生成的时机SSR:HTML在服务器端生成,然后返回完整的页面给浏览器。

2025-03-04 18:14:42 1162

原创 React面试葵花宝典之二

解决问题:改善与 Web Components 的集成完整支持自定义元素正确处理属性和属性传递数据不可变性遵循不可变数据的原则,避免直接修改原有状态。异步和批量更新支持异步更新,React 可以批量处理多个状态更新,提升性能。生命周期管理:通过setState,React 能够触发生命周期钩子,确保组件正确更新。性能优化可以通过智能的差异化更新减少不必要的 DOM 操作,而直接修改this.state会跳过这一过程。因此,直接修改this.state。

2025-02-28 18:01:11 1139

原创 React面试葵花宝典之一

React Fiber 是 React 渲染引擎的一次重大升级,通过引入异步渲染、优先级调度和增量渲染,极大提升了 React 的性能和灵活性。它为未来的 React 特性(如并发模式和 Suspense)提供了基础,同时也优化了复杂 UI 更新和高频交互的性能。虽然 Fiber 的实现较为复杂,但它为 React 提供了更强大的能力,尤其是在需要精细控制渲染过程的场景中。

2025-02-26 19:38:07 940

原创 纯函数(Pure Function)概念

不会修改外部变量、参数、I/O设备或全局状态(如网络请求、文件操作等)。通过避免副作用,纯函数使代码更模块化、可维护性更高,是函数式编程的基石。,是构建可靠程序的重要基础。

2025-02-26 19:13:56 326

原创 从0到一实现React Fiber从零到一实现React Fiber

以上代码实现了一个简化的React Fiber渲染过程,包括创建Fiber节点、协调子元素和更新DOM。实际的React Fiber实现要复杂得多,涉及到更多的优化和功能,如优先级调度、并发模式等。通过这个简化的示例,可以更好地理解iber的基本概念和工作原理。

2025-02-26 19:11:01 967

原创 React 高阶组件(HOC)

1.React 高阶组件(HOC) ****1. HOC(高阶组件)HOC (Higher - Order Component) 定义: 高阶组件是一个****接收组件作为参数并返回新组件的函数,用于

2025-02-26 19:08:10 798

原创 CI/CD

持续集成(CI)Continuous Integration (CI):开发人员频繁地将代码集成到共享的主干或分支中,通常每天多次。每次集成都会触发自动构建自动编译和测试,以尽早发现和解决问题。每次提交代码后自动触发编译,单元测试等操作就叫持续集成持续交付(CD)Continuous Delivery (CD):在CI的基础上,持续交付确保代码在任何时候都处于可部署状态。这意味着代码经过充分的测试后,可以随时发布到生产环境。即通过自动化流程,将应用频繁的可靠的交付到生产环境持续部署(CD)

2025-02-25 22:33:11 630

原创 CI/CD的定义

持续集成(CI)Continuous Integration (CI):开发人员频繁地将代码集成到共享的主干或分支中,通常每天多次。每次集成都会触发自动构建和测试,以尽早发现和解决问题。持续交付(CD)Continuous Delivery (CD):在CI的基础上,持续交付确保代码在任何时候都处于可部署状态。这意味着代码经过充分的测试后,可以随时发布到生产环境。持续部署(CD):持续部署是持续交付的进一步自动化,代码通过自动化测试后,会自动部署到生产环境,无需人工干预。

2025-02-24 18:39:43 578

原创 git 的一些操作总结

Git 分支操作包括创建、切换、合并和删除分支。合并冲突需要手动解决,修改后重新提交。本地仓库与远程仓库通过clonepush和pull进行交互。跨团队合作常用 Fork 工作流和 PR 机制。变基可以优化提交历史,但需谨慎使用,避免重写公共提交记录。

2025-02-24 18:12:44 930

原创 (git log、git reflog),(git reset --hard、git reset --soft),(git revert,git reset )的区别

查看历史使用git log查看提交历史。使用git reflog查看所有操作记录。回退版本使用彻底回退并丢弃变更。使用回退并保留变更。撤销提交使用git revert撤销提交并保留历史。使用git reset直接修改历史记录。

2025-02-21 17:55:22 455

原创 git的初始化:设置用户签名,初始化本地库;git的工作区,暂存区和版本库,托管平台,添加到暂存区,提交本地库,版本 穿梭:git log,git reflog,git reset --hard HE

设置用户签名:配置用户名和邮箱,标识提交者。初始化本地库:将项目纳入 Git 版本控制。

2025-02-21 17:49:13 462

原创 ES13(ECMAScript 2022)中一些新特性的用法总结,包括私有属性、类静态属性、静态代码块、最外层的 `await`、`at` 函数、正则匹配的开始和结束索引等。

以下是 ES13(ECMAScript 2022)中一些新特性的用法总结,包括私有属性、类静态属性、静态代码块、最外层的awaitat函数、正则匹配的开始和结束索引等。

2025-02-20 00:02:06 302

原创 ES12 weakRefs的用法和使用场景

WeakRefWeakRef是 ES12 引入的一个新特性,用于创建对对象的弱引用。弱引用不会阻止垃圾回收器回收对象,即使该对象仍然被弱引用持有。WeakRef通常与结合使用,用于在对象被垃圾回收时执行清理操作。特性描述使用场景WeakRef创建对对象的弱引用,不会阻止垃圾回收器回收对象缓存系统、监听对象生命周期、避免内存泄漏deref()返回弱引用指向的目标对象,若对象已被回收则返回undefined检查对象是否仍然可用结合在对象被垃圾回收时执行清理操作对象生命周期管理、资源清理。

2025-02-19 20:21:54 468

原创 ES12的逻辑操作符 ,数字分隔符,字符串的replaceAll,FinalizationRegistry的用法以及使用场景

&=特性描述使用场景逻辑操作符 (&&=, `??=`)数字分隔符 (提高数字字面量的可读性提高大数字或复杂数字的可读性字符串的replaceAll替换字符串中所有匹配的子字符串需要替换字符串中所有匹配的子字符串时在对象被垃圾回收时执行清理操作需要在对象被垃圾回收时执行一些清理操作,如释放资源。

2025-02-19 20:15:28 289

原创 ES11中String的matchAll方法,BigInt, 对你高层对象globalThis标准的方式获取不同换将下的全局this ,空值合并运算符??以及与||的区别,可选链操作符?.的使用方法

特性描述使用场景返回所有正则匹配结果的迭代器提取字符串中所有匹配正则表达式的部分及其捕获组BigInt表示大整数的数据类型处理大整数计算,如加密算法、大数运算等globalThis提供标准方式获取全局this对象编写跨平台的 JavaScript 代码时,统一访问全局对象空值合并运算符??判断左侧值是否为null或undefined,是则返回右侧值需要区分nullundefined和其他假值时可选链操作符?安全地访问嵌套对象的属性或方法。

2025-02-19 19:18:39 271

原创 ES10中Object.fromEntries(),trimStart() ,trimend()的使用方法和使用场景例子

用途:将一个包含键值对的可迭代对象(如Map或数组)转换成对象。常见场景:从Map转换为对象、处理 URL 查询参数等。

2025-02-19 18:06:36 412

原创 ES6中Object.defineProperty 的详细用法和使用场景以及例子

是 ES5 引入的一个方法,ES6 继续强化了该方法的使用,它允许我们为对象的属性定义或修改属性描述符。它能够控制对象属性的行为,如读写权限、可枚举性和可配置性。writable: true, // 属性值可写enumerable: true, // 属性可枚举configurable: true // 属性可配置});// "Alice"在这个例子中,我们定义了一个name属性,给它设置了值'Alice',并且该属性是可写、可枚举和可配置的。

2025-02-19 16:00:00 1006

原创 异步遍历器 ,异步生成器的详细用法和使用场景给出例子,与同步生成器和同步遍历器的区别

特性同步生成器异步生成器定义语法function*数据获取同步返回异步返回(Promise适用场景同步数据流,简单的生成任务异步数据流,网络请求、大文件等for...of使用可直接使用使用异步遍历器 通过实现 Symbol.asyncIterator 接口,可以异步地遍历数据,适合需要逐步异步处理的数据。异步生成器 结合了生成器和异步操作,适合处理需要生成异步数据流的场景。

2025-02-19 15:52:13 824

原创 ES8字符串填充用法总结:padStart(),padEnd(),rest剩余参数的用法{name,...obj},扩展运算符的用法,正则表达式命名捕获组

作用:用于在字符串的开始处填充字符,直到字符串的长度达到指定值。常见场景:格式化数字、对齐日期、时间等,确保字符串长度一致。padEnd():作用:用于在字符串的末尾填充字符,直到字符串的长度达到指定值。常见场景:文本输出格式化、表格对齐、字符串显示等。例子:填充固定长度的电话号码使用 padStart() 来补充固定长度的电话号码,确保输出一致。通过 padStart() 和 padEnd(),可以轻松实现字符串的对齐、格式化和填充,大大提高了处理字符串时的便利性。

2025-02-18 19:33:31 390

原创 ES8对象方法扩展: Object.values(),Object.keys(),Object.entries(),Object.getOwnPropertyDescriptors()用法详细总结

返回对象所有属性的值,适用于只关心对象的值的场景。常用于查找符合条件的值,或者进行统计等操作。返回对象所有属性的名称,适用于遍历对象的属性名。常用于枚举属性,或者获取属性名进行其他处理。返回对象所有属性的键值对,适用于同时需要键和值的场景。可与 Map 等结构结合使用,简化代码。获取对象的属性描述符,适用于需要操作对象的属性特性时。Object.asign()只会复制对象的属性,描述符静态方法等不会被复制可用于对象的深拷贝、冻结、保护等复杂操作。

2025-02-18 19:27:30 1168

原创 ES8中 async 和await的用法详细的总结

async:声明异步函数,函数会返回一个 Promise。await:等待 Promise 的结果,能够暂停 async 函数的执行,直到 Promise 完成。async/await 使得异步代码更加简洁、可读,避免了回调地狱。在处理多个异步操作时,await 可以与 Promise.all() 配合使用,实现并行执行。异常处理使用 try/catch,更易于捕获和处理异步代码中的错误。

2025-02-18 18:51:19 1122

原创 es6中Relect的详细用法

Reflect对象不是构造函数,它是一个封装了多个静态方法的对象,这些方法与 JavaScript 中的一些基本操作(如获取属性、修改属性、调用方法等)相关。Reflect的方法通常返回操作的结果,而不像传统的操作会修改对象或抛出异常。Reflect 是 ES6 引入的一个强大的内置对象,它提供了一系列方法,允许我们以更标准化和一致的方式操作对象属性、函数调用等。在需要统一的 API 操作对象时。与 Proxy 配合使用,实现更加简洁的代理操作。

2025-02-18 15:42:28 1223

原创 关于es6-module的语法

ES6 模块引入了更简洁的语法,使得 JavaScript 的代码结构更加清晰和可维护。通过 import 和 export,我们可以将代码拆分成小的模块,按需加载,并处理依赖关系。提高代码的可维护性和可读性。更好的支持循环依赖。默认严格模式,避免了许多常见的 JavaScript 问题。

2025-02-18 15:28:54 872

原创 ES7 (ES2016) 新特性

指数运算符 (**)更简洁的语法更好的语义化更直观的 API更高的性能优先使用新特性注意浏览器兼容性合理使用语法糖保持代码一致性。

2025-02-17 23:39:57 358

原创 es6的Generator函数用法

Generator 函数是 ES6 提供的一种异步编程解决方案,它可以让函数执行过程中被暂停和恢复。Generator 函数通过function*声明,内部使用yield关键字暂停执行。控制函数执行流程异步操作同步化表达状态管理迭代器实现异步操作控制数据流处理状态机实现迭代器生成合理使用执行器错误处理避免过度使用考虑可读性。

2025-02-17 23:00:10 508

vuedemo - 副本.zip

基于vue脚手架的一个vue全家桶demo,这是一个基础的demo,融进了vue + vue-cli 4.x + vue-router + element + vuex + axios + 代理转发 基础demo,可以做官网的基础demo,在基础上根据ui开发,也可以在基础上开发后台管理系统,也可以开发app,github地址:https://github.com/tutuQin/vue-base-demo

2020-05-19

原型与原型链的实战代码.html

原型和原型链整体例子从原型的创建,原型与对象的关联关系,实例与原型的关系以及原型链的形成和运用等等均做了例子的说明

2020-05-19

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除