- 博客(35)
- 收藏
- 关注
RSS订阅原创 大文件上传：秒传、断点续传、分片上传
大文件上传面临网络波动、服务器压力、重复存储等问题，秒传、分片上传和断点续传是三大核心技术。秒传通过文件哈希值校验避免重复传输；分片上传将大文件拆分为小块并行传输，降低单次压力；断点续传记录上传进度，中断后可从断点继续。三者常组合使用，如计算文件哈希后先秒传校验，再分片上传并实时记录进度，实现高效稳定的大文件传输。
2025-12-22 15:10:40
594
原创 浏览器工作原理
摘要 现代浏览器采用多进程架构，包括浏览器进程、渲染进程、GPU进程等，各司其职确保稳定性和性能。从输入URL到页面展示的核心流程包含7个步骤：URL解析与请求发起、服务器响应处理、资源接收与缓存、DOM树构建、CSSOM树生成、渲染树合并、以及最终的布局绘制与合成。其中DOM和CSSOM的解析可能相互阻塞，JS执行会暂停HTML解析。浏览器通过分层绘制和GPU加速优化渲染性能。开发者应注意避免频繁触发重排（回流）和重绘，可通过批量DOM操作、使用transform等优化手段提升页面性能。
2025-12-15 10:57:15
710
原创 ECharts数据可视化使用
ECharts是一款由百度开源的前端数据可视化工具，通过简单配置即可生成专业图表。其核心概念包括容器、实例、配置项、系列和坐标系。文章提供了基础柱状图和饼图的具体实现代码，并总结了常见问题解决方案：容器宽高设置、数据刷新、内存管理和自适应处理。最后归纳了ECharts使用五步骤（安装→容器→实例→配置→渲染）和不同场景的图表选择建议（折线图展示趋势、柱状图对比分类、饼图呈现占比等）。配置项结构主要包含标题、坐标轴、数据系列等核心模块。
2025-12-08 10:00:00
253
原创 动态规划解决问题
本文介绍了动态规划的基本概念和解题方法。动态规划通过将复杂问题拆解为子问题，并存储子问题解来推导最优解。关键要素包括：状态（用数组表示子问题）、状态转移方程（描述子问题间关系）和边界条件（初始化最小子问题解）。以求解两字符串最大公共子串为例，详细说明了如何定义状态、建立状态转移方程（字符匹配时延续子串，不匹配时重置），并通过二维表格记录中间结果。最后给出了Java实现代码，展示如何通过动态规划找到最长公共子串。掌握动态规划需要大量练习积累经验。
2025-12-01 11:41:50
472
原创 Pinia 快速入门
Pinia是Vue的状态管理库，重构了Vuex的核心逻辑，移除了mutation和嵌套modules等繁琐设计。其核心特点包括简化API、独立命名空间、自动类型推断、轻量级体积和兼容Vue2/Vue3。Pinia通过defineStore定义Store，包含state、getters和actions三部分，支持选项式和组合式两种写法。使用时需安装并挂载Pinia实例，通过useStore函数获取Store。可通过storeToRefs解构响应式状态，提供直接修改、$patch和actions三种状态修改方式
2025-11-24 14:57:02
574
原创 OpenAI 简单的集成教程
下面是关于 openai文件的完整集成教程，包含了前端实现和与后端的交互说明这个文件实现了一个简单的 OpenAI API 集成前端界面，用户可以通过该界面发送问题并获取 AI 模型的回复这周仅仅简单学习和了解了OpenAI 简单的集成教程的使用，详细的openai应用以及遇到的问题，看后面在项目中如何使用。
2025-11-17 10:00:00
912
原创 TypeScript 核心知识点
TypeScript核心知识点总结 TypeScript提供了更严格的类型系统，包括特殊类型如unknown（安全未知）和any（不安全未知）。两种类型的关键区别在于类型检查机制：unknown要求类型确认后才能使用，而any不进行类型检查。 对象类型方面，小写object严格限定非原始类型，而大写Object包含所有继承Object原型的类型。索引签名允许动态添加字符串键属性。 类型声明方式多样，包括接口、类型别名、元组和枚举。类定义可通过参数属性简化写法，抽象类用于定义父类结构。接口用于定义对象和函数结
2025-11-02 11:24:50
723
原创 Vue3的使用
Vue3相比Vue2最大的改进是将Option API改为Composition API，使功能代码更集中、便于维护复用。主要特性包括：1. setup函数作为组合式API入口，替代Vue2的beforeCreate/created钩子；2. ref处理基本类型响应式数据，通过value属性访问；3. reactive处理对象类型数据，支持深层次响应；4. 计算属性需引入computed方法；5. watch监听器需引入watch方法，支持多数据源监听。Composition API通过函数式组织代码，解决
2025-10-26 11:42:11
796
1
原创 Vuex 核心概念与最佳实践
Vuex 是 Vue 的状态管理工具，用于解决多组件共享状态问题。其核心概念包括：State（存储状态）、Getters（计算属性）、Mutations（同步修改状态）、Actions（异步操作）和 Modules（模块化管理）。使用步骤：安装 Vuex → 创建 Store 实例 → 注入根实例 → 组件通过 $store 或辅助函数访问。模块化开发时，通过 namespaced 隔离模块，使用 模块名/方法名 调用。Vuex 实现了状态的集中管理和响应式更新，适合中大型项目开发。
2025-10-19 11:23:44
707
原创 Vue 核心特性详解：计算属性、监听属性与事件交互实战指南
Vue核心特性解析 本文系统介绍了Vue.js的四个核心特性： 计算属性：通过computed实现数据自动计算和缓存，提升性能，适用于依赖其他数据的派生值计算。 监听属性：使用watch监听数据变化，支持深度监听和立即执行，适合处理异步操作和复杂业务逻辑。 事件处理器：通过v-on指令绑定DOM事件，支持参数传递和事件修饰符，简化事件处理逻辑。 特性对比：详细比较了计算属性和监听属性的适用场景、缓存机制等核心差异，帮助开发者合理选择。 这些特性共同构成了Vue响应式系统的基础，掌握它们能有效提升开发效率和代
2025-10-12 10:59:24
1280
1
原创 Vue的初步学习
每个 Vue 应用都需要通过实例化 Vue 来实现。这意味着我们接下来的改动全部在以上指定的 div 内，div 外部不受影响。data 用于定义属性，实例中有三个属性分别为：site、url、alexa。methods 用于定义的函数，可以通过 return 来返回函数值。{{ }} 用于输出对象属性和函数返回值。
2025-09-28 10:53:07
591
原创 node.js的初步学习
node.js 提供了 JavaScript的运行环境。当JavaScript作为后端开发语言来说， 需要在node.js的环境上进行当JavaScript作为前端开发语言来说，需要在浏览器的环境上进行。
2025-06-09 15:36:59
698
1
原创 封装confirm框
通过事件委托机制，在父容器上监听点击事件，然后根据点击目标的属性或类名来判断是否执行删除操作。这种方式只需一个事件监听器即可处理所有删除按钮。
2025-06-03 08:17:11
435
原创 前端如何实现分页？
本文介绍了前端实现分页的完整方案，包含HTML、JavaScript和CSS三部分。HTML构建了表格结构和分页容器；JavaScript通过异步请求获取分页数据，并动态渲染表格内容和分页导航；CSS优化了分页样式和交互体验。关键点包括：1）前后端页码/每页数量保持一致；2）动态计算页码范围；3）分页按钮状态管理；4）表格数据异步加载。该方案实现了高效的数据分页展示和流畅的用户交互体验。
2025-05-26 21:56:38
1817
原创 修改头像功能
页面核心组件为 yellow - upload，用于图片上传，其下方有 “选择图片” 和 “上传图像” 两个按钮。通过以上步骤，我们成功实现了用户头像修改功能，包括头像回显、图片上传和头像修改，并在整个过程中进行了详细的代码编写和功能处理。头像修改：成功上传图片后，用户点击 “上传头像” 按钮，实现头像的最终修改，并更新服务器上的头像信息。从 pr 中获取用户头像的预览地址，并将其赋值给 IMGULL，使其能正确回显用户头像。头像回显：当用户进入修改头像页面时，应立即显示当前已设置的头像。
2025-05-11 14:40:28
478
原创 Thymeleaf 公共页面抽取
在 Web 项目中，通常会存在一些公共页面片段（重复代码），例如头部导航栏、侧边菜单栏和公共的 js css 等。我们一般会把这些公共页面片段抽取出来，存放在一个独立的页面中，然后再由其他页面根据需要进行引用，这样可以消除代码重复，使页面更加简洁。
2025-04-20 08:22:37
472
原创 Themeleaf复用功能
-- 定义一个简单的头部片段 --><h1>网站头部</h1></div>-- 定义一个带参数的侧边栏片段 --><h2 th:text="${title}">默认侧边栏标题</h2><ul><li>菜单项 1</li><li>菜单项 2</li></ul></div>
2025-04-13 08:08:45
572
原创 thymeleaf的基本语法
在对应的国际化属性文件中，定义如 header.address.city=城市名称 、header.address.country=国家名称 ，就可以根据不同的语言环境显示相应文字。根据表达式结果决定元素是否渲染，当表达式为 true 时，元素会显示在最终生成的页面中；用 #{} 从外部 .properties 文件获取区域文字信息，使用 Key 索引 Value，还可提供一组可选参数。相反，当表达式为 false 时，元素渲染显示；定义链接：可以指定绝对路径或相对路径，还能方便地处理 URL 参数。
2025-04-06 10:58:25
1001
原创 js高级的学习
● 定义与作用：可以将执行上下文看作是代码执行的 “环境”，它记录了代码运行时的各种状态信息，提供了代码执行的环境（包括变量、函数的声明和访问），维护代码执行的状态（如变量的值、作用域链等），并确保代码按照预期的顺序和方式执行。通过将方法和属性定义在函数的原型对象上，所有由该函数创建的实例都可以访问这些共享的成员，避免了在每个实例中重复创建相同的方法和属性，从而节省了内存空间，提高了代码的可维护性和复用性。第二次调用f()，a在3的基础上又自增为4 ，变量a的值会根据fn2的操作持续变化，且不会被释放。
2025-03-30 10:00:00
1726
原创 Es6进阶
当属性值是对象时，源对象中的对象会直接覆盖目标对象中同名的对象属性（实际上是复制引用），后续对这个对象属性内部属性的修改，会同时影响到目标对象和源对象中该属性指向的对象。● 利用 ES6 的类和继承：ES6 引入了类的概念，通过继承可以创建一个新类，该类不仅拥有自己定义的方法，还能继承父类的方法，也可以重写父类方法或添加新方法来扩展功能。● 目标对象与源对象有同名属性：当使用 Object.assign() 合并对象时，如果目标对象和源对象存在相同的属性名，源对象的属性值会覆盖目标对象的属性值。
2025-03-23 11:34:42
1126
原创 es6初步学习
没有自身的this绑定：箭头函数没有自己独立的this值，它的this是继承自外层作用域。在构造函数的机制中，this需要指向新创建的对象来添加属性，但箭头函数无法满足这一点，它的this指向是固定的，不会因为new调用而改变。不能使用arguments变量，如果在箭头函数中使用 arguments，它会引外层函数的 arguments。ES6 允许在大括号里，直接写入变量和函数，作为对象的属性和方法，书写更简洁箭头函数。箭头函数不适合与this有关的回调，事件回调，对象的方法。允许给函数参数赋值初始值。
2025-03-16 11:40:14
596
原创 第二学期第二周
比如说，我们想为我们的 runoob 项目发布一个 “1.0” 版本，我们可以用 git tag -a v1.0 命令给最新一次提交打上（HEAD） “v1.0” 的标签。-a 选项意为"创建一个带注解的标签"，不用 -a 选项也可以执行的，但它不会记录这标签是啥时候打的，谁打的，也不会让你添加个标签的注解，我们推荐一直创建带注解的标签。附注标签存储了创建者的名字、电子邮件、日期，并且可以包含标签信息。命令时，Git 会打开你的编辑器，让你写一句标签注解，就像你给提交写注解一样。或者如果在新的分支上工作。
2025-03-02 11:34:48
772
原创 第二学期第一周
页面对不同访问者的响应叫做事件。事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。实例：在元素上移动鼠标。选取单选按钮点击元素jQuery 事件方法语法在 jQuery 中，大多数 DOM 事件都有一个等效的 jQuery 方法。页面中指定一个点击事件：下一步是定义了点击后触发事件。您可以通过一个事件函数实现：// 动作触发后执行的代码!!});
2025-02-23 11:30:44
898
原创 第十周学习笔记
● 直接调用函数，其实相当于是window.函数，所以this指代window。不光可以监听整个页面资源加载完毕，也可以针对某个资源绑定load’事件。加载外部资源（如图片，外联css和js等）加载完毕时触发的事件。函数内部特殊的变量this，代表当前函数运行时所处的环境。只能得到当前的时间戳，前面两种可以返回指定时间的时间戳。触发时间时，会经过两个阶段，分别是捕获阶段和冒泡阶段。作用：弄清楚this的指向，让代码更简洁。可以返回当前时间或指定时间的时间戳。把创建的新的节点放入到指定元素内部。
2024-12-13 21:22:14
762
原创 第八周学习笔记
那么transformZ的值越接近200，就是离的越近，看上去也就越大，超过200就看不到了，因为相当于跑到后脑勺去了，你不可能看到自己的后脑勺。align-self属性允许单个项目有与其他项目不一样的对齐方式，可覆盖align-items属性，默认值为auto，表示继承父元素的align-items属性，如果没有父元素，则等同于strentch。设置子项在侧轴上的排列方式，并且只能用于子项的出现，换行的情况，在单行下无效果。该属性是控制子项在侧轴上的排列方式，在子项为单向的时候使用。
2024-12-01 11:09:04
661
原创 第七周网页制作的笔记
1. 如果指定的两个值都是方位名词，则两个值前后顺序无关，比如left top和top left效果一致。有很多的布局效果，标准流没有办法完成，此时就可以利用浮动完成布局，因为浮动可以改变元素标签默认的排列方式。概念：float属性用于创建浮动框，将其移动到一边，直到左边缘或右边缘触及包含快或另一个浮动框的边缘。继承的权重是0，该元素没有直接选中，不管父元素权重多高，子元素得到的权重都是0。设置背景颜色，背景图片，背景平铺，背景图片位置，背景图像固定等。background-color：颜色值；
2024-11-24 11:12:11
1677
原创 第六周网页制作笔记
主要使用场景：美化网页，布局页面的HTML的局限性html只关注内容的语义CSS网页的美容师css是层叠样式表的简称，又称css样式表css也是一种标记语言css主要设置html页面内的文本内容（字体，大小，对齐方式等），图片的外形以及版面的布局和外观显示样式。
2024-11-17 11:16:54
1033
原创 第五周java学习笔记
用一个对象，把基本数据类型给包起来了类后面声明时称为泛型类使用场景：当一个类中，某个变量的数据类型不确定时，就可以定义带有泛型的类创建泛型类对象必须规定类型格式：修饰符 class 类名<类型>{}//此处的E可以理解为变量，但是不是用来记录数据的，而是记录数据的类型，可以写成:T,E,K,V例子：//创建了一个object数组，这个数组将存储添加到的元素int size;//表示当前列表中实际存储的元素个数//E:表示是不确定的类型，该类型在类名后面已经定义过了e：形参的名字，变量名。
2024-11-09 15:23:13
1995
原创 第四周的java学习笔记
calendar代表了系统当前时间的日历对象，可以单独修改，获取时间中的年月日细节：calendar是一个抽象类，不能直接创建对象calendar常用方法。
2024-11-03 10:20:08
641
原创 第三周java学习笔记
类：是对象共同特征的描述对象：是真实存在的具体东西在Java中，必须先设计类，才能获得对象格式：public class类名{1，成员变量（代表属性，一般是名词）2，成员方法（代表行为，一般为动词）3，构造器4，代码块5，内部类构造方法也叫作构造器，构造函数Java.lang.String类代表字符串，java程序中的所有字符串文字（例如“abc”）都为此类对象[注意点：字符串的内容是不会发生改变的，他的对象在创建后不能更改]创建String对象的两种方式1.直接赋值。
2024-10-27 11:38:46
1638
原创 第二周Java学习笔记
1，求和的变量不能定义在循环的里面，因为变量只在所属的大括号中有效2，如果将变量定义在循环的里面，那么变量只能在本次循环中有效，本次循环结束后，变量就会消失数组指的是一种容器，可以来存储同种类型数据类型的多个值范例：int []array格式二：数据类型 数组名【】范例: int array[]方法是程序中最小的执行单元把一些代码打包在一起public static void 方法名）（）{方法体（就是打包起来的代码）；方法名（）；方法必须先定义后调用。
2024-10-20 11:41:10
963
原创 Java基础学习-第一周
case穿透：1.break（结束整个switch语句）不可省略，否则会出现case穿透，就是程序会一直执行，直到遇到break或大括号为止 （当前几项相同时，可以应用）2，反码计算规则：正数的反码不变，负数的反码在原来的及基础上，符号位（最前面的数字，1为负，0为正）不变，数值取反。boolean：占1位，有true和false2个值，一个表示真，一个表示假，一般用于表示逻辑运算。float：4个字节，单精度，声明一个小数类型，要加F或者f，建议加F。2.分类：整数，小数，字符串，字符，布尔，空。
2024-10-13 11:23:30
618
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人