- 博客(156)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 JS中DOM的API使用
JavaScript DOM API 提供了操作网页内容的核心方法，主要包括：获取元素（选择器API）、修改内容（textContent/innerHTML）、操作属性（setAttribute/getAttribute）、修改样式（style/classList）、节点增删改（createElement/appendChild/remove）、事件处理（addEventListener）以及节点关系遍历（parentNode/children等）。这些API使开发者能够动态更新页面内容、样式和结构，实现丰
2025-08-25 15:36:26
684
原创 TypeScript中的枚举
TypeScript枚举（Enum）是一种用于定义命名常量集合的类型，主要分为数值枚举、字符串枚举和异构枚举。数值枚举支持自动递增和反向映射，字符串枚举提供更好的可读性。枚举支持常量枚举（const enum）以优化性能，以及计算成员等特性。相比联合类型，枚举更适合需要运行时访问的场景，而联合类型更轻量。枚举常用于状态码、选项等固定值集合，提供类型安全性和代码组织性。
2025-08-20 17:00:56
666
原创 java中的枚举
Java枚举（Enum）摘要 枚举是Java中定义固定常量集合的特殊类型，比传统常量更安全可读。核心特性： 基本定义：使用enum声明，常量默认是单例实例（如Weekday.MONDAY）； 进阶用法：支持成员变量、构造方法（私有）、普通方法及抽象方法（每个常量需实现）； 内置方法：如values()、valueOf()等，便于遍历和转换； 优势：类型安全、可读性强、功能灵活，适合状态、分类等场景。 枚举在switch语句中表现优异，能有效避免无效值，提升代码健壮性。
2025-08-20 16:59:26
365
原创 vue中动态设置class类名和style样式
Vue中动态设置class和style主要通过v-bind指令实现，支持对象语法、数组语法和计算属性。动态class通过:class绑定CSS类，对象语法最常用，能根据条件独立判断类名添加；数组语法可直接组合类名或嵌套条件判断；复杂逻辑建议使用计算属性。动态style通过:style绑定内联样式，对象语法支持驼峰或短横线属性名，值可为变量；数组语法可合并多个样式对象；计算属性适合处理复杂样式逻辑。两者的核心差异在于：class基于预定义CSS类，适合复用率高场景；style直接绑定内联样式，适合动态性强的实
2025-08-20 15:28:11
1136
原创 js计算两个经纬度之间的角度
本文介绍了在JavaScript中计算两点经纬度之间方位角的方法，基于球面三角学公式。通过将经纬度转换为弧度，计算经度差，并应用球面方位角公式，最终得到0°~360°的方位角。文章提供了详细的实现代码，并解释了方位角的含义（正北为0°，顺时针递增）及注意事项，如经纬度单位转换和误差范围。示例计算北京到上海的方位角约为123°，表示东南方向。
2025-08-18 16:43:44
412
原创 css中px转rem的计算公式
CSS中px转rem的公式为：目标rem值 = px值 ÷ 根元素font-size。1rem等于<html>元素的font-size值（单位px）。例如，根元素font-size为16px时，24px=1.5rem；设为10px（62.5%优化）时，30px=3rem。关键是根据根元素的font-size进行除法计算，设为10px可简化运算（n px=n/10 rem）。
2025-08-18 15:39:29
470
原创 css中em和rem的使用
CSS中的em和rem都是相对长度单位，但参考基准不同：em基于父元素的font-size，适合局部比例控制，但多层嵌套时可能出现尺寸累积问题；rem基于根元素的font-size，全局统一可控，适合整体布局和响应式设计。实际开发中常混合使用，用rem定义全局框架，用em调整组件内部细节。响应式设计时可通过修改根元素font-size实现批量适配。
2025-08-18 15:23:26
548
原创 java中常见的报错类型,以及对应的含义和解决思路
Java开发中常见报错类型及解决方法摘要： 空指针异常（NullPointerException）：未初始化对象时操作，需判空或主动校验； 类型转换异常（ClassCastException）：转换前用instanceof检查类型兼容性； 数组越界（ArrayIndexOutOfBoundsException）：确保索引在有效范围内； 非法参数（IllegalArgumentException）：方法内部校验参数合法性； IO异常（IOException）：文件/网络操作需检查资源状态并关闭流； 并发修改异
2025-08-18 14:19:23
358
原创 java中map的api详细使用
Java中的Map接口用于存储键值对数据，具有键唯一、值可重复的特性。主要实现类包括HashMap（无序高效）、LinkedHashMap（维护插入顺序）、TreeMap（按键排序）和线程安全的ConcurrentHashMap。核心操作包含put添加/修改元素、get获取值、remove删除元素，以及通过keySet()、values()和entrySet()进行遍历。不同实现类各有特点：HashMap查询效率O(1)，TreeMap支持排序，LinkedHashMap保持插入顺序。典型用法包括初始化Ma
2025-08-15 14:51:25
678
原创 什么是Redis的哨兵模式
Redis哨兵模式是官方提供的高可用解决方案，通过自动监控主从节点、故障检测和主从切换，实现Redis服务的持续可用。哨兵集群由多个节点组成，负责监控节点状态、自动故障转移、通知异常和提供配置。工作原理包括主观/客观下线判断、领导者选举和故障转移流程。部署需要3个以上哨兵节点，与主从架构配合，适合对可用性要求高的生产环境。哨兵模式解决了主节点故障需手动切换的问题，是Redis集群化部署的关键高可用机制。
2025-08-15 14:49:00
357
原创 nginx配置代理服务器
反向代理：用于服务器端转发请求到后端服务，配置核心是locationproxy_pass+ 头信息传递。正向代理：用于客户端代理，需配置resolver和代理端口。注意路径匹配规则和超时设置，生产环境建议配置 SSL 证书。根据实际需求修改proxy_pass地址、端口和路径即可。
2025-08-13 16:42:17
639
原创 openlayers如何解决一个范围内point元素过多的问题
OpenLayers处理大量点数据时性能优化方案：主要采用点聚合（ol.source.Cluster合并近距离点）、分级加载（按缩放级别动态显示）、可视范围过滤（仅渲染视野内点）、WebGL加速（WebGLPointsLayer支持10万+点）和瓦片化预渲染（静态数据）。点聚合实现简单，通过设置聚合距离和动态样式平衡性能与交互；WebGL方案适合超大数据，但交互受限。开发者可根据数据量级（千级/万级/10万+）和动态需求选择合适方案，核心思路是减少同时渲染的要素数量。
2025-08-13 14:40:18
722
原创 TypeScript中的数组非空判断
TypeScript中判断数组非空需要满足两个条件：1) 数组不为null/undefined；2) 数组长度大于0。关键实现需使用Array.isArray()确保类型安全，并通过类型守卫(arr is T[])让TS自动推断类型。文章提供了基础判断方法、分场景处理方案，以及使用可选链和空值合并操作符的简化写法，最后推荐封装通用工具函数isNonEmptyArray，支持泛型且保证类型安全。核心步骤为：先排除null/undefined，再验证数组类型，最后检查长度。
2025-08-13 14:06:14
351
原创 java中在多线程的情况下安全的修改list
在多线程环境下操作List时，需确保线程安全以避免数据不一致和并发修改异常。常见解决方案包括： 线程安全容器： Vector（不推荐）：同步方法导致性能低下 Collections.synchronizedList()：包装非线程安全List，读写需同步 CopyOnWriteArrayList：写时复制，读无锁适合读多写少场景 手动同步： 使用synchronized块或ReentrantLock实现细粒度控制 注意事项： 复合操作需保证原子性 迭代操作需要特殊处理 根据读写比例选择合适方案 选择方案时应
2025-08-13 14:01:55
1080
原创 java中list的api详细使用
Java中的List接口代表有序可重复集合，核心实现类包括ArrayList（数组实现）和LinkedList（链表实现）。主要API功能包括：添加元素（add/addAll）、删除元素（remove/removeAll/clear）、获取修改元素（get/set）、查找判断（contains/indexOf）以及迭代遍历（iterator）。支持按索引操作和批量处理，是Java集合框架中最常用的接口之一。使用时需注意索引范围及元素判等规则。
2025-08-13 13:59:14
1133
原创 java中数组和list的区别是什么?
Java数组与List核心区别 本质差异：数组是固定长度的基础数据结构，支持基本类型和对象；List是动态扩容的集合接口（如ArrayList），仅存储对象（需包装类）。 关键对比： 长度：数组固定，需手动扩容；List自动扩展。 功能：数组仅支持索引访问；List提供add()/remove()等方法。 类型：数组编译时严格检查；List需泛型保障类型安全。 性能：数组连续内存，随机访问快；ArrayList基于数组，LinkedList适合频繁增删。 适用场景： 数组：固定长度、基本类型、高性能计算。
2025-08-13 13:54:50
415
原创 java中的集合非空判断
在Java中，判断集合是否为空需要同时检查是否为null和是否包含元素。原生方法是使用collection != null && !collection.isEmpty()，但更推荐使用工具类简化代码。常用工具包括Apache Commons Collections的CollectionUtils.isNotEmpty()、Spring Framework的CollectionUtils.isEmpty()以及Guava的Collections2.isEmpty()。这些工具类能避免空指针异
2025-08-13 13:51:49
398
原创 echarts配置项详细解释
ECharts是一款强大的JavaScript数据可视化库，其核心配置通过option对象实现，包含图表结构、数据、样式和交互等功能。主要配置项包括：1）基础组件如标题(title)、提示框(tooltip)、图例(legend)；2）坐标轴与网格(xAxis/yAxis/grid)；3）核心数据系列(series)，支持折线图、柱状图、饼图等多种图表类型；4）交互组件如工具栏(toolbox)和视觉映射(visualMap)。配置方式灵活，支持位置、样式、数据格式等自定义，通过组合不同配置项可快速构建各类
2025-08-12 16:27:15
1029
原创 echarts每次设置options的时候都强制清除之前的数据, 就是不要使用缓存
本文介绍了在ECharts中彻底清除图表缓存数据的方法，主要通过三个步骤实现：1)使用clear()方法完全清除当前图表；2)设置notMerge参数为true确保不保留旧配置；3)每次创建全新的options对象。文章提供了完整的代码示例，展示如何从柱状图切换到饼图而不保留任何缓存数据，并建议将此模式封装为工具函数。这种方法能确保图表更新时完全清除所有历史数据和配置。
2025-08-11 11:04:02
283
原创 一个可以实现日期格式化和时间加减的JS组件
本文实现了一个类似dayjs的日期处理类MyDayjs，包含日期解析、格式化、时间增减和比较等功能。核心特性包括：1）支持多种日期输入格式；2）提供丰富的格式化选项（YYYY-MM-DD等）；3）可获取/设置年月日时分秒；4）支持时间加减运算；5）包含日期比较方法（isBefore/isAfter等）；6）支持时区处理和闰年判断。通过封装原生Date对象，提供了更简洁易用的日期操作接口。
2025-08-11 11:00:12
215
原创 js怎么样获取一张照片的唯一标识
本文介绍了在JavaScript中通过计算图片文件的哈希值来获取唯一标识的方法。使用浏览器Web Crypto API实现：1)通过FileReader读取文件为ArrayBuffer；2)用SHA-256算法计算哈希值；3)转换为十六进制字符串作为标识。该方法确保相同内容生成相同哈希值，不同内容产生不同结果。适用于浏览器环境，需配合文件选择器使用，与文件名无关，仅依赖文件内容。文中提供了完整代码示例和使用说明，并指出Node.js环境下可用fs和crypto模块实现类似功能。
2025-08-08 11:25:56
334
原创 js怎么判断一个未申明的变量?
摘要：JavaScript中检测未声明变量需谨慎，typeof操作符是最安全的方式，返回'undefined'而不会报错，但无法区分未声明和已声明未赋值的情况。严格区分需结合try...catch检测ReferenceError错误。直接访问未声明变量会报错，typeof是最常用的简单检测方法。（149字）
2025-08-04 09:35:23
432
原创 js代码来判断一个变量是否是有效的日期格式
摘要：本文介绍了一个严格判断变量是否为有效日期的JavaScript函数isValidDate。该函数支持多种日期格式（字符串、Date对象、时间戳），通过解析验证和自动修正检测确保日期真实存在。核心逻辑包括：基础类型验证、字符串格式解析、自动修正检测（防止如2月30日被修正为3月2日的情况）以及多种日期格式兼容性处理。适用于表单验证、接口数据校验等需要确保日期有效性的场景。测试用例覆盖了常见有效/无效日期情况，提供了可靠的日期验证方案。
2025-08-01 15:39:33
243
原创 js判断是个变量和属性是否是有效值
本文介绍了一个严格判断数据有效性的JavaScript函数isValidValue，用于区分"有意义的数据"和无效数据。该函数排除了多种无效情况，包括基础假值（null/undefined/false/0/NaN）、空字符串、纯空格字符串、空数组/对象/Map/Set以及无效日期等。文章提供了详细的函数实现代码，包含对基础类型、引用类型和特殊类型的处理逻辑，并给出了关键场景测试用例。核心思想是确保只有真正包含实际内容或有效结构的数据才被视为有效。文中还建议了根据业务需求调整判断逻辑的方法
2025-08-01 15:36:40
214
原创 js生成唯一ID的方法
在 JavaScript 中生成唯一 ID（UUID）的方法有很多，根据场景需求（如唯一性强度、长度、可读性等）可选择不同方案。
2025-08-01 15:30:16
1036
原创 maven的阿里云镜像地址
本文介绍了在Maven中配置阿里云镜像的方法，以提升国内环境下依赖包的下载速度。通过修改settings.xml文件，在<mirrors>标签内添加阿里云公共仓库镜像(https://maven.aliyun.com/repository/public)，可覆盖所有远程仓库。还提供了谷歌、Spring等特定仓库的镜像配置示例。配置后Maven会优先使用阿里云镜像，显著提高国内下载效率。文章详细说明了配置文件的存放位置和具体操作步骤。
2025-07-31 19:55:46
655
原创 JS组合按键的绑定
这段代码实现了一个键盘组合键监听系统，通过JavaScript类KeyCombination来检测和响应特定组合键操作。核心功能包括：监听键盘事件、维护激活按键集合、注册自定义组合键及其回调函数。示例中演示了如何注册"Ctrl+S"和"Alt+Shift+X"两种组合键，触发时分别显示提示框。该实现考虑了按键顺序无关性（通过排序处理）和窗口失焦时的状态重置，可扩展为网页快捷键功能的基础框架。
2025-07-30 09:08:20
278
原创 JS实现数字变化时,上下翻滚动画效果
摘要 本文展示了一个高级数字翻滚动画效果的HTML实现。通过JavaScript和Tailwind CSS构建，该动画允许数字平滑滚动变化到目标值。核心功能包括： 动态数字显示 - 使用CSS动画实现数字翻滚效果 交互控制面板 - 可设置目标数字和调整动画速度 响应式设计 - 适配不同屏幕尺寸 视觉优化 - 包含渐变色背景、阴影和装饰元素 代码中运用了Flexbox布局、CSS过渡动画和自定义utility类，实现了流畅的数字变化效果和美观的UI界面。用户可以通过输入框设置目标数字，并通过滑块调整动画速度。
2025-07-26 10:45:37
264
原创 NodeJS搭建SSE接口服务
这篇文章介绍了一个基于Node.js和Express的SSE(Server-Sent Events)服务实现。代码展示了如何创建SSE接口，包括设置必要的响应头、管理客户端连接、实现单播和广播功能。服务提供了GET /sse接口供客户端订阅，以及POST /trigger接口手动触发消息推送，还包含定时5秒自动推送的模拟功能。文章还提供了客户端连接示例代码，并讨论了可能的扩展功能如心跳机制、安全增强等。这个实现为构建实时Web应用提供了基础框架，支持后续功能扩展。
2025-07-25 23:00:00
481
原创 JAVA人民币数字转换成为中文
这篇Java代码实现将阿拉伯金额数字转换为符合财务规范的中文人民币大写形式。主要特点包括：使用BigDecimal处理高精度计算，支持整数和小数部分（精确到角分），正确处理零值和单位（如万、亿），支持负数转换，并符合银行支付结算规范。代码通过字符映射和单位处理实现转换，能生成如"壹拾万零壹元零贰分"等标准格式，适用于财务报表、合同发票等场景。实现中考虑了四舍五入、零值简化和字符串拼接优化，提供了完整的财务金额转换解决方案。
2025-07-25 17:38:30
367
原创 JS人民币数字转换成为中文
本文介绍了一个将阿拉伯数字转换为中文人民币大写的JavaScript函数，符合财务规范要求。核心功能包括：处理整数和小数部分（精确到角分）、支持负数转换、遵循人民币大写规则（如"零"的位置处理、"整"字使用等）。函数提供输入验证，支持数字和字符串类型，处理特殊情况（如纯零值）。该实现适用于财务报表、合同发票等场景，符合中国人民银行规范，可直接集成到财务系统中使用。
2025-07-25 17:37:13
377
原创 JS解析query参数
这篇文章介绍了JavaScript实现查询字符串与对象相互转换的方法。代码包含两个核心函数：parseQuery将查询字符串解析为对象，处理URL编码、重复键和空值；stringifyQuery将对象转换为查询字符串，支持数组参数和特殊字符编码。特性包括完整的URI编码处理、数组参数支持、空值处理等，适用于URL参数解析、API请求构建等场景。注意事项包括参数值始终为字符串类型、不支持嵌套对象等。该实现不依赖外部库，兼容现代浏览器和Node.js环境。
2025-07-25 13:56:21
245
原创 JS深度克隆对象(克隆时包含函数)
摘要：标准JSON转换方法无法处理函数，但可通过自定义序列化或第三方库实现。方法一使用自定义函数将函数转为字符串再恢复；方法二推荐使用serialize-javascript库安全处理；方法三用eval()但有安全风险。需注意函数上下文丢失、闭包失效等问题，建议优先使用方法二确保安全性和可靠性。
2025-07-25 11:26:02
283
原创 JS控制时间进度的自定义API
本文介绍了一个纯JavaScript实现的时间控制API - TimeController类，支持多种时间格式输入和日期操作功能。该API可解析字符串、时间戳、Date对象等多种时间格式，提供加减天数/周数/月数/年数的方法，并能处理月份天数差异和闰年问题。此外，还支持中文星期显示、自定义格式化输出（如YYYY-MM-DD HH:mm:ss）以及转换为Date对象或时间戳。使用方式简便，支持链式调用，可通过new TimeController()初始化并调用addDays()、format()等方法进行操作
2025-07-25 09:21:01
305
原创 怎么样知道服务端是否支持sse服务?
如何判断服务端是否支持SSE（Server-Sent Events） 可通过以下方法验证SSE支持： 直接测试：使用浏览器开发者工具查看网络请求，检查状态码是否为200，响应头是否包含Content-Type: text/event-stream；或使用curl命令测试。 代码检查：查看服务端代码（如Node.js/Express、Python/Flask等）是否设置了正确的SSE响应头和数据推送逻辑。 服务器配置：检查Nginx/Apache等服务器配置是否支持SSE长连接。 咨询开发团队：直接联系服务端
2025-07-24 23:45:00
428
原创 在一个网页浏览器的控制台测试后端java是否支持SSE服务
摘要： 通过浏览器控制台的 JavaScript 代码可快速测试后端 Java 是否支持 SSE（Server-Sent Events）服务。步骤如下： 在控制台输入代码创建 EventSource 对象，连接后端 SSE 接口（如 http://localhost:8080/sse-endpoint）。 成功时，onmessage 回调会打印接收的数据（如周期性消息）；失败时，onerror 会显示错误类型（如网络错误或状态码异常）。 若测试失败，需结合后端日志排查问题（如响应头未正确配置或业务逻辑异常）
2025-07-24 23:45:00
353
原创 springboot项目建立sse接口
Spring Boot实现SSE接口的简明摘要：通过SseEmitter类可轻松创建服务端推送功能，服务端需维护emitter列表并处理超时/错误，客户端使用EventSource建立长连接。关键点包括消息格式规范、心跳机制和连接管理优化。生产环境建议添加身份验证、异步处理和负载均衡支持。典型问题涉及代理超时、消息丢失和跨域限制，可通过配置代理超时、完善错误处理和设置CORS策略解决。
2025-07-24 19:32:20
1086
原创 SSE与Websocket有什么区别？
SSE和WebSocket是两种实时通信技术，主要区别在于： 协议：SSE基于HTTP（单向），WebSocket为独立协议（双向）。 数据格式：SSE仅支持文本流，WebSocket支持文本/二进制。 性能：SSE有HTTP头部开销，WebSocket二进制帧更高效。 场景：SSE适合服务器推送（如通知），WebSocket适合双向交互（如聊天）。 兼容性：SSE不支持IE，WebSocket兼容IE10+。 选择建议：单向小数据用SSE，双向高频交互用WebSocket。
2025-07-24 18:38:30
982
原创 vscode不识别vsix结尾的插件怎么解决?
VS Code无法识别.vsix文件时，可尝试以下方法：1)重新下载文件确保完整性；2)通过扩展面板或命令行正确安装；3)检查VS Code与插件版本兼容性；4)手动解压验证文件结构；5)清除VS Code缓存；6)查看输出日志排查错误；7)测试其他VSIX文件；8)备份后重置VS Code设置。如问题持续，建议重装VS Code。
2025-07-23 00:00:00
537
原创 es6中的symbol基础知识
ES6引入的Symbol是一种新的原始数据类型，用于创建唯一的标识符。每个Symbol值都是独一无二的，即使描述相同。主要用途包括：作为对象属性键避免命名冲突、定义内置行为（如迭代器）和元编程。Symbol属性在常规遍历中不可见，但可通过特定方法访问。全局注册表允许跨作用域共享Symbol，而内置Symbol（如Symbol.iterator）则用于自定义对象行为。注意Symbol不能隐式转换类型，也不参与JSON序列化。它提供了非冲突的半隐藏属性，而非真正的私有性。
2025-07-22 19:39:45
985
制作地图线路流动效果，类似于echarts上的地图轨迹
2021-04-26
TA创建的收藏夹 TA关注的收藏夹
TA关注的人