guokanglun-CSDN博客

原创 JavaScript 数组some 和 find

some和find是 JavaScript 中常用的数组方法，它们的用途和功能各不相同。

2024-12-26 11:22:27 520 1

JavaScript 中的链式操作是一种编程风格，允许开发者通过连续调用方法来简化代码和提高可读性。这种方式特别适用于操作对象或数据流的场景，比如操作数组、处理 DOM 元素、以及使用 Promise 或库（如 jQuery 和 Lodash）。链式操作的关键是每个方法调用后返回一个对象本身或支持进一步调用的方法的对象。常见的链式操作场景1. 数组方法链式调用JavaScript 提供了多个数组方法，支持链式操作：2. jQuery 链式操作jQuery 是链式操作的经典示例：3. Promi

2024-12-19 14:20:22 347

原创数据库触发器使用

是一种由数据库中的特定事件自动触发执行的存储程序。触发器通常用于自动化某些操作，以保持数据一致性、实施业务规则或记录更改日志。它是数据库管理系统（DBMS）中强大的工具之一。触发器是数据库操作自动化的重要工具，但在设计时应权衡性能和可维护性，避免滥用。

2024-12-18 16:43:33 316

原创 vue常用的一些指令整理

在 Vue.js 中，指令（Directives）是特殊的 HTML 属性，用于在模板中绑定行为。Vue 提供了许多内置指令，你也可以定义自定义指令。防止未编译内容闪烁，用于保持元素隐藏，直到 Vue 实例准备完毕。Vue 支持创建自定义指令，用于处理复杂的 DOM 操作。通过 Vue 的指令，你可以轻松实现模板与数据的高效绑定。条件渲染，根据表达式的值动态添加或移除 DOM。修饰符是以点开头的后缀，用于修改指令的行为。一次性绑定，渲染后不会更新。用于双向绑定表单元素的值。用于动态绑定属性或特性。

2024-12-17 17:27:43 425

原创 margin-left: auto 在Flexbox里的作用

是一个常用的 CSS 属性组合，它在 Flexbox 中（甚至其他布局模型中）具有非常实用的功能，尤其在处理对齐问题时。

2024-12-12 16:02:49 618

原创 Cesium笛卡尔坐标

在中，（Cartesian Coordinates）指的是一个三维坐标系统，通常使用坐标表示。这种坐标系统是基于地球的中心（地心）来定义位置的，在 Cesium 中，它通常用于表示点在地球上的位置。笛卡尔坐标系也可以用于从不同的坐标系统之间进行转换，例如从地理坐标（经度、纬度、高度）转换为笛卡尔坐标。

2024-12-06 14:59:59 698 2

原创 cesium 屏幕坐标和经纬度互转

【代码】cesium 屏幕坐标和经纬度互转。

2024-12-06 14:47:33 554

原创 JavaScript回调函数

回调函数是将一个函数作为参数传递给另一个函数的方式，常用于异步编程。在 JavaScript 中，回调函数通常用于事件处理、异步操作和定时器。回调地狱是回调函数嵌套过深导致代码难以维护的现象，现代 JavaScript 通过Promise和可以更好地处理异步操作，避免回调地狱。

2024-12-06 11:14:35 399

原创 JavaScript动画函数requestAnimationFrame

是一个 JavaScript 中用于优化动画的高效方法。它告诉浏览器希望执行一个动画，并在下一次重绘之前调用指定的回调函数来更新动画。这种方式能够更好地协调动画更新和屏幕刷新率，从而提高性能和流畅度。是开发高性能动画的首选方法！如果需要停止动画，可以使用。

2024-12-05 09:31:30 399 2

原创 JavaScript 键盘控制移动

如果你想通过 JavaScript 实现键盘控制对象（比如一个方块）的移动，下面是一个简单的示例，展示如何监听键盘事件并根据按下的键来移动一个元素。

2024-12-04 14:50:55 839

原创 JavaScript实现圆周运动效果

在 JavaScript 中，可以通过 requestAnimationFrame和数学公式来实现圆周运动效果。

2024-12-04 11:42:56 363

原创 css实现圆周运动效果

在CSS中可以通过 @keyframes和 transform属性实现元素的圆周运动。

2024-12-04 11:02:19 667

原创 vue结合canvas动态生成水印效果

使用 Canvas 动态生成水印，并将其作为背景图应用。以上方法可以根据需求选择适合的方式实现水印效果。如果需要复用，可以封装一个通用的水印组件。直接通过 CSS 的。

2024-12-03 16:48:49 835

原创 vue key属性强制刷新组件

在 Vue 中，key属性通常用来帮助 Vue 跟踪每个组件或元素的身份，尤其是在使用v-for渲染列表时。当key值发生变化时，Vue 会销毁并重新渲染组件，这也可以用于强制刷新组件。如果你想强制刷新一个组件，可以通过动态更改该组件的key来实现。每当key的值改变时，Vue 会销毁并重新创建该组件，从而实现刷新效果。

