- 博客(49)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 flutter专栏--组件的状态管理
Flutter状态管理方法总结：组件状态可由自身、父组件或混合管理。用户数据状态建议由父组件管理，界面效果状态由组件自身管理，共享状态由共同父组件管理。文中通过TapboxA（自身管理状态）、TapboxB（父组件管理）和TapboxC（混合管理）三个示例，展示了不同状态管理方式的实现。当不确定时，推荐优先采用父组件管理状态以获得更大灵活性。
2025-10-11 22:45:40
931
原创 在css里优雅地使用if函数
CSS if() 函数从 Chrome 137 开始支持，为开发者提供了更优雅的条件样式处理方案。该函数通过条件-值对结构实现三类查询：内联媒体查询（如适配不同设备指针精度）、内联支持查询（优雅降级处理浏览器兼容性）和基于状态的样式（根据元素属性动态调整）。相比传统媒体查询或JS方案，if() 能直接在属性声明中实现条件逻辑，简化代码结构。目前该特性兼容性有限，仅支持 Chrome 137+ 浏览器。这一创新将显著提升组件开发和响应式设计的代码可维护性。
2025-10-11 21:40:16
729
原创 flutter专栏--深入了解widget原理
Flutter采用"一切皆Widget"的设计理念，将UI元素、布局结构、交互功能等都抽象为不可变的Widget配置单元。Widget作为轻量级的界面描述，通过嵌套组合形成树状结构，其底层实现基于三棵树机制：Widget树生成Element树，再转化为RenderObject树完成布局渲染。StatelessWidget作为基础组件类型，通过build方法组合其他Widget构建静态界面。Flutter通过这种声明式UI架构，实现了高效的界面更新和渲染流程。
2025-10-05 13:41:49
982
原创 js技巧--使用AbortController控制代码的异步行为
AbortController是用于中止Web请求的控制器接口，可通过构造函数创建实例，其signal属性返回AbortSignal对象用于通信。主要方法abort()可中止未完成的异步操作，如fetch请求。应用场景包括：1）取消fetch网络请求；2）创建可中止的WebSocket连接；3）统一管理事件监听器的移除。通过signal参数传递，可实现方便的请求中止和事件监听管理，避免内存泄漏。该API为原生fetch提供了取消能力，简化了异步操作的控制流程。
2025-09-07 20:39:44
356
原创 腾讯工程师来告诉你秋招算法要怎么学
本文探讨了互联网技术面试中算法能力的重要性及提升方法。文章指出，大厂面试普遍重视算法考察，如字节前端校招需掌握150-200道算法题。作者建议：1.建立完整的算法知识图谱；2.掌握明确解题思路，如动态规划的基本解法；3.循序渐进学习，从基础题过渡到复杂问题。文章强调算法需要系统训练，建议"剑气双修"（算法+工程能力）才能成为优秀开发者，并提供了具体的学习路径。最后作者以腾讯前端工程师身份邀请读者关注共同提升算法能力。
2025-09-06 16:16:32
413
1
原创 flutter专栏--深入剖析你的第一个flutter应用
本文介绍了使用fvm管理Flutter版本和创建第一个Flutter应用的完整流程。首先详细说明了fvm的安装和使用方法，包括多版本切换技巧。随后通过创建test_app项目，分析了项目目录结构，重点解读了pubspec.yaml配置文件的关键字段含义。最后剖析了lib/main.dart入口文件的核心代码结构，展示了Flutter应用的初始界面和简单计数器功能实现。文章为Flutter初学者提供了从环境配置到项目创建的完整指南。
2025-09-03 18:46:03
1096
原创 从“切图仔”到“架构师”：前端开发二十年的演进与自我超越
摘要：前端开发经历了从静态页面构建到复杂应用工程的演变过程。早期以HTML、CSS和JavaScript为基础，随后jQuery和Ajax推动动态交互发展。2010年后，AngularJS、React和Vue等框架兴起，工程化工具如Webpack和Node.js出现，前端开发进入现代化阶段。近年来，ES6、TypeScript、跨端框架和小程序等创新技术进一步扩展了前端的边界，使其成为驱动多端体验的重要领域。
2025-08-31 19:11:35
560
原创 高频面试题： http协议的详解
HTTP协议是位于OSI模型应用层的超文本传输协议，用于客户端与服务器之间的通信。它采用经典的请求/响应模型，通过TCP连接（默认端口80）实现无状态通信。HTTP请求包含请求行、头部、空行和数据；响应包含状态行、头部、空行和正文。常见请求方法有GET、POST、PUT等，状态码表示请求结果。HTTP工作流程包括建立TCP连接、发送请求、服务器响应、释放连接和客户端解析内容。该协议是Web通信的基础，支持浏览器与服务器之间的数据传输。
2025-08-31 15:54:51
945
原创 flutter专栏--dart基础知识
本文介绍了Dart语言的变量声明和函数相关特性。在变量声明方面，详细说明了var、dynamic、Object、final和const的区别与使用场景，强调了类型推断和空安全机制。在函数部分，讲解了函数声明方法、作为变量传递、可选参数（位置参数和命名参数）等语法特性，特别指出Dart函数的返回值默认为dynamic类型而非推断类型。文章通过丰富的代码示例，展示了Dart语言在这些方面的灵活性和类型安全性，为开发者提供了清晰的语法指导。
2025-08-26 21:48:56
836
原创 flutter专栏--移动开发技术的发展与flutter的概要
本文介绍了Flutter跨端开发技术的优势与特点。首先对比了原生开发与常见跨端技术（Hybrid、JS+原生渲染、自绘引擎）的优缺点，指出各自在性能、开发效率和动态化方面的差异。重点分析了Flutter的核心优势：采用自绘引擎保证UI一致性，基于Dart语言实现高性能渲染，支持JIT快速开发和AOT发布优化。文章还阐述了Flutter的三层架构（框架层、引擎层、嵌入层），说明其如何通过Skia渲染引擎实现跨平台高性能UI绘制。Flutter通过技术创新解决了传统跨端方案在性能、开发效率和平台一致性方面的痛点
2025-08-07 20:51:09
733
原创 二十天刷leetcode【hot100】算法- day2[算法python]
二十天刷leetcode【hot100】算法- day2[算法python]-前端最全刷题指南！三数之和，最接近的两数和，接雨水，无重读字符串的最长子串，找到字符串中所有字母异位词
2024-09-15 16:34:53
1000
原创 二十天刷leetcode【hot100】算法- day2[后端golang]
二十天刷leetcode【hot100】算法- day2[后端golang]-前端最全刷题指南！三数之和，最接近的两数和，接雨水，无重读字符串的最长子串，找到字符串中所有字母异位词
2024-09-15 16:27:01
1225
原创 二十天刷leetcode【hot100】算法- day2[前端javascript]
二十天刷leetcode【hot100】算法- day2[前端javascript]-前端最全刷题指南！三数之和，最接近的两数和，接雨水，无重读字符串的最长子串，找到字符串中所有字母异位词
2024-09-15 16:17:34
808
原创 二十天刷leetcode【hot100】算法- day2[前端Typescript]
二十天刷leetcode【hot100】算法- day2[前端typescript]-前端最全刷题指南！三数之和，最接近的两数和，接雨水，无重读字符串的最长子串，找到字符串中所有字母异位词
2024-08-17 22:33:05
430
原创 二十天刷leetcode【hot100】算法- day1[算法python]
二十天刷leetcode【hot100】算法- day1[算法python]-后端最全刷题指南！两数之和，字母异位词分组，最长连续序列，移动零，盛水最多的容器
2024-08-03 21:15:26
942
1
原创 二十天刷leetcode【hot100】算法- day1[后端golang]
二十天刷leetcode【hot100】算法- day1[后端golang]-后端最全刷题指南！两数之和，字母异位词分组，最长连续序列，移动零，盛水最多的容器
2024-08-03 21:12:00
1056
原创 二十天刷leetcode【hot100】算法- day1[前端javascript]
二十天刷leetcode【hot100】算法- day1[前端javascript]-前端最全刷题指南！两数之和，字母异位词分组，最长连续序列，移动零，盛水最多的容器
2024-08-03 21:07:43
711
原创 二十天刷leetcode【hot100】算法- day1[前端Typescript]
二十天刷leetcode【hot100】算法- day1[前端typescript]-前端最全刷题指南！两数之和，字母异位词分组，最长连续序列，移动零，盛水最多的容器
2024-08-03 19:02:03
1120
原创 一文读懂微前端
微前端架构，关键技术pnpm，monorepo，webcomponets，EMP，Single-Spa，无界，micro-app，qiankun
2023-11-12 15:45:42
546
原创 前端算法-数组篇(四)-序数组的平方
那么数组平方的最大值就在数组的两端，不是最左边就是最右边，不可能是中间。定义一个新数组result，和A数组一样的大小，让k指向result数组终止位置。如果A[i] * A[i] >= A[j] * A[j] 那么result[k–] = A[i] * A[i];给你一个按 非递减顺序 排序的整数数组 nums，返回 每个数字的平方 组成的新数组，要求也按 非递减顺序 排序。如果A[i] * A[i] < A[j] * A[j] 那么result[k–] = A[j] * A[j];
2023-03-29 22:30:18
181
原创 前端算法-数组篇(三)-移除元素
给你一个数组 nums 和一个值 val，你需要 原地 移除所有数值等于 val 的元素，并返回移除后数组的新长度。不要使用额外的数组空间，你必须仅使用 O(1) 额外空间并 原地 修改输入数组。元素的顺序可以改变。你不需要考虑数组中超出新长度后面的元素。两层for循环，一个for循环遍历数组元素 ，第二个for循环更新数组。时间复杂度是O(n^2)。时间复杂度：O(n)，空间复杂度：O(1)
2023-03-28 21:48:08
325
原创 前端算法-数组篇(二)-二分查找
给定一个 n 个元素有序的（升序）整型数组 nums 和一个目标值 target ，写一个函数搜索 nums 中的 target，如果目标值存在返回下标，否则返回 -1。二分法，区间的定义一般为两种，左闭右闭即[left, right]，或者左闭右开即[left, right)。
2023-02-25 17:27:57
224
原创 前端算法-数组篇(一)
数组是存放在连续内存空间上的相同类型数据的集合。数组下标都是从0开始的。数组内存空间的地址是连续的因为数组的在内存空间的地址是连续的，所以我们在删除或者增添元素的时候，就难免要移动其他元素的地址。数组的元素是不能删的，只能覆盖。注：因为JS数组可以存储类型完全不一样的数据，这就意味着，JS 数组中内存地址不是连续的。不过，现在的 JS 引擎为了优化 JS 的性能，它会分配一个连续的内存空间给存储了相同数据类型的数组，以达到更好的遍历效果。
2023-02-25 16:56:10
126
原创 leetcode-快排找第K大元素(JS)
快速排序，找到第 K 个最大元素每进行一次快速排序的 partFun操作，就能找到这次我们选中的基准值排序之后的正确位置。如果它的位置刚好是排序之后第 K 个最大元素的位置，即 length - k，我们直接得到了答案；因为进行 partition 操作之后，位于基准值之前的元素都要小于基准值，位于基准值之后的元素都要大于等于基准值。如果它的位置小于排序之后第 K 个最大元素的位置，我们就去它之后寻找第 K 个最大元素；如果它的位置大于排序之后第 K 个最大元素的位置，我们就去它之前寻找第 K
2022-03-31 21:42:20
374
原创 JS中Map的遍历
1.forEach遍历const map = new Map([['key1','v1'],['key2','v2'],['key3','v3']]);console.log(map);map.forEach((val,key) => { console.log(val,key);})/**v1 key1v2 key2v3 key3 */先输出value，再输出keyfor…of…for(let i of map) { console.log(i);}/**[
2022-03-28 14:44:36
18895
1
原创 双飞燕布局、圣杯布局、flex布局实现三列布局（两边固定中间自适应）
1.圣杯布局主要：浮动 + margin-left + 相对定位写一个大容器container,里面包含了middle,left和right,middle放在前面container下面的三个容器浮动，且写上高度200px给middle宽度写上100%，此时left和right被挤到第二行，给left,right设置宽度200px给left的margin-left设置为-100%，此时left回到第一行左边,right回到第二行左边给right的margin-right设置-200px，此时ri
2022-02-28 18:10:51
3472
原创 JS常见类型和判断
JS常见类型和判断1.常见的7种类型1.null2.undefined3.boolean4.number5.string6.引用类型7.symbol2.判断相等1.typeof(两个特殊)console.log(typeof null); //objectconsole.log(typeof []); //object2.instanceof(只适合判断object类型)const a1 = [];const a2 = function() {}c
2022-02-20 22:14:28
375
原创 JS事件循环
概括javaScript是单线程的，在执行代码时只能按顺序执行，为了解决代码执行时的阻塞，所以js是异步的，比如在遇到setTimeout时，不会定时器内容执行过后，再去执行之后的代码，而是先执行代码，等时间到后再去执行定时器。基于这种异步的机制，javaScript有着一套自己执行代码的规则，来保证代码能够高效无阻塞的运行，这种规则就是事件循环。node和浏览器都给js提供了运行的环境，但是二者的运行机制是稍有差异的。浏览器：执行代码时，会产生执行上下文，包括作用域、当前作用域中的变量、上层作用
2022-02-20 22:12:00
227
原创 JSthis指向问题大全(普通函数，箭头函数，匿名函数)
结论普通函数中this指向函数的对象箭头函数中的this指向该函数所在作用域指向的对象关于作用域是什么，可以自行Google一下，后面会用例子说明1.普通函数代码：function test(){ var a = 1; console.log(this.a);}test(); //undefined由于test函数是直接在外层函数运行的，所以test是被window对象调用的，所以这里的 this.a 对应的应该是全局变量而不是test函数里的局部变量，故输出unde
2022-02-11 20:05:09
1292
原创 前端截取视频第一帧作为封面
概述1.做项目的时候突然想截取视频第一帧，作为视频的封面，然后搜了很多博客都发现得到空白的图片，最后得到了解决。2.方法：通过创建canvas标签，利用其drawImage() 方法在画布上绘制该视频，然后运用toDataURL方法转换canvas上的图片为base64格式，并将base64格式的图片作为video标签的poster属性。3.浏览器：chrome代码关键video.currentTime = 1 currentTime 属性设置或返回视频播放的当前位置（以秒计）。当设置该属性时
2022-01-30 13:15:37
7516
原创 JS常用的时间处理函数
1.求距离某个日期n天后的日期function a1(dayStr,nums) { let t1 = new Date(dayStr); console.log(t1); let t2 = new Date((t1/1000 + 86400*nums)*1000); console.log(t2); var t3 = t2.getFullYear() + '-' + (t2.getMonth() + 1) + '-' + t2.getDate(); cons
2021-10-30 17:07:58
289
原创 [已解决]webpack 5以上版本使用webpack-dev-server时报错
在webpack5以上版本使用webpack-dev-server时报错1.报错运行npm run dev时报错Error: Cannot find module 'webpack-cli/bin/config-yargs'2.原因分析webpack-cli的新版本对webpack-dev-server版本的不兼容查看版本这里webpack和webpack-cli的版本都过高了3.解决办法3.1后退webpack-cli版本(较麻烦没验证过)后退到3.3.12，即先uninstall
2021-08-13 21:29:33
962
原创 JS数组常用的方法shift,unshift,splice,split,slice
JS数组常用的方法1.pushpush() 方法可向数组的末尾添加一个或多个元素，并返回新的长度。2.poppop() 方法用于删除并返回数组的最后一个元素。3.shiftshift() 方法用于把数组的第一个元素从其中删除，并返回第一个元素的值。4.unshiftunshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度。5.sortsort() 方法用于对数组的元素进行排序。6.reverereverse() 方法用于颠倒数组中元素的顺序。1到6代码演示
2021-08-11 21:47:42
8958
原创 前端LOGO SEO优化
前端LOGO SEO优化步骤logo的div内放一个h1标签，目的是为了提权h1里面放一个链接，点击链接可以返回首页在链接里面放相应的文字，但文字要隐藏font-size: 0;/*方法1*/text-indent:-9999px;overflow:hidden;/*方法二*/代码展示<!-- logo模块 --> <div class="logo"> <h1> <a h
2021-07-13 09:51:13
275
原创 机器学习线性回归概述
概念线性回归是利用数理统计中回归分析，来确定两种或两种以上变量间相互依赖的定量关系的一种统计分析方法，运用十分广泛。其表达形式为y = w’x+e，e为误差服从均值为0的正态分布。回归分析中，只包括一个自变量和一个因变量，且二者的关系可用一条直线近似表示，这种回归分析称为一元线性回归分析。如果回归分析中包括两个或两个以上的自变量，且因变量和自变量之间是线性关系，则称为多元线性回归分析。实例下图为一元线性回归，它是模拟出一条直线，让已知的数据点尽量落在直线上或直线周围。用公式表示为：f(x)=wx+
2020-11-28 12:17:29
325
航空客运订票系统.cpp
2020-04-22
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人