自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(177)
  • 收藏
  • 关注

原创 React-Router 工作原理? react-router-dom 有哪些组件

React Router 提供了一种声明式的方式来处理 SPA 应用的路由,通过将 URL 路径和 React 组件相结合,使得你可以轻松地在不同的视图之间进行导航,而不刷新页面。提供了许多强大的组件和 hooks,帮助开发者更灵活地管理应用中的路由和导航逻辑。

2024-12-20 11:39:44 1190 3

原创 Redux工作原理

Redux 通过其核心概念——stateactionreducerstore,将复杂的应用状态管理从组件中解耦出来,使得状态变得更加可预测和易于管理。它特别适用于大型或复杂的单页应用(SPA),但是对于小型应用,可能会显得有些过于复杂。

2024-12-20 11:37:52 841

原创 React 事件机制和原生 DOM 事件流有什么区别

特性原生 DOM 事件React 事件机制事件绑定直接绑定到 DOM 元素事件委托,统一绑定到根 DOM 元素事件流捕获、目标、冒泡阶段只支持冒泡阶段事件对象原生事件对象SyntheticEvent,包装后的事件对象事件委托手动实现事件委托自动实现事件委托性能优化每个元素独立绑定事件监听器通过事件委托优化性能事件池没有池化机制合成事件池化,减少内存使用React 的事件机制与原生 DOM 事件机制相比,主要通过事件委托、合成事件和池化机制等手段来提升性能和跨浏览器兼容性。

2024-12-20 11:36:12 1143

原创 简述 React 的生命周期

挂载阶段→→render→更新阶段→→render→→卸载阶段错误处理→随着 React Hooks 的引入,函数组件可以通过useEffectuseState等 Hooks 管理生命周期,提供了更简洁和灵活的方式。

2024-12-20 11:34:42 493

原创 JSX是什么,它和JS有什么区别

JSX(JavaScript XML)是 JavaScript 的一种扩展语法,常用于 React 中来描述用户界面(UI)。JSX 允许你在 JavaScript 代码中直接编写类似 HTML 的语法,这使得开发者可以更加直观和简洁地定义 React 组件的结构。</h1>;在这个例子中,</h1>看起来像 HTML 代码,但它实际上是 JSX 语法。JSX是一种让 React 开发更加直观、易懂的语法扩展,它允许我们像编写 HTML 一样定义界面,但本质上它会被编译为普通的 JavaScript。

2024-12-20 11:28:17 628

原创 前端跨越方式有哪些

CORS:最常用且标准的跨域解决方案,需后端支持。JSONP:适用于 GET 请求,早期常用的跨域方式,但存在安全隐患。WebSocket:支持双向通信的跨域方式,适合实时应用。:用于跨域的窗口间通信,适合嵌套iframe或父子窗口通信。Iframe + 后端代理:通过服务器代理跨域请求,适用于不支持 CORS 的服务器。代理:前端开发中常用的解决跨域的手段,适用于开发环境。选择哪种方式取决于具体的应用场景、后端支持情况和跨域请求的类型。

2024-12-19 11:26:15 1225 2

原创 ref 和 reactive 你觉得在项目中使用那个更合适

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。在 Vue 3 中,ref和reactive都是用于响应式状态管理的 API,它们各自有不同的适用场景和特点。选择使用ref还是reactive取决于你的数据结构和使用需求。

2024-12-19 11:24:30 792

原创 什么是原型链

对象的原型:每个对象都有一个原型,指向一个对象,这个对象称为原型。原型链:对象通过原型链查找自己的属性和方法。查找的过程是从对象本身到它的原型,一直沿着原型链向上查找,直到null。继承:通过原型链,一个对象可以继承另一个对象的属性和方法。原型链使得JavaScript的继承机制得以实现,提供了一个灵活的方式来共享方法和属性。

2024-12-19 11:22:22 266

原创 threejs 加载大模型有没有什么优化方案

简化模型几何体和优化纹理。使用LOD技术和延迟加载来按需加载模型。压缩模型和纹理,减少文件大小。利用GPU 加速和实例化渲染提高渲染效率。通过和分担计算任务。这些优化方案可以帮助你在加载和渲染大规模模型时提升性能,改善用户体验。

