- 博客(107)
- 资源 (3)
- 收藏
- 关注

原创 echarts 图表大小随窗口变动而自适应变动(无需刷新浏览器调整)
现象:相信很多童鞋在应用echarts进行统计图制作时候会遇到这样的问题,进入渲染页面统计图比例显示ok,但是当主动调整浏览器大小时候,统计图比例并没有随窗口大小改变而自动调整到最佳视觉效果,比如下图,缩小窗口就会出现溢出的情况这也是个奇葩的需求,但既然产品指出这个问题的存在,开发只能想办法去解决。造成原因:echarts的图表实例事实上并没有主动的去绑定resize()事件,就是说显示区域大小发...
2018-05-26 12:36:03
58160
31
原创 面条式代码解析
面条式代码”(英文叫)是指那种结构混乱、逻辑纠缠、可读性差、难以维护和扩展的代码。就像一盘乱七八糟的面条一样,一头拉动牵扯一大片,让人很难理清头绪。常见特征包括:各种变量乱用,全局变量横飞函数特别长,一个函数几百上千行代码里充满 if/else、switch、goto(如果是老代码的话)没有清晰的模块划分或职责分离改动一个地方容易牵连一大堆地方,极容易出 bug一开始还能跟着逻辑走,过一阵子代码多了,维护的人一看到就头大。一般来说,是因为:项目一开始没设计清楚,边写边改。
2025-04-27 13:40:25
325
原创 Babel、core-js、Loader之间的关系和作用全解析
BabelLoader(比如babel-loader)负责转译代码负责让webpack认识文件并交给babel处理是编译器是中间桥梁写新语法的JS代码(ES6+)webpack根据配置遇到.js文件,交给babel-loader处理babel-loader 调用 BabelBabel根据 preset-env 规则:转译新语法按需引用 core-js 提供的新API polyfill转译后的老版JS交给webpack继续打包输出兼容的JS文件,能在各种浏览器环境正常运行。
2025-04-27 13:24:08
952
原创 babel和loader的关系
BabelLoader (比如babel-loader)真正负责转代码负责让webpack认识这些代码、并交给babel处理是个编译器是个桥梁、插件。
2025-04-27 13:12:52
337
原创 vue3数据响应式丢失的情况有哪些
在中,响应式系统使用的是Proxy实现,相比 Vue 2 提升很大,很多 Vue 2 中的数据响应式陷阱都被解决了(比如数组索引、新增属性等),但依然存在一些可能导致“响应式丢失”的情况。
2025-04-21 14:45:08
367
原创 vue 中 mixin 和 composable 对比
Vue 3 不再推荐mixins,而是鼓励用组合式 API(setup())+ 可组合函数(composables)来实现逻辑复用。
2025-04-21 14:06:51
426
原创 gis地图原理解析
GIS(地理信息系统,Geographic Information System)是一种用于采集、存储、管理、分析、展示与地理空间相关的数据的技术系统。它结合了地图与数据库的能力,广泛应用于城市规划、资源管理、导航、应急响应等领域。
2025-04-16 09:57:03
363
原创 vue3的teleport和suspense是什么
功能<teleport><suspense>用途改变 DOM 挂载位置异步加载时的占位使用场景弹窗、浮层等脱离父级布局的内容异步组件、懒加载、SSR是否影响逻辑结构❌(仅改变渲染位置)✅(控制渲染时机)
2025-04-16 09:36:46
203
原创 离线缓存实现方案
离线缓存保障业务连续性”,可以理解为:在网络较差甚至无网的情况下,系统依然可以运行核心功能、保存数据,等网络恢复后再同步。这个功能在实际开发中很实用,尤其是针对销售、巡检、物流等场景。
2025-04-07 10:36:41
465
转载 怎么用vue开发鸿蒙应用
通过以上步骤,你可以使用Vue成功开发一个鸿蒙应用。从安装开发环境、创建Vue项目、配置鸿蒙桥接、开发应用界面、到调试和部署,每一步都需要仔细操作和调整,特别是配置鸿蒙桥接这一关键步骤。希望这篇详细的指南能够帮助你顺利完成鸿蒙应用的开发。相关问答FAQs:1. Vue可以用来开发鸿蒙应用吗?是的,Vue可以用来开发鸿蒙应用。鸿蒙应用框架支持使用Vue进行开发,通过使用Vue的组件化和响应式特性,可以更加高效地构建鸿蒙应用。2. 鸿蒙应用开发需要掌握Vue的哪些知识?
2025-03-27 15:23:28
116
原创 vue子组件生命周期的执行顺序
在 Vue 中,子组件的生命周期钩子函数的执行顺序受父组件的影响,通常遵循**“先创建子组件,后创建父组件;先销毁父组件,后销毁子组件”**的原则。钩子里可能需要访问子组件的 DOM 或数据时,需要注意时机。这个顺序对于组件通信、数据流管理等很重要,尤其在。),但此时模板还未编译,子组件还未初始化。,然后子组件挂载到 DOM,触发。(即先销毁子组件,再销毁父组件)。可能也受影响,因此进入。,但执行顺序逻辑仍然一样。,于是开始初始化子组件。子组件完成更新后,执行。如果你是用 Vue 3,
2025-03-27 15:03:17
386
原创 浏览器的垃圾回收机制
垃圾回收的核心任务是发现和清除不再使用的内存。目前主流浏览器(如Chrome、Firefox、Edge)通常采用**标记-清除(Mark-Sweep)**算法为主,辅以其他优化算法。
2025-03-19 12:59:22
812
原创 箭头函数为什么没有自己的this
是因为箭头函数在设计时就是为了简化函数表达式和处理上下文绑定问题。始终指向它定义时所在的作用域,而不是调用时的作用域。或用作构造函数,那就不要用箭头函数,而是用普通函数。箭头函数(Arrow Function)没有自己的。,这使得它在回调和嵌套函数中表现得更加直观和方便。,它会继承外层(即词法作用域)上下文的。换句话说,箭头函数内部的。箭头函数不创建自己的。,而是继承外层作用域的。如果有场景需要动态绑定。
2025-03-19 10:43:26
294
原创 null和undefined的区别
在 JavaScript 中, 和 都表示“没有值”或“值不存在”,但它们有一些重要区别: :通常是有意将变量赋值为空,以表示“没有对象”或“值为空”。 4. 比较不同 :返回 ,因为它们在非严格比较时被认为是相等的。 :返回 ,因为类型不同。5. 常见用途 :表示未初始化的变量、未定义的属性或函数没有返回值。 :表示对象为空、手动清除对象引用或赋值为空。示例对比总结 是 JavaScript 自动赋值的,表示“未定义”或“缺失”
2025-03-19 10:42:02
368
原创 图片懒加载原理
图片懒加载(Lazy Loading)是一种优化网页性能的技术,旨在减少页面初始加载时间和带宽消耗。它的原理是在页面初始加载时不立即加载所有图片,而是等图片即将出现在用户视口(可见区域)时才进行加载。:初始时,给图片设置占位符(通常是一个低分辨率图片、透明占位图或空标签),避免布局抖动。:通过 JavaScript 和滚动事件或。:使用原生 JavaScript 的。属性可以是一个占位图片或为空。,提供更多特性和兼容性支持。)来检测图片是否进入视口。属性(现代浏览器支持)。:当图片进入视口时,将。
2025-03-14 11:34:48
383
原创 webpack的构建流程是什么?loader和plugin的区别是什么?
通过模块化的方式将多个文件打包成一个或多个文件。Webpack 的强大之处在于其灵活性和插件机制。希望这份讲解能帮助你彻底理解 Webpack 的构建流程和 Loader、Plugin 的区别!Webpack 是现代前端项目的。字段指定多个入口点,并在。,Plugin 负责。
2025-03-14 11:13:24
871
原创 async/await相较于promise的优势是什么,性能有哪些差异?
在异步操作中,async/await 和 Promise 都是常用的处理方式,但它们在代码可读性、错误处理和性能上存在一定差异
2025-03-14 10:21:35
755
原创 prototype和proto的区别
都与原型链和继承机制有关,但它们的含义和作用是不同的。下面来详细讲解它们的区别。在 JavaScript 中,prototype。希望这些讲解能帮你彻底搞清楚 prototype。和 __proto__和 __proto__在 ES6 中,使用。
2025-03-14 10:11:18
431
原创 position定位-sticky详细讲解
是 CSS3 引入的一种定位方式,结合了 relative和 fixed的特性。它可以在元素时自动变为固定定位,非常适合实现。
2025-03-14 10:10:32
677
原创 css3有哪些新属性
CSS3 引入了大量增强页面布局和视觉效果的新特性,尤其是在响应式布局、动画效果和视觉美化方面有了很大提升。作为前端开发者,掌握这些特性可以让页面效果更加生动和现代化。
2025-03-14 10:08:29
668
原创 promise和settimeout的区别,谈一谈eventloop
都用于处理异步操作,但它们在机制和执行顺序上有很大区别。要理解它们的区别,必须先了解。的,使用**事件循环(Event Loop)**来处理异步任务。微任务比宏任务优先级高,Promise 回调属于微任务队列。如果有更多问题,随时来问哦~ 😊。宏任务在所有微任务执行完成后才会执行。希望这些讲解能帮助你彻底理解。如何保证异步操作的顺序执行?和 setTimeout。JavaScript 是。在轮询操作中,可以结合。如何控制异步任务顺序?虽然 Promise。
2025-03-14 10:06:46
305
原创 js面向对象
JavaScript 的面向对象编程(OOP)是一种通过创建对象来组织和封装代码的方法。JavaScript 不是传统的类式面向对象语言,但它也支持面向对象的特性,例如封装、继承和多态。
2025-02-24 09:21:16
314
原创 DOM 与 BOM 的区别
DOM专注于网页内容和结构,通过 JavaScript 操作 HTML 元素。BOM专注于浏览器本身的操作,提供对浏览器窗口、地址栏、历史记录等功能的访问接口。这两者通常是一起使用的,构成了前端开发中的基本操作环境。
2025-02-21 10:27:09
485
原创 Tree Shaking
Tree Shaking 是通过静态分析 JavaScript 的模块化代码来去除未使用的部分,从而减小代码体积。它依赖于 ES6 模块化语法,使用合适的打包工具和配置,能够显著优化项目的性能,减少无用代码的冗余。要确保 Tree Shaking 的最大效果,代码应避免副作用并遵循 ES6 模块化规范。
2025-02-21 10:19:38
696
原创 vue2和vue3的主要区别
总的来说,Vue 3 在架构上进行了许多重大的改进,带来了更好的性能、易用性和灵活性,而 Vue 2 则更注重简单易用和快速上手。如果项目是新的,建议使用 Vue 3。如果是老项目,虽然 Vue 2 依然能满足需求,但也可以考虑逐步迁移到 Vue 3。Vue 2 和 Vue 3 之间有几个主要区别,涉及到性能、功能和架构上的改进。
2025-02-21 10:15:39
517
原创 Webpack打包优化
Webpack 打包优化代码分割(splitChunks)Tree Shaking(去除未使用代码)压缩代码(TerserPlugin)启用缓存优化图片、CSS 和资源使用动态导入和懒加载合理配置entry和mode这些优化方法不仅能有效提高构建性能,还能减小最终的打包文件体积,从而提升页面加载速度和用户体验。在实际开发中,选择合适的优化策略根据项目规模和需求进行配置是至关重要的。
2025-02-21 10:01:03
1020
原创 前端工程化
前端工程化通过引入模块化、自动化、持续集成等一系列技术手段,帮助开发者提升工作效率、代码质量和应用性能。通过合理配置构建工具、代码质量检测工具、测试工具等,前端工程化能够有效地应对日益复杂的项目需求,推动前端开发的现代化。
2025-02-21 09:39:01
810
原创 缓存策略的设计
缓存策略的设计需要根据不同资源的特性和业务需求来定制。通过合理配置缓存,既能提升性能,又能减少资源的浪费,保证内容的新鲜度和一致性。
2025-02-21 09:31:25
932
原创 浏览器的缓存机制
浏览器的缓存机制是用来提升页面加载速度、减少服务器压力的一个重要技术。它通过存储网页中的资源(如HTML、CSS、JavaScript、图片等)到本地缓存,当你再次访问相同的页面时,浏览器可以直接从本地缓存中加载资源,而不需要重新从服务器获取。
2025-02-20 15:35:08
327
原创 vue计算属性与侦听器的区别
特性计算属性(Computed)侦听器(Watch)用途用于基于已有数据进行计算并返回结果。用于监听数据变化并执行副作用。缓存有缓存:只有相关依赖的数据变化时,计算属性才会重新计算。无缓存:每次数据变化时都会触发回调。返回值必须返回一个计算后的值。没有返回值,执行副作用(如异步请求)。适用场景用于派生状态,如组合多个数据属性生成新的值。用于处理副作用,如异步请求或数据更新。性能因为有缓存,性能较优,适合频繁使用的计算。没有缓存,适合处理异步操作和副作用。
2025-02-20 15:25:56
509
原创 Vue的响应式原理
Vue 的响应式原理是通过 getter 和 setter 来实现的,它利用了 JavaScript 中的 Object.defineProperty(Vue 2.x)或 Proxy(Vue 3.x)来监听对象属性的变化,并在数据变化时自动更新视图。
2025-02-20 15:09:57
349
原创 Git报错:remote: HTTP Basic: Access denied的解决方法 mac
remote: HTTP Basic: Access denied fatal: Authentication failed for '****‘
2023-03-13 11:33:28
1700
排序思维导图整理,插入排序、希尔排序、冒泡排序、选择排序、快速排序、堆排序、归并排序、基数排序
2022-06-12
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人