- 博客(16)
- 收藏
- 关注
原创 Vue组件通信全攻略:从基础语法到实战选型
本文系统梳理Vue组件通信方式,涵盖父子组件和跨层级通信。父子通信包括props+$emit基础方式、v-model表单双向绑定、.sync语法糖、ref访问实例及$parent/$children亲属访问。跨层级通信提供$attrs/$listeners属性透传和provide/inject依赖注入两种方案,支持响应式数据传递。文章详细讲解每种方式的语法实现、适用场景和注意事项,帮助开发者根据实际需求选择合适的组件通信方案,提升代码可维护性和性能表现。
2025-12-07 16:51:25
624
原创 JS 字符串与数组互转:全方法详解 + 循环手动实现(含 Unicode 避坑)
转换方向推荐方法适用场景注意事项字符串→数组[...str]或Array.from通用场景(尤其是含 emoji/特殊字符)split('')不支持 Unicode 扩展字符字符串→数组按指定分隔符拆分(如逗号、空格)正则分隔需注意匹配规则数组→字符串自定义连接符(无缝/空格/换行等)支持所有元素类型(自动转字符串)数组→字符串快速逗号连接(无需自定义分隔符)嵌套数组会扁平化一层。
2025-11-29 11:04:51
826
原创 JavaScript 深拷贝 vs 浅拷贝核心考点 + 使用案例
文章摘要: 本文探讨了JavaScript中深拷贝与浅拷贝的区别。基础数据类型的赋值是值拷贝,变量完全独立;而引用数据类型的赋值是地址拷贝,变量共享同一内存地址。为避免引用类型数据相互影响,需要引入拷贝操作。浅拷贝创建新容器,但只复制表层元素,嵌套引用类型仍共享地址;深拷贝则完全复制所有层级的数据。文章介绍了四种实现浅拷贝的方法:Object.assign()、lodash库、扩展运算符和解构赋值,并分析了它们的适用场景和局限性。通过实例展示了浅拷贝与直接赋值的区别,帮助开发者理解如何正确选择拷贝方式以实现
2025-11-23 08:47:15
597
原创 Vue CLI 脚手架教程:从环境准备到项目启动的完整指南
Vue CLI 就像“开发 Vue 项目的标准化脚手架”,它帮你搭好项目的“基础框架和工具环境”,让你不用从零处理繁琐的配置和结构,直接聚焦核心的业务开发,效率翻倍。Vue CLI 本质是「Vue 项目的工程化工具链」,而“脚手架”的命名是对其核心功能的精准比喻——它不是帮你“写业务代码”,而是帮你“搭好写代码的基础框架”,让开发过程更标准化、更高效,尤其适合新手快速入门和团队协作。//main.js//2.提示当前处于什么环境(生产环境/开发环境)
2025-11-14 18:35:24
983
原创 为什么 mouseover 能做事件委托,mouseenter 却不行?
我们先看一个列表</</</</</</</我们想给这个列表加入鼠标交互事件,当鼠标经过的的时候添加样式放大1.2 双击事件底色变蓝。我们首先会想到获取所有列表项,然后为每个列表项绑定事件${10${当我们不想给每一个列表项绑定事件,更改绑定方式**“父元素监听,子元素触发”**${10${ 但是用这种mouseover事件,我们会发现当鼠标经过,打印会发现控制台会因冒泡和子元素边界切换打印多次;**当我们不想为每个事件绑定,想要给ul容器直接绑定这个事件,那用之前的方法还可以吗?
2025-11-08 16:22:45
919
1
原创 前端必备:玩转 DOM 的 dataset 属性与 HTML data-* 自定义属性
本文深入讲解了HTML的data-*自定义属性和DOM的dataset属性这对"数据存储搭档"。主要内容包括:1) data-*属性的基础语法和命名规则,强调其语义化和无冲突的特点;2) dataset属性的映射规则和操作方法,展示如何通过驼峰命名获取、修改数据;3) 实际应用场景,如列表项点击获取ID、组件配置传递参数等。这些方法能优雅地存储元素关联数据,避免破坏HTML语义,提升代码可维护性。文章通过丰富示例帮助开发者掌握这一实用的前端开发技巧。
2025-11-01 21:20:06
718
原创 前端页面切换的3种核心方法:从简单到SPA实践
本文介绍了前端开发中三种常用的页面切换方法及其适用场景:1)直接插入HTML链接(多页跳转),适用于简单静态网站,但存在页面重新加载和性能浪费问题;2)innerHTML插入+隐藏旧结构(无刷新切换),适合小型交互项目,但维护成本高且性能较差;3)监控hash变化+动态加载JS(SPA方案),提供接近原生App的体验,支持动态路由和按需加载,是现代单页应用的核心实现方式。开发者可根据项目复杂度、性能要求和维护成本选择合适的方案。
2025-10-26 16:42:51
762
原创 前端 JS 调用后端 API:3 种实用方法,轻松搞定前后端数据交互
本文介绍了三种前端JS调用后端API的方法:XMLHttpRequest、jQuery Ajax以及axios和fetch。XMLHttpRequest是原生API,兼容性好但代码繁琐;jQuery Ajax简化了调用流程但需要引入额外库;axios和fetch基于Promise,支持async/await语法,是现代前端开发的首选方案。每种方法各有优劣,开发者可根据项目需求选择最合适的实现方式。
2025-10-18 09:07:35
1305
原创 JavaScript 原型与原型链:从基础概念到实战案例
摘要 JavaScript中的原型和原型链是继承机制的核心。所有对象都有原型(__proto__),指向其构造函数的prototype对象。原型链通过__proto__连接,最终指向Object.prototype。prototype是函数特有的属性,用于存放共享方法;__proto__是实例属性,用于访问原型。现代代码推荐使用Object.getPrototypeOf()替代__proto__。原型机制实现了方法复用,减少内存消耗。(150字)
2025-10-12 10:55:38
950
原创 从 “变量消失” 到 “持久化”:闭包如何重塑 JavaScript 的作用域规则
本文介绍了JavaScript中闭包的概念及其相关知识。首先通过一个代码示例说明外部无法直接访问函数内部变量的问题,分析了函数执行上下文和内存管理机制。文章详细讲解了内存存储原理、数据类型分类及存储方式(基本类型在栈内存,引用类型在堆内存),并通过图示说明不同数据类型的传参特性。最后重点介绍了JavaScript的垃圾回收机制,包括引用计数法和标记-清除法两种算法,解释了现代浏览器主要采用标记-清除法来解决内存回收问题。这些知识为理解闭包的工作原理奠定了基础。
2025-10-04 20:39:45
829
原创 开启 ES6 之旅:从解构到类,解锁 JavaScript 新范式
return '红色';return '绿色';default:return '未知颜色';
2025-09-27 11:27:38
1005
原创 探索 JavaScript 调试的利器:浏览器控制面板与核心调试方法
本文系统介绍了JavaScript的四种核心调试方法:1. console.log()——简单输出变量和状态,适合快速验证;2. 断点调试——通过浏览器开发者工具设置断点,可逐行执行并查看变量变化;3. try...catch——捕获运行时错误,保障程序稳定性;4. debugger语句——在代码中预设断点,自动暂停程序执行。四种方法各具特点:console.log简单直接但需手动清理,断点调试强大但操作复杂,try...catch专注错误处理,debugger灵活但需注意线上移除。建议开发者根据实际场景组
2025-09-21 16:13:29
617
原创 JavaScript事件入门,从基础到 DOM 交互
事件是 JavaScript 实现交互的核心机制,通过监听用户或系统的动作,触发对应的处理逻辑。推荐使用方法绑定事件,它更灵活且支持多处理函数,同时通过事件对象可以获取丰富的事件信息,实现更复杂的交互功能。
2025-09-14 13:52:56
663
原创 JavaScript基础
本文系统介绍了JavaScript的基础知识,主要包括以下内容: JavaScript组成:ECMAScript(解释器)、DOM(文档对象模型)和BOM(浏览器对象模型) 变量与数据类型: 变量定义与赋值规则 标识符命名规范 基本数据类型(Number、String、Boolean、Null、Undefined、NaN) 类型检测与转换 运算符: 算术运算符 字符串拼接 关系运算符与比较规则 逻辑运算符 赋值运算符 自增自减 数组操作: 数组创建与初始化 常用方法(join、split、reverse、s
2025-09-06 15:50:48
1008
原创 从入门到精通:CSS最全知识体系总结,助你高效开发!
元素显示模式就是元素(标签)以什么方式进行显示,比如<div>自己占一行,比如一行可以放多个<span>。 网页的标签非常多,在不同地方会用到不同类型的标签,了解他们的特点可以更好的布局我们的网页。 学习元素显示模式的主要目的就是分清它们各自的特点,当我们网页布局的时候,在合适的地方用合适的标签元素。元素模式元素排列设置样式默认宽度包含块级元素一行只能放一个块级元素可以设置宽度宽度的100%容器级可以包含任何标签行内元素一行可以放多个行内元素不可以直接设置宽度。
2025-08-09 06:00:00
819
原创 HTML全攻略:标签、语义化、特殊字符及表单增强
网页与HTML基础知识摘要: 网页是构成网站的基本元素,由HTML文件组成,通过浏览器展示。HTML(超文本标记语言)是描述网页的标记语言,不是编程语言。网页包含文本、图片、链接等元素,基本结构包括头部(head)和主体(body)。Web标准由W3C制定,包括结构(HTML)、表现(CSS)、行为(JavaScript)三部分,提倡三者分离。常用HTML标签包括标题(h1-h6)、段落(p)、图片(img)、链接(a)、列表(ul/ol)、表格(table)、表单(form)等。HTML5新增了语义化标签
2025-08-09 05:00:00
602
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