2024-12-19 10:45:32 863

原创 vue template 中 {{}} 为什么能够被执行

Vue 模板中的{{}}模板编译:Vue 会把模板编译成渲染函数,这些渲染函数能够执行 JavaScript 表达式并返回正确的结果。响应式系统:Vue 会在数据发生变化时,自动更新 DOM,确保{{}}中的数据始终是最新的。虚拟 DOM:Vue 使用虚拟 DOM 比较算法优化了 DOM 更新,确保只更新页面中发生变化的部分。通过这种机制,Vue 实现了高效的模板渲染和响应式更新,从而使得{{}}插值能够动态地执行和更新视图。

2024-12-19 10:09:09 911

原创 说说你对 css3 display:flex 弹性盒模型 的理解

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。CSS3 中的是一种强大的布局模式,被称为“弹性盒布局”或“Flexbox”。它允许我们通过一套简洁的规则,轻松地对网页元素进行对齐、排列和分布,不论这些元素的大小、排列方向如何。它主要解决了传统布局方法中遇到的一些问题,如元素对齐、间距分配以及自适应布局等。下面是对的一些关键概念和使用方法的详细介绍。

2024-12-19 10:07:11 1114

原创 数组方法 reduce 的使用场景

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。reduce是 JavaScript 中数组的一种高级方法,常用于将数组中的所有元素通过某种算法“归约”为单一的值。它可以用于实现聚合、转换、求和、连接、计数等多种操作。

2024-12-19 10:02:12 399

原创 前端本地数据存储方式有哪些

存储方式存储容量生命周期支持的数据类型特点Cookies4KB会话或设置过期时间简单的键值对用于跨请求存储小型数据,常用于身份认证5MB(浏览器差异)永久存储键值对(字符串)简单易用,数据永久存储5MB(浏览器差异)会话期间键值对(字符串)会话级别的存储,浏览器关闭时清空IndexedDB较大(数 MB 或更多)永久存储对象、数组、二进制数据支持复杂数据类型,异步操作Web SQL较大(不固定)永久存储结构化数据(SQL)被弃用,不推荐使用受限(特定环境)永久存储。

2024-12-19 09:56:05 1224

原创 call apply bind 区别

方法功能执行时机参数传递方式call调用函数并指定this,立即执行函数立即执行逐个传递参数apply调用函数并指定this,立即执行函数立即执行通过数组传递参数bind创建一个新的函数,指定this,可以预设参数不会立即执行,返回新函数返回新函数,后续调用时传参。

2024-12-19 09:53:11 306

原创 谈谈你对微任务和宏任务的了解

微任务:优先级高,先于宏任务执行,通常用于处理异步操作的回调(如Promise),在同一轮事件循环中执行完所有微任务后才执行宏任务。宏任务:包括用户事件、定时器、I/O 操作等,通常较为耗时。在一轮事件循环中,宏任务会执行一个,执行完后再执行所有的微任务。掌握微任务与宏任务的执行顺序是理解 JavaScript 异步编程、调试异步代码以及优化应用性能的基础。

2024-12-19 09:48:10 837

原创 vuex 和 pinia 区别

特性VuexPinia适用版本Vue 2 和 Vue 3Vue 3设计哲学为 Vue 2.x 提供解决方案为 Vue 3 提供原生支持API 复杂度较复杂,包含statemutationsactionsgetters简洁,基于定义 store响应式系统基于 Vue 2 响应式系统基于 Vue 3 的 Proxy 响应式系统TypeScript 支持支持,但不完美原生支持,类型推导更好插件系统支持插件,使用相对复杂插件支持更灵活,易集成热重载支持,但需要配置内置热重载支持状态持久化。

2024-12-19 09:41:07 790

原创 箭头函数是什么

箭头函数通过简洁的语法和特殊的this绑定行为提供了更方便的编程体验。它特别适用于一些回调函数、事件处理函数等场景,可以避免传统函数中this绑定的问题。

2024-12-18 16:17:10 402 1

原创 webScoke 在vue项目中如何全局挂载

