- 博客(248)
- 问答 (4)
- 收藏
- 关注
原创 TypeScript中的接口(Interface):对象类型的强大工具
在TypeScript中,接口是一种用于定义对象类型的方式。它描述了一个对象应该具有的属性和方法,但不包含实现细节。接口可以看作是一种"契约",定义了对象应该遵守的规则。使用interface。
2024-08-20 13:46:36
591
原创 Ajax和Json
通过上述示例,我们可以看到Ajax和JSON如何协同工作,以实现无需重新加载页面即可更新网页部分内容的功能。这种技术极大地提高了Web应用程序的用户体验和交互性。随着Web开发技术的不断进步,Ajax和JSON的使用将更加广泛和深入。JSON数据格式易于阅读和编写,同时也易于JavaScript解析。对象,它是浏览器提供的用于与服务器进行通信的API。1、创建XMLHttpRequest对象。2、设置请求的方法、URL和异步标志。3、定义请求完成后的回调函数。
2024-08-20 13:26:51
341
原创 人工智能时代如何保持核心竞争力?
随着AIGC(如chatgpt、midjourney、claude等)大语言模型接二连三的涌现,AI辅助编程工具日益普及,程序员的工作方式正在发生深刻变革。例如,复杂系统设计能力、跨学科知识整合能力、与AI协作的能力等。可以探讨AI工具如何改变日常编码实践,例如自动补全、代码生成等功能对工作效率的提升。同时,也可以讨论过度依赖AI工具可能带来的潜在风险,如编程基本功弱化、创新能力下降等问题。可以讨论持续学习的重要性,如何选择适合自己的专业方向,以及在快速变化的技术环境中保持竞争力的策略。
2024-08-07 10:59:13
154
原创 鸿蒙-利用Code Linter检查代码
1.在已打开的代码编辑器窗口单击右键点击Code Linter,或在工程管理窗口中鼠标选中单个或多个工程文件/目录,右键选择Code Linter > Full Linter执行代码全量检查2.通过git 提交,可在commit界面右下角点击齿轮图标,选择Incremental Linter执行增量检查不在工程根目录新建code-linter.json5文件的情况下,Code Linter默认会检查@performance/recommended 和。
2024-08-05 11:46:52
359
3
原创 【微信小程序开发】小程序中的上滑加载更多,下拉刷新的实现
要实现,往上拉,拉到最底部时,显示更多的数字,需要在goods.json文件中配置onReachBottomDistance。onReachBottomDistance的意思是,当拉到距离底部距离多少rpx时开始触发加载更多。滑动加载数据,在js代码中是固定的函数名 onReachBottom。###json中配置###小程序上拉,显示更多数据。重新建个tarbar。
2024-07-31 17:44:02
312
原创 前端实现文本超出指定行数显示”展开”和”收起”效果
实现样式1、底部容器设置定位,按钮和文本容器利用z-index设计容器层级,并使按钮定位在右下角;2、设置高度=指定隐藏行数*一行文本的高度,此处一行高度为21px,指定两行隐藏,最大高度就为42px;3、设置按钮背景为白色,覆盖在文本上方;
2024-07-30 16:47:11
178
1
原创 使用 Web Serial API 在浏览器中实现串口通讯(纯前端)
对于这个API谷歌有提供示例工程:在线使用:https://googlechromelabs.github.io/serial-terminal/项目地址:https://github.com/GoogleChromeLabs/serial-terminal使用 Web Serial API 访问串口非常方便,目前来说唯一的问题是这还是实验性质的功能,可能之后接口还会变动,需要根据实际情况进行调整。
2024-07-23 16:03:02
463
原创 Leaflet集成wheelnav在WebGIS中的应用
有时候我们根据自己业务的需要,需要给不同的组件设置不同的样式,这里组件采用的是其自带的样式库。作为前端展示组件,它也可以接受我们为他设置的其它合法的css样式及属性。'>");wheel1.createWheel(['一', '二', '三', '四', '五']);//刷新});以上就是本文的主要内容,重点讲解如何在Leaflet组件中集成wheelnav。
2024-07-16 11:11:58
905
原创 Markdown编辑器
你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章,了解一下Markdown的基本语法知识。我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写博客:撤销:Ctrl/Command + Z重做:Ctrl/Command + Y加粗:Ctrl/Command + B斜体:Ctrl/Command + I标题:Ctrl/Command + S
2024-07-16 10:48:58
359
原创 Less 文件转 CSS 文件
组件库,同一组件在不同平台的功能一致,但是样式有所不同,如果仍然使用上面的方式进行打包,显然很难满足不同平台对不同样式的需求,因此我开始调研相关的解决方案。发现在诸如 ant-design 这样的知名组件库中,React 组件的书写和样式的书写是分开的,用户在使用过程中,除了需要引入 React 组件之外,还需要统一引入打包好的 css 样式文件。到这里,其实基本上完成了我的需求,只需要将不同主题的各个样式文件统一到对应的入口 less 文件中,之后统一运行编译命令即可生成对应主题的 css 文件。
2024-05-17 09:46:06
603
原创 性能优化的理解
Vue 在大多数常见场景下性能都是很优秀的,通常不需要手动优化。然而,总会有一些具有挑战性的场景需要进行针对性的微调。在本节中,我们将讨论用 Vue 开发的应用在性能方面该注意些什么。:首次访问时,应用展示出内容与达到可交互状态的速度。这通常会用 Google 所定义的一系列Web 指标(Web Vitals) 来进行衡量,如最大内容绘制(Largest Contentful Paint,缩写为 LCP) 和首次输入延迟(First Input Delay,缩写为 FID)。
2024-05-15 11:01:47
792
原创 单文件组件,为什么要使用 SFC
Vue 的单文件组件 (即*.vue文件,英文 Single-File Component,简称SFC) 是一种特殊的文件格式,使我们能够将一个 Vue 组件的模板、逻辑与样式封装在单个文件中。</style>如你所见,Vue 的单文件组件是网页开发中 HTML、CSS 和 JavaScript 三种语言经典组合的自然延伸。<template><script>和<style>
2024-05-15 10:33:59
1021
原创 计算机视觉(CV)技术的优势和挑战
实时性能:CV技术可以实时地分析和处理图像和视频数据,在许多应用领域中具有重要意义,如视频监控和自动驾驶。复杂性和多样性:CV技术需要处理各种不同类型和质量的图像和视频数据,这使得算法的设计和实现变得复杂和困难。变化和不确定性:图像和视频数据具有很高的时空变化和不确定性,这给CV技术的分析和识别带来了挑战。准确性和一致性:CV技术可以实现准确和一致的图像和视频分析,从而减少了人为因素的干扰和错误。隐私和安全问题:CV技术涉及大量的个人和敏感信息,如人脸识别,这引发了隐私和安全的担忧。
2024-05-15 10:24:47
382
原创 持续集成和持续部署(CI/CD)
持续集成和持续部署使得开发人员可以更快地获得反馈,因为每次提交代码后都会自动构建和测试,开发人员可以立即知道代码是否通过了测试。:持续集成和持续部署的自动化流程可以确保每次构建和部署的一致性,减少了人为错误的可能性,提高了软件的可靠性和可重复性。:持续集成和持续部署通过频繁地自动化构建、测试和部署过程,可以及早发现和解决代码错误和问题,从而提高软件质量。:持续集成和持续部署通过自动化构建、测试和部署流程,减少了手动操作的需求,降低了人为错误的风险,并提高了效率。
2024-04-26 16:38:12
959
原创 程序员的金三银四求职宝典
金三银四,即三月和四月,被广大程序员视为求职的黄金时期。在这两个月里,各大公司纷纷开放招聘,求职者们则通过一轮又一轮的面试,力争心仪的职位。提示:介绍各大公司的文化特点、工作氛围等,帮助读者更好地了解公司,为选择适合自己的公司提供参考。提示:分享职业规划的方法和建议,帮助读者明确自己的职业目标和发展方向,为未来的职业生涯做好规划。提示:分析当前IT行业的发展趋势和市场需求,帮助读者了解行业动态,为求职和职业规划提供指导。提示:针对常见的面试题,提供解题思路和方法,帮助读者巩固基础知识,提升解决问题的能力。
2024-03-13 15:32:55
295
原创 AI 辅助研发趋势
探讨2024年AI辅助研发领域的技术突破和创新,如深度学习、强化学习、生成模型等技术在研发中的应用,以及这些技术如何推动研发效率的提升。基于当前的技术发展和市场趋势,对2024年及以后AI辅助研发的发展方向进行预测,如AI与研发流程的深度融合、智能研发平台的崛起等。讨论在AI辅助研发趋势下,如何培养具备AI技能的研发人才,以及教育体系如何适应这一变革,为未来的研发工作提供人才保障。针对不同行业,如医药、汽车、电子等,深入剖析AI辅助研发的实际应用案例,展示AI如何助力解决行业内的复杂研发问题。
2024-03-13 15:30:25
314
原创 机器学习中的 K-均值聚类算法及其优缺点
K-均值聚类算法是一种常用的聚类算法,它可以将数据集划分为 K 个类别,通过最小化各个类别内部数据点之间的平均距离来找到最优的类别划分。尽管存在一些缺点,但 K-均值聚类算法仍然被广泛应用于数据挖掘和聚类分析中。K-均值聚类是一种常用的无监督学习算法,用于将数据集划分为 K 个类别。该算法的目标是通过最小化各个类别内部数据点之间的平均距离来找到最优的类别划分。下面我们将详细讲解 K-均值聚类算法及其优缺点。
2024-03-13 09:29:43
421
原创 区块链技术的应用场景和优势
区块链可以实现全程追踪和验证物品的来源、运输和交付过程,提高物流和供应链的可追溯性、可靠性和透明性。它可以提供可信的身份验证和交易记录,防止欺诈和篡改,提高公共数据的安全性和透明度。:区块链使用密码学算法和分布式验证机制,确保交易和数据的安全性和真实性。通过验证和追踪供应链的交易和资产,区块链可以降低融资成本和风险,增加融资机会。:由于没有中间人和复杂的交易流程,区块链可以实现快速、安全、低成本的交易。总之,区块链技术的应用场景广泛,可以提供更安全、透明、高效和低成本的解决方案,改变传统行业的运作方式。
2024-03-11 16:45:48
604
原创 解释 Git 的基本概念和使用方式
总结来说,Git 是一个强大的版本控制系统,可以通过创建仓库、提交文件、创建分支、合并分支等操作来管理和协同开发代码。Git 是一个版本控制系统,用于跟踪文件和文件夹的变化。它可以记录文件的修改历史、创建分支、合并分支以及协同开发。
2024-03-08 10:21:19
524
原创 介绍 Docker 的基本概念和优势,以及在应用程序开发中的实际应用
另外,Docker还可以用于微服务架构,通过将每个微服务打包为一个容器,实现高度的模块化和可扩展性。镜像是一个只读模板,包含了运行应用程序所需的一切,包括代码、运行时环境、系统工具、系统库等。仓库是用于存储和分享镜像的地方,可以是公共的仓库,如Docker Hub,也可以是私有的仓库。Docker是一个开源的容器化平台,用于将应用程序及其依赖打包为一个独立的容器,然后在任何环境中运行。Docker的基本概念包括镜像、容器和仓库。:Docker容器可以在不同的环境中运行,减少了应用程序在不同环境部署的问题。
2024-03-06 10:48:34
637
原创 介绍 Apache Spark 的基本概念和在大数据分析中的应用
它支持批处理、流处理、机器学习和图计算等多种场景,并且提供了丰富的API和库来简化大数据处理的复杂性。:RDD是Spark的核心数据结构,它是一个可并行操作的、可变的、容错的分布式集合。它支持常见的流处理操作,如窗口计算、累加器、状态管理等,可以用于实时监控、实时报警等场景。:Spark提供了丰富的转换操作,如map、filter、reduce等,用于对RDD进行转换和操作。Spark的设计目标是为了提高大数据处理的速度和灵活性。它提供了丰富的转换和行动操作,可以方便地进行数据清洗、聚合、过滤等操作。
2024-03-06 10:46:04
365
2
原创 Vue数组变更方法和替换方法
1、删除 —— 可以删除任意数量的项,只需要指定2个参数:要删除的第一项的位置和要删除项的项数。2、插入 —— 可以向指定位置插入任意数量的项,只需要提供3个参数:插入起始位置、0(要删除的项数)和要插入的项。如果要插入多个项,可以再传入第四、第五,一直任意多个项。3、替换 —— 可以向指定位置插入任意数量的项,且同时删除任意数量的项,只需要指定3个指定参数:起始位置、要删除的项数和要插入的任意数量项。插入的项数是不必与删除的项数相等。
2023-12-20 16:09:47
1135
原创 Vue中给对象添加新属性时,界面不刷新怎么办?
标签绑定点击事件,我们预期点击按钮时,数据新增一个属性,界面也 新增一行。中做一次强制更新,99.9% 的情况,是你在某个地方做错了事。实现数据响应式的,直接动态添加新属性仍可以实现数据响应式。不允许在已经创建的实例上动态添加新的响应式属性。应创建一个新的对象,合并原对象和混入对象的属性。点击按钮,发现结果不及预期,数据虽然更新了(添加新属性的时候,却无法触发事件属性的拦截。如果为对象添加少量的新属性,可以直接采用。如果需要为新对象添加大量的新属性,则通过。方法,实现新增属性的响应式。
2023-12-08 17:48:48
593
原创 前端高频面试题
常见的前端性能优化方法包括减少HTTP请求,合并和压缩资源文件,使用CDN加速,使用缓存,优化图片,延迟加载,使用懒加载,使用异步加载,优化DOM操作,使用CSS Sprites,优化JavaScript代码等。浏览器缓存是指浏览器在访问网页时,将网页的资源(如HTML、CSS、JavaScript、图片等)保存在本地磁盘中,以便在下次访问相同网页时直接从本地加载,提高访问速度。跨域请求是指在浏览器中,通过JavaScript发起的请求,请求的目标与当前网页所在的域名不一致。
2023-08-14 10:57:23
466
原创 引入echarts时报错 “TypeError: Cannot read properties of undefined (reading ‘init‘)“的解决方案
灵异事件!程序里发现了新Bug但是它正常运行啦!”、“谁敢信,我电脑死机竟然是因为放青藏高原的时候硬盘共振振幅太大了——”……人生处处有Bug在用vue ui 创建项目,引入Echarts图表的时候,终端报了'Error in mounted hook: "TypeError: Cannot read properties of undefined (reading 'init') " '的错误,翻译为:“挂载的钩子中出现错误:“TypeError:无法读取未定义的属性(读取'init')”
2023-08-14 10:47:28
1948
原创 WebSocket心跳机制(笔记大全)
第一种方式会对服务器造成很大的压力,因为即使WebSocket连接正常,也要定时发送心跳包,从而消耗服务器资源。WebSocket心跳机制是必要的,它可以使WebSocket连接保持长连接,避免断开连接的情况发生。WebSocket心跳机制的原理是利用心跳包及时发送和接收数据,保证WebSocket长连接不被断开。WebSocket需要心跳,因为WebSocket连接可能会因为长时间没有数据传输而被断开,而心跳机制可以及时检测连接状态,保持WebSocket长连接。
2023-07-25 10:32:06
17634
2
原创 对Webpack的理解
Webpack是目前比较物流的前端构建工具,它基于入口,用不同的Loader来处理不同的文件Webpack的核心概念Entry:入口,Webpack执行构建的第一步将从Entry开始,可抽象成输入。告诉Webpack要使用哪个模块作为构建项目的起点,默认为./src/index.jsoutput:出口,告诉Webpack在哪里输出它打包好的代码以及如何命名,默认为./distModule:模块,在Webpack里一切皆模块,一个模块对应着一个文件。Webpack会从配置的Entry开始递归找出
2023-07-25 10:27:55
936
原创 WebSocket心跳机制
存在网络忽然断开的情况,这时服务器端并没有触发onclose的事件。服务器会继续向客户端发送多余的信息,这些数据会丢失。为了解决上面的问题,就需要⼀种机制来检测客户端和服务端是否处于正常的连接状态。因此就有了websocket的心跳机制。(1)websocket在连接后,如果长时间服务端和客户端不发消息,服务端会把websocket给断开。1、创建webSocket。2、websocket事件。3、WebSocket方法。
2023-07-25 10:21:11
2031
原创 Vue实例挂载的过程发生了什么
源码位置:src\platforms\web\runtime\index.js。方法,但发现本文件中并没有此方法,但仔细可以看到文件下方定义了很多初始化方法。源码位置:src\core\instance\lifecycle.js。源码位置:src\core\instance\render.js。源码位置:src\core\instance\index.js。源码位置:src\core\instance\state.js。源码位置:src\core\instance\init.js。的挂载,因此无法访问到。
2023-07-22 10:43:48
300
原创 我的创作纪念日
2022年02月23日发布第一篇博客。获得了一些粉丝的关注获得了不少正向的反馈,如赞、评论、阅读量等同时还认识了许多技术大神不叫猫先生、经海路大白狗......创作已然是生活的一部分在有限的精力下,可以很好平衡创作和工作学习
2023-07-20 10:11:48
224
原创 React中组件间过渡动画如何实现?
当一个组件在显示与消失过程中存在过渡动画,可以很好的增加用户的体验。属性,让元素在两个状态之间平滑过渡,从而得到相应的动画效果。发生变化的时候,先保存移除的节点,当动画结束后才真正移除。在日常开发中,页面切换时的转场动画是比较基础的一个场景。可以帮助我们方便的实现组件的入场和离场动画。,然后开始执行动画,当动画结束后,移除两个。插入的节点,先渲染dom,然后再做动画。删除的节点,先做动画,然后再删除dom。当有一组动画的时候,就可将这些。当动画执行结束后,会移除两个
2023-07-13 10:49:07
1404
原创 React中的key有什么作用?
良好使用key属性是性能优化的非常关键的一步,注意事项为:key 应该是唯一的key不要使用随机值(随机数在下一次 render 时,会重新生成一个数字)使用 index 作为 key值,对性能没有优化react判断key。当拥有key的时候,react根据key属性匹配原有树上的子元素以及最新树上的子元素,像上述情况只需要将000元素插入到最前面位置当没有key的时候,所有的li标签都需要进行修改同样,并不是拥有key值代表性能越高,如果说只是文本内容改变了,不写key反而性能和效率更高
2023-07-13 10:43:33
848
原创 React中 Real DOM 和 Virtual DOM 的区别?优缺点?
性能方面:使用 Virtual DOM,能够有效避免真实 DOM 数频繁更新,减少多次引起重绘与回流,提高性能。请求后,并不知道后续还有 9 次更新操作,因此会马上执行流程,最终执行 10 次流程。,意思为文档对象模型,是一个结构化文本的抽象,在页面渲染出的每一个结点都是一个真实。跨平台:React 借助虚拟 DOM,带来了跨平台的能力,一套代码多端运行。第二个参数是个对象,里面存着标签的一些属性,例如 id、class 等。节点,浏览器没这么智能,收到第一个更新。执行,返回值是一个对象,也就是虚拟。
2023-07-13 10:40:16
746
原创 Vue中组件和插件有什么区别?
组件就是把图形、非图形的各种逻辑均抽象为一个统一的概念(组件)来实现开发的模式,在Vue中每一个.vue文件都可以视为一个组件组件的优势降低整个系统的耦合度,在保持接口不变的情况下,我们可以替换不同的组件快速完成需求,例如输入框,可以替换为日历、时间、范围等组件作具体的实现调试方便,由于整个系统是通过组件组合起来的,在出现问题的时候,可以用排除法直接移除组件,或者根据报错的组件快速定位问题,之所以能够快速定位,是因为每个组件之间低耦合,职责单一,所以逻辑会比分析整个系统要简单。
2023-06-30 14:44:07
624
原创 Vue实例挂载的过程
我们都听过知其然知其所以然这句话那么不知道是否思考过new Vue()这个过程中究竟做了些什么?过程中是如何完成数据的绑定,又是如何将数据渲染到视图的等等首先找到vue的构造函数源码位置:src\core\instance\index.js是用户传递过来的配置项,如等常用的方法vue构建函数调用_init方法,但我们发现本文件中并没有此方法,但仔细可以看到文件下方定定义了很多初始化方法首先可以看initMixin方法,发现该方法在Vue原型上定义了_init方法。
2023-06-30 10:08:02
1116
原创 对 Electron 架构的理解
Electron 的架构采用了 Chromium 和 Node.js 的组合方式,将 web 技术栈和底层系统功能完美地结合起来,提供了一种灵活、可扩展的桌面应用程序开发方式。对于前端开发人员来说,它提供了一种全新的开发方式和编程思路,为构建高质量的桌面应用程序提供了更多的便利和选择。与传统的桌面应用程序不同,Electron 应用程序使用 HTML、CSS 和 JavaScript 技术栈来实现界面设计和业务逻辑,并且具有良好的跨平台性能和扩展性。
2023-06-29 11:22:18
1760
原创 CSP(Content Security Policy)可以解决什么问题?
当浏览器尝试加载一个 Web 页面时,它会检查页面是否包含 CSP 头,并根据该头信息确定允许加载哪些资源。CSP 通过限制 Web 应用程序能够加载和执行的内容,来减少恶意攻击的成功率。需要注意的是,在实际应用中,Web 开发人员需要谨慎设置 CSP 规则,以确保不会限制正常的 Web 应用程序功能。此外,开发人员也需要定期审核 CSP 规则,以确保其仍然适用于最新的 Web 应用程序版本。总之,CSP 的原理是通过限制 Web 应用程序能够加载和执行的内容,来减少恶意攻击的成功率。
2023-06-29 11:22:01
450
原创 Vue常用的修饰符有哪些?分别有什么应用场景?
在程序世界里,修饰符是用于限定类型以及类型成员的声明的一种符号在Vue中,修饰符处理了许多DOM事件的细节,让我们不再需要花大量的时间去处理这些烦恼的事情,而能有更多的精力专注于程序的逻辑处理vue。vue中修饰符分为以下五种:表单修饰符事件修饰符鼠标按键修饰符键值修饰符v-bind修饰符
2023-06-29 11:17:45
402
原创 CSS3新增了哪些新特性?
动画这个平常用的也很多,主要是做一个预设的动画。和一些页面交互的动画效果,结果和过渡应该一样,让页面不会那么生硬。(Cascading Style Sheets)的简称,是一种标记语言,由浏览器解释执行用来使页面变得更美观。background-size属性常用来调整背景图片的大小,主要用于设定图片本身。通常情况,背景都是覆盖整个元素的,利用这个属性可以设定背景颜色或图片的覆盖范围。能够规定水平阴影、垂直阴影、模糊距离,以及阴影的颜色。当我们设置背景图片时,图片是会以左上角对齐,但是是以。
2023-06-27 12:00:07
787
HTML中语义化的理解
2023-06-21
uniapp实现上拉刷新下拉加载
2023-05-26
圣诞树代码,html+js编写
2022-12-18
关于#前端#的知识点:vue2和vue3的区别,比较vue2与vue3
2023-05-05
关于#WebSocket#的问题,如何解决?
2022-08-12
关于前端程序员面试时最常见的问题有哪些!
2022-06-16
关于#注册登录#的问题,如何解决?
2022-06-14
在vue中如何实现跨域问题
2022-06-11
TA创建的收藏夹 TA关注的收藏夹
TA关注的人