- 博客(29)
- 收藏
- 关注
RSS订阅原创 JavaScript 实用函数大全（超实用）
JavaScript实用工具函数集锦 本文整理了一系列实用的JavaScript工具函数，主要包含： 类型判断：包括基本类型、结构类型、特殊对象和DOM环境判断 数字处理：随机数生成、格式化、范围判断、进制转换等 数组操作：去重（支持简单值和对象数组）、扁平化处理、频率统计等 这些函数覆盖了常见开发场景，如： 精确的类型检测（如区分对象与数组） 数字格式化（千分位、百分比） 数组深度扁平化和基于key的去重 随机数生成（整数/浮点数）和范围控制 代码简洁高效，可直接用于项目中，提升开发效率。
2025-07-04 10:52:03
770
原创 图像滑块对比功能的开发记录
最近，公司需要开发一款在线图像压缩工具，其中的一个关键功能是让用户直观地比较压缩前后的图像效果。因此，我们设计了一个对比组件，它允许用户通过拖动滑块，动态调整两张图像的显示区域，从而清晰地看到压缩前后的差异。这个滑块对比组件利用 clip-path 来裁剪图像，并结合鼠标和触摸事件监听，实现了流畅的交互体验。它不仅适用于图像压缩前后的对比，还可以扩展到滤镜效果、照片修复等其他图像对比场景。在实际开发中，我们可以根据 UI 需求，进一步优化滑块的样式、动画效果，以及提升移动端的操作体验。
2025-03-06 11:28:00
1185
原创 启动node服务时报错：node:events:491 throw er； // Unhandle
如果问题依然存在，请确认是否有其它后台进程或开发工具（比如 VS Code 的调试器）在无意中占用了这个端口。这个错误提示说明你的 Node 服务在尝试监听 127.0.0.1:4567 时，该端口已经被其他进程占用了。在 Node.js 中可以监听 ‘error’ 事件，避免未捕获的错误导致服务异常退出，并在错误发生时给出更友好的提示。如果不想杀掉现有进程，也可以修改你的应用配置，换用一个未被占用的端口，例如改为 4568 或其他端口。这样可以找到进程的 PID（进程号, 也就是示例的。
2025-02-20 11:12:04
529
原创 盘点9大前端图像处理库，建议收藏备用
在Web开发中，图像处理是提升用户体验的关键环节之一。无论是图片压缩、滤镜应用，还是动态合成，选择合适的库能大幅提高开发效率。本文精选了9个功能强大且广泛使用的JavaScript图像处理库，涵盖从基础操作到高级编辑的全场景需求，并附上详细对比和访问地址。
2025-02-16 18:11:55
1316
原创 图片格式全景解析：从位图到矢量，从压缩性到应用场景
在前端开发和设计中，图片不仅是美观展示的载体，更是性能优化和用户体验的重要因素。JPEG 适合复杂、色彩丰富的照片，但需注意压缩损失；PNG 是 UI 元素、图标的首选，保证透明效果和无损展示；GIF 则在简单动画场景中依然有它的一席之地；SVG 的无限缩放和灵活性使其成为响应式设计的宠儿；WebP 与 AVIF 代表了图片格式的未来，它们在保证图像质量的同时显著减小文件体积，为优化网站性能提供了新途径。
2025-02-13 11:05:11
1250
原创 在Koa中如何限制请求频率？
和都可以实现限流。根据需求，你可以选择内存存储或 Redis 存储进行限流，具体取决于你的部署架构（单个实例或负载均衡下的多实例）。可以根据业务需要调整请求频率、时间周期和限流规则。
2024-09-22 11:09:21
644
原创 不得不了解的几现代化CSS属性
到这里，我们已经深入探讨了几个 CSS 的新特性。这些现代 CSS 属性为前端开发者提供了很多强大的工具。希望这篇文章能帮助大家更好地理解这些新功能，并在实际项目中熟练运用它们，创造出更美观、更用户友好的网页。
2024-09-18 22:18:02
1215
原创 nvm - 一个 Node.js 版本管理工具
nvm 是一个必备的 Node.js 版本管理工具，专为开发者设计，能轻松管理和切换多个 Node.js 版本。通过这篇文章，你将学会如何安装和使用 nvm，以满足项目对不同版本的需求。不论是安装、切换、查看还是卸载 Node.js 版本，nvm 都提供了简洁而高效的命令，帮助你顺利完成这些操作。
2024-07-15 22:59:47
647
原创 IntersectionObserver API 手把手教学
回调函数在目标元素的可见性变化时被调用。它接收两个参数：entries 和 observer。console.log('目标元素进入视窗');// 在此处理进入视窗后的逻辑} else {console.log('目标元素离开视窗');// 在此处理离开视窗后的逻辑});
2024-07-15 15:28:25
1184
原创 Vue中 ＜keep-alive＞ 组件的使用详解
keep-alive是一个内置的高阶组件，用于缓存动态组件。它能够保持不活动组件的状态，避免重新渲染这些组件，从而显著提升应用性能，尤其是在组件之间频繁切换的场景下。接下来将详细介绍keep-alive的使用方法和最佳实践。
2024-07-15 10:53:05
427
原创 如何将内容插入到输入框光标所在位置
我现在想将表情弹窗中的emoji或颜文字插入到当前光标所在位置该怎么办呢？我们可以使用 JavaScript 操作字符串的方式，将文本插入到指定的光标位置，接下来请看实际操作。
2024-04-23 21:28:45
539
原创 快速删除node_modules的方法
项目依赖太多包，node_modules 文件众多，window 删除超慢？来看看这些相对快速的删除方法吧！
2024-04-20 12:12:23
5005
1
原创 深入了解 CSS 逻辑选择器：is、where、not、has
CSS 逻辑选择器是 CSS Selectors Level 4 中引入的新特性，它们为我们提供了更灵活和强大的选择器语法，从而使得样式表的编写更加高效和简洁。本文将重点探讨 is、where、not、has 这四种逻辑选择器，深入剖析其应用、优缺点以及浏览器支持情况。
2024-04-20 12:11:18
822
原创 最舒服的Vite按需引入Element-Plus
采用按需导入的方法，其实是用解构的方式，从element的包中解构出来，再挂载到Vue上。这样开发中用到什么组件就打包什么确实很好，减少了包的体积。但是又有一个新的问题，就是每次想要使用新的组件的时候，都要去解构一下，并且挂载。下载安装element plus后，在入口文件配置一下并挂载，就能畅通无阻的使用了。但问题是这样有很多用不上的组件都被打包进来了，导致包的体积非常大。完成以上步骤就不需要去配置main.js了，插件会自动挂载处理。
2024-04-19 21:47:08
686
1
原创 面试宝典之HTML
data-属性是HTML5中引入的一种自定义数据属性的方法，允许开发者在标签上存储额外的信息，这些信息可以通过JavaScript访问。
2024-04-19 21:46:00
1268
原创 仿微信的IM聊天时间显示格式
即时通讯（IM）应用中，对于聊天消息时间的呈现已经成为一项非常普遍的需求。在当前注重用户体验的时代，我们不再局限于传统软件中简单粗暴地采用“年/月/日 时:分:秒”的时间格式。相反，几乎所有的IM应用都在处理聊天消息时间显示时，采取了更为人性化的设计，从而提升用户体验，使其更加友好。这种人性化处理包括更加直观和易读的时间格式，例如：刚刚：表示消息是在几秒钟之前发送的。今天：表示消息是在当天发送的。昨天：表示消息是在昨天发送的。
2024-04-19 21:44:13
2278
原创 轻松导出CSV文件：Vue插件PapaParse指南
在Vue项目中，轻松导出CSV文件是一项重要的任务，而使用Vue插件PapaParse将使这一过程变得更加简便高效。本指南将带您逐步了解如何安装和使用PapaParse插件，以及如何利用其功能导出精美的CSV文件。
2024-04-19 21:42:00
895
原创 yarn安装后使用时报错
yarn : 无法加载文件 C:\Users\10196\AppData\Roaming\npm\yarn.ps1，因为在此系统上禁止运行脚本。默认情况下，PowerShell 的执行策略可能会禁止运行脚本，因为这可能会带来安全风险。你可以修改 PowerShell 的执行策略以允许运行脚本。这将允许在当前 PowerShell 会话中运行任何脚本，但在关闭 PowerShell 后将恢复为原始策略。如果你不想永久更改执行策略，你可以通过在 PowerShell 中执行以下命令来临时更改执行策略。
2024-04-19 21:40:30
456
原创 JavaScript数字数据转换大揭秘：如何巧妙转换为二进制数据？
本文旨在帮助读者更好地理解在JavaScript中对数字类型（包括但不限于Number类型）的处理，主要关注数字数据与二进制数据的转换。在日常JavaScript编程中，我们很少涉及到二进制数据。然而，当与后端进行WebSocket数据交互时，可能会遇到需要处理二进制数据格式的情况。为了更好地理解即将发布的关于WebSocket传输二进制相关内容的文章，我们有必要学习JavaScript中如何操作和存储二进制数据。
2024-04-19 21:27:24
1815
原创 Vue3中Ref与Reactive详解：深入理解及实际应用
ref是Vue3提供的一个基础响应式API，用于创建一个包装过的响应式对象。通过ref，我们可以轻松地将一个普通值变成一个可响应的对象。通过本教程，我们深入了解了Vue3中ref和reactive的基本概念和使用方法，以及一些高级用法。通过熟练运用这两个API，开发者可以更好地管理数据，提高开发效率。希望这份Vue3 Ref与Reactive的详解教程对您有所帮助，为您在Vue3开发中的数据管理提供更多便捷和灵活的选择。
2024-04-19 21:26:34
812
1
原创 小巧而专注的打包工具rollup
Rollup 是一个 JavaScript 模块打包器，可以将小块代码编译成大块复杂的代码，例如 library 或应用程序优点: 小巧而专注。
2024-04-19 21:20:25
771
原创 面试宝典之ES6知识点
在现代JavaScript开发中，已经成为了开发者们的标配，它引入了许多令人期待的语言特性，使得JavaScript的编程体验更加强大、灵活和现代化。对于准备面试或提升自身技能的开发者而言，熟练掌握ES6是至关重要的一环。本篇面试宝典将深入剖析ES6中的关键知识点，涵盖了箭头函数、解构赋值、let 和 const、Promise、模板字符串、类与继承、模块化等重要概念。我们将通过简单易懂的例子、清晰的解释，帮助你更好地理解和掌握 ES6 的精髓，为你在面试时的表现提供有力的支持。
2024-04-19 21:19:12
555
原创 Vue3 高级技巧探索
Vue3引入了自定义指令的概念，允许开发者通过简单的API来扩展DOM的行为。在本章中，我们将深入了解自定义指令的基本结构和使用方式。
2024-04-19 21:18:07
779
原创 Vue3 Watch详解：新手入门教程
在Vue3中，watch是一个用于监听数据变化并触发回调函数的功能。当数据发生变化时，watch会自动执行相应的操作，使得我们可以对数据的变化进行更灵活的处理。通过本教程，我们深入了解了Vue3中watch的基本概念和常见用法，以及一些高级用法。通过灵活运用watch，开发者可以更好地响应数据的变化，实现更强大的功能。希望这份Vue3 Watch的新手教程能够帮助您更好地理解和应用watch功能，为您的Vue3开发之旅添上更多的便利。
2024-04-19 21:14:56
1327
原创 记录小工具：密码生成器的开发
前往体验密码是一种用来混淆的技术，它希望将正常的（可识别的）信息转变为无法识别的信息。当然，对一小部分人来说，这种无法识别的信息是可以再加工并恢复的。密码在中文里是“口令”（password）的通称。登录网站、电子邮箱和银行取款时输入的“密码”其实严格来讲应该仅被称作“口令”，因为它不是本来意义上的“加密代码”，但是也可以称为秘密的号码。独特的： 您应该为每个帐户设置单独的密码。长的： 它的长度至少为 12 个字符。复杂的： 它包括大写和小写字母、数字和符号。
2024-04-19 21:14:03
2093
原创 Vue3 Hook详解：提升组件逻辑复用和可维护性的利器
Vue3 Hooks是一种函数式的API，允许我们在组件之间复用状态逻辑。这些函数包括setupreactiveref等，以及一系列生命周期函数如onMountedonUpdated等。console.log('计数器已初始化');});return {count,Vue3的Hooks为组件开发提供了更灵活的选择，能够更好地提高组件逻辑的可维护性和复用性。希望通过本文的详解，您对Vue3中的Hooks有更清晰的认识，能够更自如地应用于实际项目开发中。
2024-04-19 21:13:00
514
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人