如果你希望 WebSocket 实例可以在每个组件中都直接访问,建议使用Vue 插件的方式进行全局挂载,直接通过来访问。如果你更喜欢通过Vuex管理 WebSocket 实例,并且在多个组件之间共享 WebSocket 的状态和方法,那么可以使用 Vuex 的state和actions来管理 WebSocket。这两种方法都能满足在 Vue 项目中全局挂载 WebSocket 的需求,具体使用哪一种取决于你的项目架构和需求。

2024-12-18 14:24:28 500

原创 webScoke api 介绍

WebSocket API 允许浏览器和服务器之间建立一个持久的、双向的通信连接。WebSocket 连接一旦建立,数据可以在浏览器与服务器之间自由地流动,直到连接被关闭。全双工通信:WebSocket 提供双向的、实时的通信,服务器和客户端都可以随时发送消息。低延迟:与传统的 HTTP 请求-响应模型不同,WebSocket 的通信不需要每次都重新建立连接,从而减少了通信延迟。单一连接:WebSocket 使用单一的 TCP 连接来进行通信,这意味着可以节省带宽和计算资源。

2024-12-18 14:08:23 427

原创 如何实现 list 数据结构转 tree结构

将list数据转为tree结构的基本步骤是:首先建立一个表示节点的类,然后根据节点的父子关系来构建树。这个过程对于层级数据、组织结构等任务非常常见。

2024-12-18 14:05:54 477

原创 谈谈es6 Map 函数

键可以是任意类型Map的键可以是任何数据类型,包括对象、数组、函数等。插入顺序Map会保持键值对的插入顺序,可以通过.keys().values().entries()获取到有序的迭代结果。性能优势:相比于对象,Map在频繁的增删查改操作中通常表现得更好,因为Map是为存储键值对而优化的,而对象更多是为了属性访问而设计。大小和删除Map具有.size属性,可以随时查询元素的数量;并且可以通过.delete()删除单个元素,或者使用.clear()删除所有元素。更方便的 APIMap。

2024-12-18 14:02:19 849

原创 说说es6 promise async await 以及 promise A+规范的了解

Promise是 JavaScript 中用于处理异步操作的一种方式,它表示一个异步操作的最终完成(或失败)及其结果值的表示。Promise是 ES6 引入的,它通过链式调用来处理回调函数,避免了“回调地狱”的问题。async和await是 ES2017(ES8)引入的用于简化处理异步操作的语法糖。它们是基于Promise的,但使用起来更加简洁和直观。async:标记一个函数为异步函数,返回一个Promise对象。await:用于等待一个Promise对象的完成,await后面必须跟一个Promise。

2024-12-18 13:57:27 761

原创 vue 响应式数据原理

Vue 的响应式数据原理是通过(Vue 2)或Proxy(Vue 3)来实现的。这种机制通过劫持数据的 getter 和 setter,实现了视图和数据的双向绑定。当数据发生变化时,Vue 会通知所有依赖该数据的视图重新渲染,从而实现响应式更新。

2024-12-18 11:50:49 1661

原创 后台管理系统权限功能菜单和按钮权限如何实现的

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。在后台管理系统中,是一个关键的组成部分,涉及和两个方面。通过合理的权限控制,可以确保不同用户或角色只能访问和操作他们被授权的功能。以下是实现这些权限的详细思路和步骤。

2024-12-18 11:48:13 1736

原创 说说你在项目中封装的组件,以及如何封装的

高内聚,低耦合:组件应尽量独立,降低与业务代码的耦合度。可配置性:通过 Props 和事件提高组件的通用性。插槽支持:增强组件的灵活性。错误处理:提供清晰的错误提示和边界情况处理。通过合理的封装,可以大大提高开发效率,让代码更加清晰易维护。在实际项目中,可以根据具体业务需求抽象出组件,不断迭代优化。

2024-12-17 15:34:40 857 3

原创 vue 首屏加载过慢如何优化

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。对于纯静态页面,可以使用预渲染插件将页面提前渲染成 HTML 文件。开启 HTTP/2 协议,支持多路复用,加快资源加载速度。服务端渲染可以大幅加快首屏加载速度,解决首屏白屏问题。) 和业务代码分开打包,利用 CDN 加速加载。,只在需要时加载组件,减小首屏包体积。在首屏渲染前显示骨架屏,提升用户体验。:移动端适配时,使用低分辨率图片。:将路由对应的组件进行异步加载。:实现本地缓存,提高加载速度。只在图片进入视口时加载。

