- 博客(67)
- 收藏
- 关注
RSS订阅原创 JavaScript 原型与原型链：深入理解 __proto__ 和 prototype 的由来与关系
JavaScript 没有类，而是通过构造函数和原型模拟类的行为。prototype是函数特有的属性，用于定义共享的属性和方法。__proto__是对象特有的属性，用于构建原型链。原型链是 JavaScript 实现继承的机制，通过__proto__向上查找属性和方法。new关键字通过构造函数创建对象，并建立原型链关系。理解原型和原型链是掌握 JavaScript 面向对象编程的关键。虽然 ES6 引入了class语法，但其底层仍然是基于原型的实现。
2025-06-06 19:56:46
695
原创 理解JavaScript中map和parseInt的陷阱：一个常见的面试题解析
前言 在JavaScript面试中，map和parseInt的组合常常被用作考察候选人对这两个方法理解深度的题目。让我们通过一个简单的例子来深入探讨其中的原理。
2025-06-06 19:35:54
703
原创 JavaScript类型转换的黑暗艺术：从入门到怀疑人生的完整指南
JavaScript数据类型转换详解：本文全面解析了JavaScript中的显式和隐式类型转换机制。介绍了7种原始类型和Object类型，详细讲解了String()、Number()、Boolean()等显式转换方法，以及算术、比较运算符中的隐式转换规则。特别探讨了对象到原始值的复杂转换过程，包括valueOf()和toString()方法的作用，并通过Date、数组等特殊案例展示转换特性。文章最后给出最佳实践建议，强调使用严格相等(===)和明确转换意图的重要性，并提及ES6+新增的BigInt和Symb
2025-06-04 22:46:37
665
原创 [特殊字符] Symbol：JavaScript中的“唯一ID“黑科技，这些用法你都知道吗？
摘要：Symbol是ES6引入的原始数据类型，具有唯一性、不可变性特点。每个Symbol值都是独一无二的，即使描述相同。它可作为对象属性键，避免命名冲突，并模拟私有属性。Symbol常用于创建枚举类型、扩展第三方对象及元编程（如Symbol.iterator）。注意Symbol不能自动转为字符串，但可显式转换，且不会被JSON.stringify序列化。Symbol为JavaScript提供了创建唯一值的能力，有助于编写更健壮、可维护的代码。 （共148字）
2025-06-03 23:54:45
603
原创 前端必杀技！CSS居中方案全图谱
摘要：本文全面介绍了CSS实现元素居中的多种方法，包括水平居中、垂直居中以及完全居中的解决方案。涵盖了传统方法（如text-align、margin-auto）、现代布局技术（Flexbox、Grid）和特殊场景处理（绝对定位、视口居中）。文章对比了各方法的优缺点，提供了最佳实践建议和常见问题解答，帮助开发者根据项目需求选择最适合的居中方案。Flexbox和Grid因其简洁高效成为现代布局的首选，但传统方法在特定场景和旧浏览器支持中仍有价值。
2025-06-02 22:23:11
830
原创 告别浮动！Flexbox弹性布局终极指南
本文全面介绍了CSS3的Flexbox弹性盒子布局技术。首先阐述了Flexbox的核心优势：简化复杂布局、响应式设计、方向无关性等。然后详细讲解了Flex容器和项目的概念，分别解析了6个容器属性（如flex-direction、justify-content）和6个项目属性（如order、flex-grow）。通过垂直居中、响应式导航栏等实际示例展示了Flexbox的应用场景，并提供了渐进增强、避免过度嵌套等最佳实践建议。最后指出Flexbox在现代浏览器中具有良好的兼容性，建议与CSS Grid结合使用构
2025-06-01 22:29:07
939
原创 JavaScript 中的 BigInt：当普通数字不够“大“时的救星
JavaScript中的BigInt是ES2020引入的新数据类型，用于解决Number类型在处理大整数时的精度丢失问题。文章介绍了BigInt的创建方法（数字后加n或使用BigInt函数）、基本运算规则，以及使用时的重要注意事项：不能与Number直接混用、没有小数部分、不能使用Math对象方法等。BigInt适用于处理大整数ID、加密算法和高精度计算等场景，但性能比普通Number差。文章还展示了用BigInt计算斐波那契数列等实用技巧，强调应根据实际需求合理选择数据类型。
2025-05-29 22:54:58
951
原创 为什么大厂前端都爱BEM？从WEUI代码中学习高可维护CSS的终极答案
本文通过分析微信官方UI库WEUI的代码，探讨了BEM命名规范在前端开发中的应用。BEM(Block-Element-Modifier)通过块、元素和修饰符的结构化命名，解决了CSS组织和命名问题。在WEUI中，类名如weui-page__header和weui-btn_primary清晰地体现了BEM原则。文章详细介绍了BEM的核心优势，包括清晰的层级关系、避免样式冲突、提高可维护性和团队协作效率，并给出了命名格式细则和开发建议。通过WEUI的实际案例，展示了BEM如何有效构建可扩展、易维护的CSS架构，
2025-05-28 23:04:54
821
原创 防抖与节流：前端高手的必备技能，告别卡顿！
本文介绍了前端开发中常用的两种性能优化技术——防抖(debounce)和节流(throttle)。防抖是在事件停止触发后执行回调，适用于搜索联想等场景；节流是按固定间隔执行回调，适用于滚动加载等情况。文章详细讲解了两种技术的实现原理、代码示例及区别对比，并提供了进阶实现方案和React/Vue框架下的应用示例。最后总结了选择使用原则：关注最终结果用防抖，需要规律执行用节流，同时要注意时间间隔设置和内存管理，以提升页面性能和用户体验。
2025-05-28 08:12:04
552
原创 CSS定位详解：掌握布局的核心技术
本文全面解析CSS中的五种定位方式：静态定位(static)是默认方式，元素遵循文档流；相对定位(relative)保持原始空间，可微调位置；绝对定位(absolute)脱离文档流，相对于最近定位祖先元素定位；固定定位(fixed)相对于视口定位，不随滚动移动；粘性定位(sticky)在跨越阈值前相对定位，之后变为固定定位。每种定位方式适用于不同场景：相对定位适合微调元素位置，绝对定位适合悬浮菜单，固定定位适合导航栏，粘性定位适合吸顶效果。掌握这些定位技术对实现复杂布局至关重要。
2025-05-24 22:57:12
1022
原创 反转字符串背后的底层代码，80%的人根本没懂！
摘要： JavaScript允许原始类型（如字符串）调用对象方法（如split），这得益于“包装对象”机制。当对原始值调用方法时，引擎会临时创建对应的包装对象（如new String），调用其原型（String.prototype）上的方法后立即销毁该对象。这种设计既保持了原始类型的高效性（栈存储），又提供了面向对象的便利性。注意：显式使用包装对象（如new String）会返回object类型，可能引发意外行为，而null和undefined无此机制。理解这一原理可避免常见陷阱，如给原始值添加属性。
2025-05-24 21:04:03
1011
原创 深入理解API：从概念到实战
本文系统介绍了API（应用程序编程接口）的概念与应用。API是一组预定义的规则和协议，允许不同软件组件交互，类比餐厅点餐的流程。文章解析了API的工作原理，基于客户端-服务器模型，通过示例展示天气API调用。详细分类了Web API、系统级API、库/框架API和硬件API等主要类型，并提供了RESTful API设计原则。最后通过JavaScript、Python等代码演示API调用方式，强调API安全与认证机制，指出掌握API对提升开发效率、构建可扩展系统的重要性。
2025-05-24 20:45:12
1133
原创 《HTTP错误代码全解析：从400到404，手把手教你快速排错！》
前言 HTTP错误代码是每个开发者和运维人员都会遇到的"老朋友"，它们就像网站世界的交通信号灯，告诉我们请求是否顺利通行。本篇文章将深入剖析最常见的HTTP错误代码（400、401、403、404等）
2025-05-21 20:44:06
725
原创 差分数组：原理与应用
差分数组是一种高效处理区间更新操作的数据结构技巧，特别适用于需要对数组的某个区间进行频繁增减操作的场景。其核心思想是通过存储相邻元素的差值而非元素本身，将区间操作转化为端点操作，从而将时间复杂度从O(n)降低到O(1)。差分数组的主要优势在于它可以高效处理区间更新操作，只需修改两个端点即可完成区间增减，适用于频繁的区间增减操作、多次区间操作后查询最终结果、处理大量区间覆盖问题等场景。差分数组的实现包括构建差分数组、区间更新操作和还原原始数据三个步骤。此外，差分数组的概念可以扩展到二维，用于处理二维矩阵的区间
2025-05-20 20:23:59
546
原创 JavaScript计时器详解：setTimeout与setInterval的使用与注意事项
JavaScript中的计时器功能，主要包括setTimeout和setInterval，是开发中常用的工具。setTimeout用于在指定延迟后执行一次函数，而setInterval则按照固定周期重复执行函数。两者在使用时需注意清除计时器以避免内存泄漏，并关注this指向问题。此外，计时器的准确性受限于JavaScript的单线程特性，且最小延迟时间受浏览器限制。对于动画效果，推荐使用requestAnimationFrame以提高性能。在实际开发中，计时器可用于实现延迟执行、轮询数据、动画效果等功能，同
2025-05-20 16:07:43
1679
原创 深入理解动态规划：从斐波那契数列到最优子结构
引言 动态规划(Dynamic Programming, DP)是算法设计中一种非常重要的思想，广泛应用于解决各类优化问题。许多看似复杂的问题，通过动态规划的视角分析，往往能找到高效的解决方案。本文将
2025-05-19 21:30:29
833
2
原创 如何在VSCode中更换默认浏览器：完整指南
本文详细介绍了在VSCode中更换默认浏览器的多种方法，帮助前端开发者更高效地进行HTML文件预览。主要方法包括使用"Live Server"扩展、安装"Open in Browser"扩展、修改系统默认浏览器以及通过命令行参数进行配置。其中，"Live Server"扩展因其支持热重载和浏览器选择功能而备受推荐。文章还提供了常见问题的解决方案，如更改不生效、使用非主流浏览器或针对不同项目使用不同浏览器的情况。通过这些方法，开发者可以根据需求灵活选
2025-05-19 21:21:25
1030
原创 滑动窗口算法详解与C++实现
滑动窗口算法是一种高效处理数组或列表子区间问题的技巧，通过维护一个可变或固定大小的窗口在数据结构上滑动，避免重复计算，将嵌套循环问题转化为单循环问题，显著降低时间复杂度。该算法适用于寻找满足条件的子数组/子字符串、计算最值或平均值、涉及连续元素及优化嵌套循环等问题。滑动窗口的核心思想是通过调整左右指针来扩大或缩小窗口，并根据问题需求更新计算结果。其类型包括固定大小和可变大小的滑动窗口，分别用于计算固定长度子数组和寻找满足条件的最长或最短子数组。滑动窗口算法通常将时间复杂度优化到O(n)，关键点在于窗口表示、
2025-05-18 22:07:54
394
原创 Vibe Coding：编程中的氛围与效率的艺术
VibeCoding是一种关注开发者心理状态、工作环境和整体氛围的编程方法论，旨在通过优化这些因素来提升生产力、创造力和代码质量。其核心在于营造一个让开发者能够进入并保持“心流”状态的环境，这种状态下开发者能够完全专注于任务，时间感知扭曲，创造力自然涌现。VibeCoding的科学基础包括心流理论和环境心理学，研究表明，合适的环境和氛围能显著提高开发者的认知表现和工作效率。实践VibeCoding涉及物理环境设计、数字环境配置、心理与社交氛围管理等多个方面，通过创建个人Vibe配置文件、Vibe匹配技术栈和
2025-05-18 20:09:06
1143
原创 JavaScript 中的 for...in 和 for...of 循环详解
for...in 和 for...of 是 JavaScript 中两种常用的循环结构，但它们的用途和行为有所不同。for...in 用于遍历对象的可枚举属性，包括原型链上的属性，适合处理对象属性操作，但不推荐用于数组遍历。for...of 则用于遍历可迭代对象（如数组、Map、Set 等）的值，适合处理数组元素或其他可迭代对象的值。for...in 返回属性名，而 for...of 返回属性值。for...in 会遍历原型链上的属性，而 for...of 不会。在实际开发中，应根据需求选择合适的循环结构：
2025-05-17 20:21:38
946
原创 深入理解JavaScript中的闭包：原理、应用与常见问题
闭包是指那些能够访问自由变量的函数。这里的自由变量是指在函数中使用的，但既不是函数参数也不是函数局部变量的变量。用更通俗的话说：当一个函数能够记住并访问其所在的词法作用域，即使该函数在其词法作用域之外执行，这时就产生了闭包。const outerVar = '我在外部函数中!// 访问外部函数的变量// 输出: "我在外部函数中!在这个例子中，inner函数就是一个闭包，因为它能够访问outer函数的outerVar变量，即使outer函数已经执行完毕。
2025-05-15 22:02:48
906
原创 二分查找的边界问题
二分查找是一种高效的查找算法，适用于已排序的数组或列表，时间复杂度为O(log n)。本文详细介绍了二分查找的两种常见写法：闭区间写法和左闭右开区间写法。闭区间写法中，查找区间包含左右边界，循环条件为left <= right，边界更新对称。左闭右开区间写法中，查找区间包含左边界但不包含右边界，循环条件为left < right，右边界更新为right = mid。两种写法各有优缺点，选择取决于个人习惯和具体场景。文章还提供了代码实现、关键点说明、常见错误与注意事项，并通过例题展示了实际应用。掌
2025-05-14 18:41:41
814
原创 前端密码加密：保护用户数据的第一道防线
在互联网时代，用户数据安全至关重要，密码作为身份验证的核心凭证，其安全性尤为关键。传统前端开发中，密码常以明文传输，存在网络嗅探、日志泄露等风险。前端密码加密能减少敏感数据暴露，满足合规要求，增强用户信任。常见加密技术包括基础哈希算法、加盐哈希、PBKDF2算法等，进阶方案如双重哈希策略、动态盐值协商、Web Cryptography API等也能提升安全性。此外，HTTPS、防止重放攻击、前端代码保护等安全传输层实践同样重要。通过实际案例分析，如注册流程的安全实现，开发者可以构建更安全的认证系统，确保用户
2025-05-11 20:41:45
1063
原创 Vue v-model 深度解析：实现原理与高级用法
v-model 是 Vue.js 中用于实现双向数据绑定的指令，本质上是语法糖，简化了表单元素和自定义组件的数据绑定过程。在 Vue 2.x 和 Vue 3.x 中，v-model 的实现机制有所不同。Vue 2.x 通过 value prop 和 input 事件实现，而 Vue 3.x 则使用 modelValue prop 和 update:modelValue 事件，并支持多 v-model 绑定和自定义修饰符。在表单元素上，v-model 根据输入类型自动扩展为相应的属性和事件；在自定义组件上，开
2025-05-10 21:24:16
928
原创 ES6 核心技术详解：现代 JavaScript 开发必备技能
ES6（ECMAScript 2015）是JavaScript语言的重大更新，引入了多项核心特性，显著提升了开发效率和代码质量。本文详细介绍了ES6的主要特性及其应用场景： 块级作用域与变量声明：let和const取代了var，解决了变量提升和函数作用域问题，推荐默认使用const，需要重新赋值时使用let。 箭头函数：简化了函数表达式，改变了this的绑定方式，适合用于回调函数和简洁的函数定义。 模板字符串：支持多行字符串和嵌入表达式，提供了更灵活的字符串拼接方式。 解构赋值：允许从数组或对象中提取值并赋
2025-05-10 21:06:13
1076
原创 前端开发重要知识点全览
前端开发领域涵盖广泛，以下是现代前端开发者需要掌握的核心知识点：React：Vue：Angular：前端技术日新月异，保持持续学习的态度至关重要。建议每年更新一次技术图谱，关注行业发展趋势（如当前兴起的Islands架构、React Server Components等），同时扎实掌握计算机基础知识（数据结构、算法、网络原理等），这些才是应对技术变化的根本。
2025-05-07 20:49:20
606
原创 JavaScript 设计模式：提升代码质量的经典之道
JavaScript 作为一门灵活多变的语言，设计模式在其中的应用尤为重要。本文将深入探讨 JavaScript 中常用的设计模式，帮助你编写更优雅、更易维护的代码。设计模式是软件开发人员在长期实践中总结出来的解决特定问题的可重用方案。它们不是可以直接转换为代码的完整解决方案，而是解决特定问题的模板或指南。提高代码可重用性增强代码可维护性促进团队协作提供经过验证的解决方案设计模式是JavaScript开发者的强大工具，但关键在于理解何时以及如何使用它们。编写更清晰、更易维护的代码。
2025-05-07 20:44:51
573
原创 虚拟机对前端开发的实用价值：提升效率与解决痛点的完整指南
虚拟机为前端开发提供了安全隔离、环境标准化和跨平台测试的强大能力。虽然学习曲线存在，但掌握虚拟机技术将显著提升你应对复杂项目的能力。建议从简单的跨浏览器测试开始，逐步扩展到完整的环境隔离方案，最终构建出适合自己工作流的虚拟化开发环境。
2025-04-30 19:57:52
1037
原创 前端跨域问题详解：原因、解决方案与最佳实践
跨域问题的根源在于浏览器的同源策略，这是浏览器的一种安全机制，用于限制一个源的文档或脚本如何与另一个源的资源进行交互。同源的定义：两个URL的协议（protocol）、域名（host）和端口（port）完全相同，则视为同源。和→ 同源和→ 不同源（协议不同）和→ 不同源（域名不同）和→ 不同源（端口不同）跨域问题是前端开发中的常见挑战，理解其背后的原理和各种解决方案对于现代Web开发者至关重要。在实际项目中，应根据具体需求和安全考虑选择合适的跨域方案。
2025-04-30 19:42:37
650
原创 Vue.js 小知识点大揭秘：提升开发效率的实用技巧
Vue.js 作为当前最流行的前端框架之一，以其简洁的 API 和灵活的组件化开发模式赢得了广大开发者的喜爱。在日常开发中，掌握一些 Vue 的小知识点能够显著提升开发效率和代码质量。本文将分享一些 Vue 开发中的实用技巧和容易被忽略的细节，帮助你更好地驾驭 Vue。Vue 允许注册自定义指令，用于对普通 DOM 元素进行底层操作。// 注册一个全局自定义指令 `v-focus`// 当被绑定的元素插入到 DOM 中时……// 聚焦元素el.focus()})// 使用bind。
2025-04-29 23:24:49
789
原创 Vue.js 核心特性解析：响应式原理与组合式API实践
/ v-focus指令el.focus();});// 使用Vue 3通过组合式API和增强的响应式系统，为开发者提供了更灵活、更高效的开发体验。掌握这些核心概念和技术，能够帮助您构建更健壮、更易维护的Vue应用程序。随着Vue生态的不断发展，建议持续关注官方文档和社区最佳实践，将Vue的强大功能应用到实际项目中。无论是小型项目还是大型企业级应用，Vue.js都能提供恰到好处的解决方案。希望本文能为您深入理解Vue.js的核心概念和实践技巧提供有价值的参考。
2025-04-27 20:27:06
996
原创 这样好看的折扇效果谁看了不喜欢
主要使用了阴影、透明度、hover、2d旋转、过渡、定位等属性，写出了一个当鼠标移到上面时，可以自动放开的扇子，非常漂亮。可惜不知道怎么上传视频，不然就可以放在这里看看了。
2024-08-19 11:27:32
387
原创 基于HTML弹性布局做的支付宝界面
里面寻找，这类图标跟文字一样可以设置大小、文本居中之类的，并不算严格意义上的图片，废话不多说，直接上成果和代码。里面有一些语言图标，想用的可以去。
2024-08-10 16:57:53
618
原创 Codeforces Round 959(Div. 1 + Div. 2)A~C
差点爆零了，最近div2打的越来越艰难了，好多不会累死，脑子完全不够用，上次div3刚上的绿就掉了。
2024-07-20 18:04:45
849
2
原创 Codeforces Round 957 (Div. 3) A~G
这场div3是我的第一次上绿，真的难呀，必须好好补补，前面五题都是偏思维模拟的最后一题值得补，是一道快速幂+逆元求组合数的，这题挺好的学到了新东西。
2024-07-17 18:39:03
1332
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人