- 博客(136)
- 收藏
- 关注
RSS订阅原创 reflect对象的作用是什么
写 Proxy 代理，捕获器内部优先使用同名 Reflect 方法，并且透传 receiver 参数，不要直接操作 target；不要盲目全部替换 Object 方法，高层工具（assign、keys）继续用 Object；理解 receiver，它不是目标对象，是代理对象，用来绑定访问器的 this；Reflect 只是底层操作代理，它本身不会监听、不会触发响应，它只是帮你安全执行原生逻辑。很多人把 Reflect 当成一个平平无奇的工具库，其实它是 ES6 元编程体系里的粘合剂。
2026-11-05 08:39:14
317
原创 DOM0 DOM2 级事件绑定的区别
DOM0 与 DOM2 的差异，表面是 API 写法的不同，底层是事件模型的升级。DOM0 是朴素的、简单的事件方案，满足基础交互；DOM2 建立了一套完整可控的事件流体系，现代前端所有复杂交互、事件委托、组件事件系统，全部建立在 DOM2 这套标准之上。
2026-11-05 08:34:40
275
原创 什么是渐进增强与优雅降级｜Web 弹性架构的底层思想
先面向现代环境，开发出功能完整、效果拉满的版本；再针对老旧环境、异常场景做兼容修复，让它在能力不足的环境下，“退化到可用”。起点是最佳体验，终点是保底可用。高版本优先，再向下兜底。我先把最好的版本做出来，保证新浏览器完美运行；老浏览器就算看不到动画、少一些交互，核心功能也不至于直接崩掉。先搭建一套完全可用、不依赖 CSS、不依赖 JavaScript 的基础版本；在此之上，一层层叠加样式、交互、高级特性。基础层永远独立稳定，上层只是增强体验，不是功能前提。起点是保底可用，终点是丰富体验。
2026-11-05 08:27:43
188
原创 CommonJS 和 ES Module 区别，前端模块化一次讲透
模块化是 JS 工程化的基石。和。Node.js 早期默认用 CommonJS，也就是我们熟悉的require；而 ES Module 是 ES6 官方推出的标准模块方案，使用importexport。很多初学者容易混淆：什么时候用 require？什么时候用 import？两者能不能互相混用？导出导入的值有什么差别？本篇从语法、加载机制、值引用、使用场景、底层差异逐个拆解。适合人群：刚接触工程化、学习 Node、准备面试的前端同学。老 Node 项目、后端脚本、工具脚本。
2026-11-04 08:31:51
191
原创 HTTP 状态码完整梳理：一次看懂接口返回的数字到底代表什么
前端开发对接接口的时候，控制台 Network 面板里总会出现一串数字：200、404、500、403…… 这就是 HTTP 状态码。很多新手只认识 200 和 404，遇到 401、409、502 经常分不清问题出在前端、后端还是服务器。HTTP 状态码是服务端返回给客户端的信号，用来告诉我们本次请求的结果，它一共分为 5 大类，每一类有固定的含义范围。阅读定位：适合前端初学者、正在做接口联调的同学，偏实战向，附带联调排坑思路。1xx：信息类（请求已接收，继续处理）2xx：成功类（请求成功）
2026-11-04 08:30:24
322
原创 ES6 对象字面量简写规则
写 JS 的时候，我们经常会定义对象用来承载一组相关数据。在 ES6 之前，对象字面量写法比较啰嗦，键名和变量名一样的时候也要重复写两遍；函数作为对象方法，也要完整写。ES6 为对象字面量新增了几套简写语法，属性简写、方法简写、计算属性名，日常开发高频使用，代码更简洁清爽。很多同学会混用，有时候分不清什么时候能用简写、有哪些隐性坑，本篇把规则、示例、注意点一次性整理清楚。阅读前提：掌握基础对象字面量写法，适合刚学完 JS 基础、正在学习 ES6 新特性的同学。属性简写。
2026-11-04 08:26:59
172
原创 第三篇：批量提交、分支操作、方案对比、生产落地避坑
前面两篇已经完成了基础能力：拉取单文件、新增 / 修改推送、删除文件。但是真实业务往往有更多需求：一次性提交多个文件、查看分支列表、切换分支。同时我们要客观看清这套方案的短板，搞明白什么时候适合用这套 “无 Git 组件” 方案，什么时候必须老老实实使用 Git。
2026-11-03 20:14:02
156
原创 第二篇：文件新增 & 修改推送（commit 提交），冲突处理
上一篇我们实现了【拉取】：读取远端仓库文件、拿到文件 sha 哈希。本篇实现核心能力：推送。这里的推送，对应 Git 里的，在 API 体系里是：提交文件变更直接推送到远端分支，没有本地暂存区概念。再次强调：这套方案和标准 Git 工作流不一样。没有工作区、暂存区，每一次请求就是一次提交，直接提交到远程仓库。
2026-11-03 20:13:13
195
原创 不依赖 Git 组件，原生 JS 实现仓库拉取、推送等操作
很多业务场景会遇到一个痛点：环境不能部署 Git、不能执行 shell 命令、也不能引入这类 Git 组件库。比如一些封闭的后台系统、在线预览平台、沙箱环境，我们只想做到：读取远程仓库里的文件列表、拿到文件内容，而不是完整跑一套 Git。很多人第一反应：Git 操作必须要有 Git 环境或者 Git JS 库？其实不是。Gitee、GitHub 都开放了 REST HTTP 接口，我们可以直接发网络请求和仓库服务通信。。适合场景：在线读取配置文件、在线编辑单文件提交、简单文档托管；
2026-11-03 20:12:07
172
原创 JavaScript 异步流程为什么容易失控？从回调到可维护设计
异步代码难维护，根源往往不是 API 本身，而是流程边界不清。把串行、并行、错误处理和竞态控制设计清楚，异步代码同样可以稳定、可读、可测试。语法让表达更简洁，设计让行为更可靠。两者结合，异步流程才不会失控。
2026-10-25 18:45:19
193
原创 JavaScript 中 this 指向为什么总在变？
this 并不神秘，它反映的是调用上下文。掌握 this 的关键是区分定义位置和调用方式。减少隐式上下文依赖，让数据传递更显式，往往比记忆复杂规则更有效。当代码不再过度依赖 this 时，上下文问题自然减少，可读性和可维护性也会提升。
2026-10-25 18:44:46
177
原创 JavaScript 闭包很好用，但为什么容易带来内存问题？
闭包是 JavaScript 的强大能力，不是内存泄漏的代名词。真正需要关注的是引用关系和生命周期。闭包让引用关系更灵活，也让引用关系更隐蔽。只要在设计和清理阶段保持明确，理解哪些对象被谁持有、持有到什么时候，闭包完全可以既优雅又安全。与其害怕闭包，不如建立清晰的生命周期管理习惯。
2026-10-25 18:44:16
280
原创 ES6 Set 核心特点 + 最简数组去重
Set 是 ES6 提供的无序、不重复的集合数据结构，允许存储任意类型的数据，核心特性是自动剔除重复元素。
2026-09-17 08:00:00
280
原创 ES6 扩展运算符
扩展运算符（...）可以将「可迭代对象」（数组、字符串、Set、Map 等）展开为一串独立的值。拆包，把[1,2,3]拆成1 2 3只能浅拷贝、只展开第一层。
2026-09-16 08:00:00
182
原创 ES6 数组解构赋值
数组解构赋值是 ES6 新增语法，允许按照数组的位置顺序，通过模式匹配，快速从数组中提取值，批量赋值给一组变量。按位置匹配、顺序一一对应。数组解构：看下标、看顺序对象解构：看属性名、不看顺序按数组位置、下标顺序匹配，和变量名无关；支持按需取值、跳过元素、设置默认值、剩余参数收集；简化代码，告别繁琐的数组下标取值，代码更简洁优雅；可实现无临时变量交换数值，开发、面试高频使用。
2026-09-15 18:09:24
150
原创 const 声明的数组/对象，为什么能修改内部内容？
const 的核心：禁止变量重新赋值，不禁止修改内部数据；基本类型：值和变量绑定，const 声明后完全不可改；引用类型：变量存地址，数据存堆内存，地址不变就合法；想要彻底冻结对象/数组，需使用。
2026-09-14 19:07:28
100
原创 HTML元素小卖部：表单元素 vs 表格元素选购指南
普通按钮</button><label for="username">用户名：</label><button type="submit">提交</button><button type="reset">重置
2026-09-11 08:00:00
187
原创 图片格式三剑客：JPG、PNG、GIF到底怎么选？
下次保存图片时，记住这个简单的选择策略：先看用途，再看特性，最后比体积。就像给不同场合搭配合适的衣服，给图片找到最合适的"格式外衣"，让你的网页加载更快、设计更精致！手机拍摄原图 JPG HEIF（苹果） PNG。GIF：帧数≤15，尺寸≤500px（防止加载卡顿）JPG：质量调到60-80%（肉眼无差，体积减半）PNG：简单图标用PNG-8（256色足够）1. JPG（JPEG） → 照片专业户。要照片 → 选JPG（体积小加载快）要透明 → 选PNG（高清无白边）
2026-09-10 08:00:00
211
原创 那些难以维护、逻辑混乱或违反最佳实践的代码
表格布局 - 禁用<table>布局，使用Flex/Grid。eval()危险操作 → 严格使用JSON.parse()样式/脚本混写 - 严禁在HTML中内嵌CSS/JS代码。回调地狱 → Promise/async-await重构。嵌套地狱 - 过度使用无意义<div>，改用语义化标签。改进：分离结构、样式和行为（CSS 和 JS 文件）。（然后默默按下了Ctrl+S）”v-if/v-for混用 → 优先计算属性过滤。JS拼接HTML → 采用模板引擎。CSS模拟逻辑 → JS控制交互。
2026-09-09 08:00:00
163
原创 第二个小练习总结
判断 small 是否是 3 的倍数，若为 3 的倍数，则进一步判断花费的总金额是否为 100 元（即 i * 5 + j * 3 + small / 3 === 100）。判断 small 是否为偶数，若为偶数，则进一步判断驮的粮食总数是否为 100 石（即 big * 2 + centre * 1 + small / 2 === 100）。大马驮2石粮食，中马驮1石粮食，两头小马驮1石粮食，要用100匹马，驮100石粮食，求所有分配方案？// 检查小马数量是否为偶数，因为两头小马驮 1 石粮食。
2026-09-08 08:17:27
147
原创 数组练习题总结
首先写一个数组，里边写一些数字，然后写一个for循环，再写一层for循环，在最里面的for循环里写一个if判断，判断arr的j下标内容是否大于j+1，当符合这个条件，然后let一个num的变量等于arr的j下标内容，然后arr的j下标等于j+1，最后让num等于j+1。首先生成一个数组，里面写一些数字，然后再设一个num变量，接着再设一个平均值的，变量为零，接着写一个for循环，在循环里，让num变量+=arr下标i的内容，后在循环外让平均值等于num变量，除以数组的长度。
2026-09-07 16:21:28
192
原创 相对路径与绝对路径：你需要知道的区别
因为在 Web 服务器上，网站的根目录是相对固定的，使用相对路径可以方便地在项目内部进行文件引用，并且当网站的部署位置发生变化时，只要整个项目的相对结构不变，文件引用就不会出错。在编写脚本或程序时，如果需要访问系统中固定位置的文件，如操作系统的配置文件、特定的系统库文件等，使用绝对路径可以保证程序在不同的运行环境中都能正确地找到所需文件。如果文件或目录的位置发生变化，或者整个文件系统的结构进行了调整，那么所有使用绝对路径的地方都需要进行修改，这在大型项目中可能会带来较大的工作量。
2026-09-07 16:20:41
210
原创 流程控制语句练习题总结（二）
判断 small 是否为偶数，若为偶数，则进一步判断驮的粮食总数是否为 100 石（即 big * 2 + centre * 1 + small / 2 === 100）。判断 small 是否是 3 的倍数，若为 3 的倍数，则进一步判断花费的总金额是否为 100 元（即 i * 5 + j * 3 + small / 3 === 100）。// 大马驮2石粮食，中马驮1石粮食，两头小马驮1石粮食，要用100匹马，驮100石粮食，求所有分配方案？// 检查小马数量是否为偶数，因为两头小马驮 1 石粮食。
2026-09-07 16:20:01
173
原创 流程控制语句练习题总结
首先写一个数组，里边写一些数字，然后写一个for循环，再写一层for循环，在最里面的for循环里写一个if判断，判断arr的j下标内容是否大于j+1，当符合这个条件，然后let一个num的变量等于arr的j下标内容（临时存储一下这个下标的内容），然后arr的j下标等于j+1，最后让num等于j+1，等于是j与j+1调换了位置。首先设置一个数组，里边写一些数字，然后再写一个空数组，接着写一个for循环，在循环里写一个if判断，判断arr的下标i除以二余的数是否不等于零（也就是判断是否为奇数）。
2026-09-07 16:19:07
172
原创 JavaScript 中的定时器与动画基础
例如，可以使用 setInterval 来每隔一定的时间改变一个元素的位置，从而实现移动效果。它接受两个参数，第一个参数是要执行的函数，第二个参数是时间间隔的毫秒数。它也接受两个参数，第一个参数是要执行的函数，第二个参数是延迟的毫秒数。setInterval 和 setTimeout 都是 JavaScript 中的定时器函数，用于在一定的时间间隔后执行函数。上述示例代码会先延迟两秒后开始淡入动画，然后再延迟两秒后开始淡出动画，从而实现一个简单的淡入淡出动画效果。
2026-09-07 16:18:00
156
原创 Ajax中get和post的区别
GET请求数据可见于URL和服务器日志，不适合敏感信息。POST请求数据在请求体中，相对更安全，但仍需HTTPS加密。GET请求有长度限制（通常约2048字符），受浏览器和服务器限制。POST请求理论上没有大小限制，适合传输大量数据。POST请求是非幂等的，每次请求可能产生不同结果（如提交订单）。GET请求会被浏览器缓存，可能保留在历史记录中。POST请求不会被缓存，也不会保存在浏览器历史中。POST适用于创建/修改数据（提交表单、上传文件等）。GET请求将数据附加在URL末尾，以查询字符串形式发送。
2026-09-06 17:48:11
157
原创 什么是promise
其核心思想是将异步操作的结果（成功或失败）封装为一个对象，允许以链式调用的方式处理后续逻辑，避免回调地狱（Callback Hell）。错误处理：未捕获的Rejected Promise可能导致静默失败，建议始终使用catch或then的第二个参数。状态隔离：每次调用then会返回一个新的Promise，确保链式调用的独立性。resolve("操作成功的结果");
2026-09-06 17:47:34
210
原创 json中对象转字符串和字符串转对象的方法
在JavaScript中，处理JSON数据时经常需要在对象和字符串之间进行转换。使用JSON.stringify()方法将JavaScript对象转换为JSON字符串格式。以上方法适用于大多数JavaScript环境，包括浏览器 和Node.js。// 输出: {"name":"John","age":30}使用JSON.parse()方法将符合JSON格式的字符串转换为JavaScript对象。console.error("解析失败:", error);// 读取文件并解析为对象。// 修改后写回文件。
2026-09-06 17:46:28
210
原创 如何用rgba、十六进制表达白色、黑色、红色、绿色、蓝色？
白色：（255，255，255）红色：（255，0，0）绿色：（0，255，0）蓝色:（0，0，255）黑色：（0，0，0）白色：#FFFFFF。黑色：#000000。红色：#FF0000。绿色：#00FF00。蓝色：#0000FF。
2026-09-06 17:45:47
182
原创 split和join的区别
print(result)，输出：['Hello', 'World', 'Python']使用逗号连接列表中的元素：lst = ['apple', 'banana', 'orange'];print(result)，输出：['apple', 'banana', 'orange']使用空字符串连接列表中的元素：lst = ['H', 'e', 'l', 'l', 'o'];print(result)，输出：['Hello', 'World']
2026-09-06 17:44:10
211
原创 深入理解 JavaScript 的 typeof 运算符：返回的数据类型
这一行为源于 JavaScript 最初版本（1995 年）的实现细节：值类型标签存储在一个 32 位单元中，null 的二进制表示（全零）被错误地识别为对象类型标签（类型 0）。"object" 对象、数组、null 和日期对象 typeof {}, typeof null。typeof nonExistentVariable // "undefined"（未声明的变量不报错）// "object"（历史性缺陷）"string" 字符串 typeof "hello"
2026-08-31 19:37:49
163
原创 js树形菜单功能总结
对于每个节点，如果存在子节点，则创建一个可展开 / 收起的标题元素，并递归调用renders函数渲染子节点；在循环遍历数据过程中，筛选出父节点 ID 与传入的pid相同的节点，将其添加到结果数组result中，并递归调用buildmenu函数，将子节点构建为树形结构，赋值给当前节点的child属性。该函数接收一个 DOM 元素（标题元素）作为参数，获取其下一个兄弟元素（即子节点容器），根据子节点容器的显示状态切换 其display属性，从而实现展开与收起效果。有了树形数据后，需要将其渲染到页面上。
2026-08-31 19:36:53
177
原创 分页功能总结
在页面底部的 <div> 元素（类 名为 footer）中，包含了显示总页码的区域（total_page）、选择每页显示条数的下拉菜单、左右翻页按钮（pageing）、页码按钮区域（num_page）以及用于快速跳转的输入框。各个分页相关的元素，如翻页按钮（pageing）、页码按钮（page）等，都设置了相应的尺寸、边框、背景颜色 等样式。遍历当前页的数据，生成包含序号、名字、性别等信息的表格行 HTML 字符串，并将其赋值给 <tbody> 的 innerHTML，实现数据的展示。
2026-08-31 19:35:48
180
原创 axios的post请求，数据为什么要用qs处理？什么时候不用？
但某些后端接口（尤其是传统表单提交）要求数据以 application/x-www-form-urlencoded 格式传输，此时需要使用 qs 库将对象转换为 URL 编码的字符串。数组或嵌套对象需确认后端解析规则，qs 可通过配置调整序列化方式（如 qs.stringify({ arr: [1,2] }, { indices: false }) 生成 arr=1&arr=2）。// 发送数据：{"user":{"name":"John"}}// 发送数据：user%5Bname%5D=John。
2026-08-31 19:32:08
211
原创 JavaScript 中会被转换为 false 的值详解
除了上述会被转换为false的值，其他所有值在布尔上下文中都会被转换为true，包括非零数值、非空字符串、对象、函数等。""（空字符串）：当字符串为空，即不包含任何字符时，它在布尔判断中为false。undefined：作为变量未赋值的默认状态，undefined在布尔上下文中同样为false，常见于检查函数返回值是否有效等场景：。0（数字零）：在 JavaScript 中，数值0在布尔上下文中会被转换为false，常用于循环终止条件、计数器判断等场景。它在布尔判断中也会被转换为false：。
2026-08-26 18:24:34
193
原创 JavaScript 中 undefined 和 not defined 的区别详解
此外，当访问对象中不存在的属性，或调用没有返回值的函数时，也会得到undefined。而not defined并不是一个值，也不属于任何数据类型，它是 JavaScript 引擎在运行时遇到无法识别的变量或标识符时抛出的一种错误提示，表示该变量在当前作用域内从未被声明过。undefined的存在不会导致程序报错，它是 JavaScript 中正常的运行结果，可以在条件判断等场景中被合理使用。// 输出: NaN，因为b的值为undefined，undefined参与数学运算结果为NaN。
2026-08-22 20:29:27
183
原创 JavaScript 中 null 和 undefined 的区别详解
从数据类型角度来看，null虽然代表 “空值”，但typeof null的结果是"object" ，这是 JavaScript 早期设计遗留的一个历史问题。null是一个表示 “空值” 的对象，它是人为赋值的，通常用来表示一个变量有意指向 “空” 的状态，即预期这个变量会指向一个对象，但目前没有指向任何对象。// 输出: true，因为undefined == null会返回true。若要同时判断null和undefined，可以使用==（注意，==会进行类型转换），或者更严谨地分别判断：。
2026-08-22 20:28:40
201
原创 axios的post请求，数据为什么要用qs处理？什么时候不用？
但某些后端接口（尤其是传统表单提交）要求数据以 application/x-www-form-urlencoded 格式传输，此时需要使用 qs 库将对象转换为 URL 编码的字符串。数组或嵌套对象需确认后端解析规则，qs 可通过配置调整序列化方式（如 qs.stringify({ arr: [1,2] }, { indices: false }) 生成 arr=1&arr=2）。// 发送数据：{"user":{"name":"John"}}// 发送数据：user%5Bname%5D=John。
2026-08-21 19:55:04
199
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人