2024-12-17 15:29:29 1673

原创 说说你对canvas的理解

的标签元素,它允许开发者通过 JavaScript 在网页上绘制图形、动画、图表,甚至是进行图像处理。前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。中,所有绘制操作都需要通过 JavaScript 完成,并依赖于上下文(这意味着它绘制的图形是静态的,类似于一张位图图片。的方法,非常适合需要高度动态和交互性的场景。,可以通过属性或 CSS 修改大小。是 HTML5 提供的一种用于。提供了一种在浏览器中进行。) 和重新绘制图形,结合。,可以实现流畅的动画效果。

2024-12-17 15:21:15 550

原创 vue2,vue3 中 v-for 和v-if的优先级

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。在和中,v-for和v-if是两个常用的指令,但它们的有所不同。v-forv-if在 Vue 2 中,v-ifv-for,即v-if会先执行,只有当条件满足时,才会执行v-for循环。。

2024-12-17 15:17:20 512

原创 说一下你对pomise的理解

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。是 JavaScript 中用于处理的对象,它代表了一个尚未完成但未来会完成的操作,并提供了处理成功(resolve)或失败(reject)结果的方法。Promise 是对回调函数的一种优化,解决了问题,代码更清晰、易于管理。

2024-12-17 15:08:05 635

原创 说一下你对 webScoket的了解,以及有哪些API

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。是一种在全双工通信的协议,它在单个 TCP 连接上提供了的能力。WebSocket 克服了传统 HTTP 协议的缺陷,使客户端与服务器能够进行持续的通信,而不需要重复建立和关闭连接。WebSocket 通过来初始化连接,但一旦连接建立,就会升级为 WebSocket 协议。

2024-12-17 15:01:00 324

原创 解释一些防抖和节流以及如何实现

防抖指在事件触发后,等待一段时间再执行回调函数。如果在等待时间内事件再次触发,重新计时。

2024-12-17 14:57:37 652

原创 做一个防重复点击你有哪些方案

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。会在指定时间内,只执行最后一次点击事件,适用于用户连续快速点击的场景。:在异步操作中一定要确保重置状态,否则可能导致按钮无法再次点击。函数限制事件的执行频率,即在指定时间内按钮点击事件只触发一次。:要确保在操作结束后重新启用按钮,否则用户将无法再次操作。:需要服务端配合,适用于有严格数据一致性要求的场景。:防止短时间内的连续点击,只触发最后一次操作。:适用于不需要立即响应点击事件的场景。:适用于点击事件只需触发一次的场景。

2024-12-17 14:54:14 946

原创 内存泄漏的产生

是指程序中不再需要的内存未被释放,导致内存被持续占用,最终可能导致系统性能下降甚至程序崩溃。前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。如果闭包的引用长时间无法释放,或者意外引用了不需要的变量,就会导致内存泄漏。如果闭包不小心引用了全局变量,并且闭包一直存在,内存也无法释放。在循环中创建闭包时,错误地引用了外部变量,导致变量无法释放。中使用闭包时,如果忘记清除定时器,会导致内存泄漏。在不需要时手动清理引用,解除闭包对外部变量的依赖。当闭包不再需要时,手动将引用置为。

2024-12-17 14:50:04 632

原创 闭包是什么

当一个函数被创建时,它会保存对其所在执行上下文(作用域)的引用。即使外部函数执行结束,闭包中的变量依然存在于内存中,因为被闭包引用着。当一个内部函数被返回或赋值给外部变量时,它依然“记住”了定义时所处的外部作用域,从而形成闭包。前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。闭包(Closure)是编程中一个非常重要的概念,主要存在于。如上所示,闭包可以用来封装变量,防止外部直接访问。闭包可以实现柯里化,将一个函数拆分成多个函数调用。闭包可以保存函数执行结果,提高性能。

2024-12-17 14:44:40 317

原创 了解过.css 的优化吗?