2024-12-03 14:52:04 862

原创 Cesium绘制广告牌闪烁效果

在 Cesium 中绘制一个闪烁的广告牌，可以通过动态修改广告牌的透明度或颜色来实现。这需要结合 Cesium 的动画功能，通常是利用或者 Cesium 的方法来不断更新广告牌的属性。

2024-12-03 14:22:11 567

原创 web - JavaScript字面量和变量的存储位置及使用性能对比

字面量：通常是直接嵌入代码中的值（如字符串、数字、数组、对象等），内存位置可能会优化和缓存，尤其是原始类型（如字符串、数字）。但是每次创建字面量时，都会分配新的内存（特别是对于对象和数组字面量）。变量：用于存储值的容器。原始类型的变量值直接存储在栈中，引用类型则存储在堆中，并且变量只是引用这些对象的地址。对于对象和数组，多个变量可以共享相同的引用，而不是复制值。在性能方面，使用字面量可以减少代码的复杂度，但不当使用（如频繁创建新的对象字面量）可能导致内存浪费和性能下降。而变量。

2024-12-02 17:04:32 859

原创 vue2组件跨层级数据共享provide 和 inject

provide：在父组件中定义共享的数据。inject：在子组件中接收父组件提供的数据。默认情况下，数据是非响应式的。如果需要响应式，应该在data()中定义数据。provide和inject适合处理不需要通过props或emit逐层传递的跨层级数据共享。

2024-12-02 14:41:10 1401

原创 vue3组件跨层级数据共享provide 和 inject

provide和inject提供了一种简单的方式在 Vue 组件树中实现跨层级数据共享。它们避免了props和事件的逐层传递，适合管理全局状态或共享逻辑。对于复杂的场景，Vue 提供的Pinia或Vuex可能是更好的选择。

2024-12-02 14:40:33 800

原创 vue开发中v-for和v-if一起使用

在 Vue.js 中，v-for和v-if是常用的指令，但将它们一起使用时需要注意，因为可能会引起性能和逻辑上的问题。

2024-12-02 11:23:14 519

原创 Vue 3 的双向绑定原理

响应式系统（Proxy + Dependency Tracking）来追踪数据变化。v-model指令来实现父子组件间的数据同步。事件触发和数据更新（通过）实现父子数据的双向绑定。这种方式相比于 Vue 2 中的和data方式，Vue 3 的响应式系统更加高效且易于扩展。

2024-11-29 16:55:58 1460

原创 Vue如何加载十万条数据

加载十万条数据需要结合前端和后端的优化。分页加载：按需加载数据，每次只渲染一部分。虚拟滚动：仅渲染当前视口中的数据，减少 DOM 节点数。懒加载与后端分页：通过与后端协作，避免一次性加载所有数据。Web Worker：将计算密集型任务交给后台线程，避免主线程阻塞。这些方法可以单独使用，也可以根据需求组合使用，从而在不影响用户体验的前提下，加载并展示大量数据。

2024-11-29 14:15:08 748

原创 axios请求拦截器和响应拦截器

请求拦截器：用于请求发出之前的处理（比如添加认证信息、修改请求头等）。响应拦截器：用于处理响应数据，通常用来做统一的错误处理或者数据格式的转换。通过拦截器，能够方便地实现全局的错误捕获和请求/响应的统一处理，提升代码的复用性和可维护性。

2024-11-29 13:58:49 529 2

原创 Vue 开发中为什么要使用穿透符::deep()

这样，你可以在父组件中应用样式来影响子组件的样式，尤其是当你无法直接修改子组件代码时。是一个 Vue 3 中的特殊选择器，用来进行样式穿透，能够影响嵌套的子组件样式。可以穿透作用域样式，但它仍然会影响到子组件的样式，因此可能会导致子组件的样式被外部影响，破坏组件的封装性。在实际开发中，优先考虑保持组件样式隔离，避免直接修改子组件样式，以提高组件的可维护性和独立性。）的方式，为每个组件的 DOM 节点加上标记，从而实现样式的作用域隔离。元素上，即使它是在子组件中定义的，也能被父组件的样式影响。

2024-11-28 16:48:35 942 6

原创 vue多页面应用集成时权限处理问题

在多页面应用（MPA）中，权限管理通常会涉及到每个页面的访问控制、身份验证、以及权限校验。

2024-11-28 11:52:55 948

原创 Vue单页面应用和多页面应用

单页面应用是一种应用架构，在这种架构中，整个应用只会加载一个 HTML 文件，并且所有的页面内容都是在这个页面内通过动态更新的方式渲染出来的。当用户与应用交互时，只有页面的部分内容会更新，而不需要重新加载整个页面。多页面应用是指一个包含多个独立页面的网站，每个页面通常都是一个独立的 HTML 文件，用户访问不同页面时，浏览器会重新加载不同的 HTML 文件，且每个页面通常会有自己的路由和业务逻辑。特点单页面应用 (SPA)多页面应用 (MPA)页面刷新无需完全刷新，局部更新每个页面都独立刷新路由管理。