CSS 优化是提升网站性能和用户体验的重要步骤,主要涉及减少加载时间、提高渲染速度和增强代码可维护性。提供更好的结构和功能,例如变量、函数、混合样式等,有助于提高代码的可维护性和减少冗余。HTTP/2 支持多路复用,允许多个 CSS 文件并行加载,不再需要合并 CSS 文件。将多个 CSS 文件合并成一个文件,减少 HTTP 请求次数,提高加载速度。将 CSS 文件托管到 CDN 上,提供更快的加载速度和缓存机制。避免过度嵌套和复杂的选择器,保持代码简洁,提高渲染性能。属性或异步加载的方式减少渲染阻塞。

2024-12-17 14:39:56 953

原创 BeautifulSoup 入门

是 Python 中一个强大的库,主要用于解析 HTML 和 XML 文档,提取数据。希望这篇文章帮助你快速掌握 BeautifulSoup 的基础用法,灵活地在 Python 中解析 HTML 文档!,通过代码示例详细解析 BeautifulSoup 的功能和用法,帮助初学者迅速入门。前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。可以获取标签的所有属性,也可以获取特定属性的值。将修改后的 HTML 保存到文件。你可以动态修改标签的内容或属性。你可以通过标签的属性(如。

2024-12-17 14:24:07 603

原创 pymysql 入门

PyMySQL是一个纯 Python 编写的 MySQL 客户端库,可以通过它轻松地在 Python 中连接并操作 MySQL 数据库。它兼容 MySQL 5.x 和 MariaDB,并且与 MySQL 官方提供的客户端接口(C API)兼容。PyMySQL 支持数据库连接、执行 SQL 查询、以及提取查询结果等功能。

2024-12-17 13:56:47 959

原创 sessionstorage cookie localstorage 区别

适合存储会话数据,仅在当前页面会话中有效,页面关闭会清除。:适合存储长期数据,浏览器关闭后依然有效,直到手动删除。cookie:适合存储服务器需要读取的数据,数据随每次请求发送到服务器,且容量较小。选择使用哪种存储方式,取决于具体的需求,例如数据的生命周期、存储大小、是否需要与服务器通信等。

2024-12-11 14:18:35 858 3

原创 谈谈你对vue这种框架理解

Vue 是一个现代的、灵活的前端框架,适用于从小型应用到大型企业级应用的开发。它提供了声明式的视图和响应式的数据绑定,支持组件化开发,并且拥有一个强大的生态系统。Vue 3 通过引入 Composition API、性能优化和更好的 TypeScript 支持,进一步提升了开发效率和应用性能。Vue 的简洁易用和灵活性使其在开发者中非常受欢迎,是当前最流行的前端框架之一。

2024-12-11 14:16:39 911

原创 项目第一次加载太慢优化

优化项目首次加载速度是一个综合性的工作,涉及到多个方面的技术和策略。通过合理的资源管理、缓存策略、异步加载、懒加载和现代化的网络协议等手段,可以显著提升页面的加载性能。通过不断测试和分析,找到并解决性能瓶颈,最终提升用户体验。

2024-12-11 14:13:05 876

Selenium 爬虫笔记

Selenium 爬虫笔记

2023-11-06

优快云评论区抽奖-东离糖宝

我自己写的

2023-09-11

爬取数据库中的img标签并判断数据访问的合法性

数据库连接信息已隐藏

2023-08-16

在java中操作redis博客源码

在java中操作redis博客源码

2023-07-16

ssh远程连接工具finalshell

ssh远程连接工具finalshell

2023-07-06

SSM快速入门案例教程博客的源码-东离与糖宝

SSM快速入门案例教程博客的源码-东离与糖宝

2023-06-19

springboot系列教程博客的源码-东离与糖宝

springboot系列教程博客的源码-东离与糖宝

2023-06-08

springmvc系列教程博客的源码-东离与糖宝

springmvc系列教程博客的源码-东离与糖宝

2023-05-30

spring系列教程博客源码-东离与糖宝

spring系列教程博客源码

2023-05-21

mybatis系列教程博客的源码-东离与糖宝

mybatis系列教程博客的源码-东离与糖宝

2023-05-18

mybatis plus系列教程博客参考源码-东离与糖宝

mybatis plus系列教程博客参考源码-东离与糖宝

2023-05-06

空空如也

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

TA关注的人

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