2024-11-28 11:27:48 1440

原创 JavaScript原生深拷贝方法 structuredClone使用

是现代浏览器提供的原生 JavaScript 方法，用于深拷贝对象。它可以处理各种复杂数据结构，包括嵌套对象、数组、Date、Map、Set 等，且支持循环引用。是深拷贝对象和数据结构的最佳原生解决方案之一。对于现代开发者来说，它是一个便捷且性能优越的工具，尤其是在处理复杂对象和循环引用时。

2024-11-28 10:08:20 509

原创 JavaScript深拷贝和浅拷贝

浅拷贝适用场景：仅需要复制对象的第一层，不需要处理嵌套结构。深拷贝适用场景：对象结构复杂，需要独立修改嵌套属性。根据实际需求选择适合的拷贝方式，复杂场景建议使用可靠的工具如 Lodash 或。

2024-11-28 09:58:40 961

原创 JavaScript处理原始二进制数据-Blob对象

是 JavaScript 中的一个核心对象，用于处理原始二进制数据。它常用于在浏览器中生成文件，处理下载或上传文件的场景。如果你有一个文件或图片 URL，可以通过。对象，可以实现文件上传前的预览功能。对象可以合并为一个新的。

2024-11-27 16:44:19 1012

原创 JavaScript开发中forEach循环和for循环性能问题

在 JavaScript 中，forEach和传统的for循环都可以用来遍历数组，但它们在性能和使用场景上有一定的差异。

2024-11-26 16:54:53 802

原创 windows系统 win10调整图片大小的几种方式

Windows 10 自带的 Paint 也可以用来修改图片大小。Windows 10 默认安装了“照片”应用，你可以通过它轻松地调整图片大小。如果你需要更多的功能或更高精度的控制，可以使用第三方图像编辑工具。如果你只想改变图片的比例或进行裁剪，可以使用“照片”应用的裁剪工具。如果你不想安装任何软件，还可以使用在线工具来调整图片大小。都是非常强大的图像编辑工具，适用于更复杂的图像大小调整。你只需上传图片，选择调整大小的方式，下载修改后的图片即可。你可以根据自己的需要选择不同的方法来调整图片大小。

2024-11-26 16:15:15 3657

原创自动化的内存管理技术之垃圾回收机制-JavaScript引用数据内存回收机制

是一种自动化的内存管理技术，用于回收程序中不再使用的内存空间，避免内存泄漏。JavaScript（尤其是 V8 引擎）使用了一些经典的垃圾回收算法，如和。这是最基础、最常用的垃圾回收算法。

2024-11-25 17:18:29 774

原创 JavaScript中关于内存管理的两个重要的概念堆（Heap）和栈（Stack）

在 JavaScript 中，（Heap）和（Stack）是内存管理中两个重要的概念。是一种后进先出（LIFO，Last In First Out）的数据结构，通常用于存储临时数据以及函数调用相关的信息。

2024-11-25 17:05:29 540

原创 Vue 3 Diff 算法流程及实现

Vue 3 的 Diff 算法通过静态标记优化双端比较和LIS 优化，极大地提升了运行时性能，减少了不必要的 DOM 操作。这种设计在实际开发中能够很好地适应各种动态场景，同时保持高效性。

2024-11-25 16:05:07 442

原创 web开发中浏览器的重排与重绘

优化 Web 性能时，优先减少重排，因为它对性能的影响更大。通过优化 DOM 操作、样式修改和动画策略，可以有效提升页面的渲染效率和用户体验。重排是指当网页布局或几何属性发生变化时，浏览器需要重新计算元素的位置和大小，并对整个页面或部分页面进行布局更新的过程。是浏览器在渲染网页时涉及的两个重要过程，它们直接影响网页性能。重绘的性能开销比重排小得多，因为它不会涉及布局的重新计算。重排是一个代价昂贵的操作，因为它可能影响整个页面的布局。重绘是指当元素的样式改变但不影响其布局时，浏览器重新绘制元素的外观。

2024-11-25 11:42:21 604

原创 Vue3核心技术之虚拟DOM

Vue 3 的虚拟 DOM 在保留 Vue 2 优点的基础上，进一步优化了性能和灵活性。通过静态提升、双端 diff 算法、Fragment 支持等增强，Vue 3 的虚拟 DOM 能够更加高效地处理复杂的 UI 更新任务，是其现代化前端框架性能的重要保障。在 Vue 3 中，**虚拟 DOM（Virtual DOM）**是核心技术之一，它通过在内存中创建轻量级的 DOM 表示，优化了 UI 渲染的性能。它的作用是将 UI 的状态与 DOM 的操作解耦，避免频繁的真实 DOM 操作，从而提升性能。

2024-11-25 11:26:37 906

空空如也

空空如也