自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(75)
  • 收藏
  • 关注

原创 ES6类完全指南:声明方式、继承机制与实战技巧

ES6类简化了面向对象编程的语法,但核心仍基于原型链机制。掌握类与继承的核心原则,能让你写出更规范、更健壮的代码。类的声明规范:类名首字母大写,实例方法、静态方法、访问器合理分工;优先用私有成员封装内部逻辑,避免外部篡改。继承的使用原则:仅当子类与父类存在“is-a”关系(如Student is a Person)时使用继承,避免过度继承导致代码耦合;重写父类方法时,通过super保留父类核心逻辑。底层原理认知:牢记“class是语法糖”,理解实例、类、原型对象的关系,遇到继承问题可从原型链角度排查。

2026-01-28 23:36:26 751

原创 null和undefined的区别是什么?

要分清null与undefined,首先需明确ECMAScript规范对二者的本质定位——二者均属于原始类型,但语义和设计初衷完全不同。根据ECMAScript规范,undefined表示“变量已声明但未赋值”,或“对象属性/数组元素不存在”的自然状态,是JavaScript引擎自动赋予的默认值,无需手动赋值。简单来说,undefined是“被动的无”——不是开发者主动定义的“无”,而是程序运行过程中自然产生的状态。

2026-01-24 21:10:50 551

原创 cookie、localStorage的区别和特点

明确数据用途:需与服务器交互、涉及身份验证的数据,用Cookie;仅客户端使用、无需同步的数据,用localStorage。控制数据体积:Cookie仅存关键小数据(4KB内),避免影响请求性能;localStorage合理利用5MB容量,不存储冗余数据。重视安全防护:Cookie必配HttpOnly、Secure、SameSite属性;localStorage不存敏感数据,做好XSS防护。规范API使用:Cookie建议封装工具函数(简化增删改查);

2026-01-22 21:20:06 489

原创 js的数据类型有几类?一共有几种?

ES5 及之前:分为「基本类型」和「引用类型」两大类;ES6 及之后:规范中正式定义为「原始类型(Primitive Type)」和「对象类型(Object Type)」,并新增Symbol类型,ES11 又新增BigInt类型。原始类型存储的是值,对象类型存储的是引用(内存地址),这是两类类型的本质区别,也是判断方法的核心依据。明确目标类型:先确定要判断的是原始类型还是对象类型,再选方法;优先专用方法:判断数组用、判断 NaN 用,专用方法比通用方法更简洁;通用场景选精准方法:封装getType。

2026-01-20 20:33:25 1014

原创 深度解析var、let、const的区别与最佳使用场景

var、let、const的差异本质是作用域机制和变量特性的不同,ES6引入let/const后,从语法层面优化了变量声明的安全性和规范性。核心总结:摒弃var,优先用const,按需用let,让变量的可变性一目了然,减少bug。理解块级作用域和暂时性死区,避免变量泄露和未声明就使用的问题。const限制的是变量引用,而非对象/数组内部属性,合理利用这一特性操作复杂数据。遵循以上规范,能让你的JS代码更具可读性、可维护性,同时契合现代前端开发的最佳实践。

2026-01-19 21:16:11 839

原创 HTTP协议中,GET和POST有什么区别?分别适用什么场景?

首先,我们需要明确一个前提:GET和POST的核心差异,源于 HTTP 协议对它们的语义定义,而非技术实现上的强制限制。根据GET方法:用于从服务器获取资源,强调的是 “读取” 操作。它被定义为幂等、安全的请求方法。幂等性:多次发送相同的GET请求,服务器返回的结果一致,且不会对服务器数据产生任何副作用。安全性:仅获取数据,不修改服务器状态。POST方法:用于向服务器提交数据,以创建或修改资源,强调的是 “写入” 操作。它是非幂等、非安全的请求方法。非幂等性:多次发送相同的POST。

2026-01-18 20:52:05 1023

原创 深入浅出 JavaScript 常用事件:从原理到实战的全维度解析

用户交互事件是核心:鼠标事件(PC 端)、键盘事件(输入 / 快捷键)、触摸事件(移动端)是实现用户操作响应的基础;生命周期事件优先初始化 DOM,load处理资源依赖逻辑,提示用户保存内容;元素状态事件处理数据交互:表单事件(input/change/submit)是数据收集的核心,精准监听 DOM 变化。掌握事件的核心是 “理解事件流、精准绑定、合理处理事件对象”,结合事件委托、节流防抖、及时清理监听等最佳实践,既能实现流畅的交互体验,又能保证代码的性能与可维护性。

2026-01-18 20:50:32 675

原创 什么是暂时性死区?

暂时性死区的权威定义(基于ECMAScript 2022规范)可精准概括为:letconstclassReferenceError当变量通过、或声明时,在其所在的词法作用域内,从作用域起始位置到变量声明语句执行完毕前的区间,该变量处于不可访问状态(读取、赋值均不允许),若强行访问则抛出,这一区间即为暂时性死区。暂时性:死区并非永久状态,一旦代码执行流抵达变量声明语句,变量完成初始化(let为“未赋值初始化”,const为“赋值初始化”),死区立即终止,变量可正常访问;词法作用域绑定。

2026-01-16 23:08:39 943

原创 什么是封装?为什么要封装?

将对象的属性和行为(方法)捆绑在一起,隐藏对象内部的实现细节,仅通过公开的接口与外部交互。其核心是“信息隐藏”与“访问控制”,本质是建立一道“边界”,将对象的“内部状态”与“外部操作”隔离开来。封装并非单纯的语法技巧,而是一种“以边界换稳定”的设计思想——通过建立对象的内部与外部边界,隐藏复杂度、控制访问权限、隔离变化,最终实现代码的高安全性、高可维护性、高扩展性。核心要点:封装的本质:信息隐藏+访问控制,实现高内聚、低耦合;封装的价值:保障数据安全、降低耦合、隐藏复杂度、提升扩展性、便于协作;

2026-01-15 21:53:19 845

原创 添加、删除、替换、插入元素的全方法指南

语法返回值:被删除的元素(数组为空则返回 undefined)实战示例javascript运行// [1, 2, 3, 4](原数组被修改)// 5优势:性能最优(无索引重排);适用场景:栈结构的出栈操作、列表尾部删除。数组操作的核心是区分「修改原数组」和「返回新数组」:需保留原数组用扩展运算符 /filter/map,无需保留用 push/pop/splice;

2026-01-10 21:30:00 1845

原创 什么是json?json可以存在哪几种数据类型?在什么时候用?

JSON 的全称是(JavaScript对象表示法),但它并非JavaScript的专属特性——而是一种独立于编程语言的文本格式,设计初衷是为了实现不同系统间的高效数据交换。用标准化的文本结构描述数据关系,让不同语言(Java、Python、Go、JavaScript等)都能轻松解析和生成。1. JSON的本质是“跨语言数据交换的文本格式”,并非JavaScript对象,语法更严格;2. JSON仅支持7种标准数据类型(字符串、数字、布尔值、null、对象、数组),不支持函数、日期等复杂类型;

2026-01-09 21:10:48 953

原创 js遍历数组和对象的常用方法有哪些?

数组遍历的核心是 “匹配业务意图”:需终止用,需映射用map,需筛选用filter,需聚合用reduce;对象遍历优先选择,无需手动过滤原型属性,语法简洁;语义化 > 简洁性 > 性能,仅在大数据量场景下优先考虑性能。掌握这些遍历方法,不仅能写出更优雅的代码,更能避免常见的边界错误。记住:没有 “最好” 的方法,只有 “最适合” 当前场景的方法。

2026-01-08 21:21:56 849

原创 运算符分为哪几类?哪些运算符常用作判断?简述运算符的优先级

运算符分类:8大类,核心关注「算术、赋值、关系、逻辑、三元」运算符;判断类运算符:以「关系运算符(===、>、<等)」和「逻辑运算符(&&、||、!)」为核心,三元运算符用于简单二选一判断;优先级规则:括号最高,一元>算术>关系>逻辑>三元>赋值,优先级相同看结合性。

2026-01-07 21:51:03 493

原创 如何声明一个类?类如何继承?

类的声明核心现代开发优先使用class关键字,核心包含构造函数(初始化实例属性)和原型方法(所有实例共享);static静态方法(类本身的方法)、私有成员(类内部保护)、get/set访问器(优雅操作属性)。类的继承核心基础继承:使用extends关键字实现子类继承父类,子类自动继承父类的公共实例属性和原型方法;关键细节:子类构造函数中必须先调用super(),才能使用this;进阶操作:方法重写(覆盖父类方法)、super访问父类方法(扩展父类功能)。实战准则。

2026-01-04 20:51:11 1021

原创 js中的两种定时器,区别是什么?怎么清除定时器?

是用于 ** 在指定的延迟时间后,一次性执行某段代码(回调函数)** 的定时器,执行完毕后定时器自动失效,不会重复触发,因此也被称为 “一次性定时器” 或 “延迟定时器”。是用于 ** 按照指定的时间间隔,周期性、重复执行某段代码(回调函数)** 的定时器,除非手动清除,否则会一直持续执行,因此也被称为 “周期性定时器” 或 “重复定时器”。两种定时器的核心定位是 “单次延迟”,是 “周期性重复”,根据业务场景选择对应工具;清除定时器的核心:保存定时器 ID,使用。

2026-01-03 16:38:37 1010

原创 强制类型转换和隐式类型转换的区别

JavaScript的类型转换,本质是「将一种数据类型(如字符串、布尔值)转换为另一种数据类型(如数字、对象)」的过程。两者的核心区别在于「转换的触发方式」—— 是开发者主动显式触发,还是JavaScript引擎自动隐式触发。强制类型转换和隐式类型转换的核心区别,本质是「转换控制权的归属」:强制转换:控制权在开发者手中,意图明确、可读性强、风险低,适合需要明确改变类型的场景;隐式转换:控制权在JavaScript引擎手中,代码简洁但可读性弱、风险高,适合规则明确的简化场景。

2025-12-30 21:25:14 699

原创 什么是封装?为什么要封装?

从广义上讲,封装是将数据(属性)和操作数据的方法(函数)捆绑在一起,形成一个独立的 “单元”(如类、模块、对象),并对外隐藏内部的实现细节,只暴露有限的、规范的接口供外部访问和使用的编程思想。数据封装:将相关联的数据和方法聚合在一起,形成一个整体(避免数据和方法分离,提高代码内聚性);访问控制:隐藏内部的实现细节(如私有属性、私有方法),只开放必要的公共接口,外部无法直接操作内部数据,只能通过接口交互。手机内部的芯片、电池、电路板等是 “内部实现细节”(被隐藏,用户无法直接操作);

2025-12-29 20:54:17 924

原创 创建对象的方法有哪些?

基础层:对象字面量是创建单个对象的最佳选择,简洁高效;复用层:工厂函数适合简单批量创建,构造函数 / Class 适合复杂对象 + 类型区分;灵活层控原型,/ 展开运算符控属性;核心原则:按需选择方法(简单场景用字面量,复杂场景用 Class,灵活扩展用展开运算符),优先使用浅拷贝(深拷贝按需使用)。JavaScript 的对象创建方法,从简单到复杂,从基础到进阶,本质是 “复用性” 和 “灵活性” 的平衡。

2025-12-26 22:33:54 1055

原创 什么是事件冒泡?如何阻止事件冒泡和浏览器默认事件?

事件冒泡是 DOM 事件流(Event Flow)的冒泡阶段(Bubbling Phase)当一个 DOM 元素的事件被触发后,该事件会从触发事件的目标元素(target)开始,按照 “从下到上” 的顺序,依次向上传播到其父元素、祖父元素,直到传播到最顶层的 document(或 window)对象。形象地说,事件冒泡就像水中的气泡,从水底(目标元素)逐渐上浮到水面(顶层对象),沿途会触发所有包含该事件的父级元素的事件处理函数。当某些 DOM 事件被触发时,浏览器会自动执行的预设行为。

2025-12-25 19:57:01 782

原创 JavaScript 操作 DOM 元素:添加、删除、替换、插入的完整方法指南

若需兼容低版本浏览器(如 IE11),优先使用;若需一次性添加多个元素 / 字符串,且无需兼容低版本浏览器,优先使用append()(末尾)/prepend()(开头);若需要获取被添加的节点引用,使用appendprepend无返回值)。若需兼容低版本浏览器,或需要复用被删除的节点,优先使用;若无需兼容低版本浏览器,且操作简单,优先使用remove()(代码更简洁);若需清空父元素所有子元素,优先使用(简单)或循环(安全)。兼容低版本浏览器:使用;现代项目(无需兼容 IE):使用。

2025-12-24 20:22:54 1108

原创 JavaScript 中 undefined 和 not defined 的区别

undefined变量已被声明,但未赋予任何值;属性 / 元素在对象 / 数组中不存在;函数没有返回值时的默认返回结果;函数参数未被传递时的默认值。简单来说,undefined是一种 “已声明但未初始化” 的合法状态,不会导致程序报错,只是表示数据的 “空缺”。undefined是原始数据类型,是未声明变量的错误状态;undefined不报错,抛出;undefined是 “已声明未赋值”,是 “未声明”;undefined可直接检测,需提前规避或捕获错误。

2025-12-22 21:07:25 1240

原创 什么是扩展运算符?有什么使用场景?

扩展运算符(...)是 ES6 引入的语法特性,用于将可迭代对象(Iterable)拆解为逗号分隔的独立元素序列。其中,可迭代对象包括数组、字符串、Set、Map、类数组对象(如arguments)以及 ES2018 新增的普通对象。扩展运算符以...简化代码:替代slice()concat()apply()等冗余语法,让代码更简洁直观,提升可读性;提升灵活性:支持在任意位置插入、合并数据,兼容多种可迭代对象,满足复杂场景的开发需求;符合现代开发理念。

2025-12-19 21:32:54 644

原创 css性能优化的方法,至少说出五种

CSS 性能优化并非 “炫技”,而是 “回归本质”——让浏览器以最低的成本解析样式、渲染页面。减少体积:压缩、按需加载、移除无用代码;降低复杂度:优化选择器、简化计算、避免高耗属性;优化加载:内联关键 CSS、异步加载、预加载;值得注意的是,CSS 性能优化需 “因地制宜”:移动端优先保证流畅度(减少重排、禁用高耗属性),PC 端优先保证体验(合理使用动画、滤镜);小型项目侧重精简体积,大型项目侧重模块化复用。高性能的 CSS,是 “体积小、解析快、渲染稳” 的 CSS。

2025-12-18 21:04:06 607

原创 break和continue的区别是什么?

对比项breakcontinue循环状态彻底终止继续执行作用对象循环、switch仅循环迭代影响终止所有剩余迭代仅跳过当前迭代嵌套循环默认终止内层,需标签终止外层默认跳过内层当前迭代,需标签作用外层常见使用找目标、满足条件退出过滤数据、跳过无效迭代break是 “到此为止”,直接结束整个循环;continue是 “跳过这一步”,剩下的循环继续。

2025-12-17 21:03:47 791

原创 你对面向对象编程的理解,面向过程和面向对象有什么区别?

OOP 是 “重量级工程框架”,适合构建复杂、可演进的软件系统 —— 这也是为什么大型项目(如微信、电商平台)几乎清一色采用 OOP 思想设计的核心原因。优势:新增登录方式时,无需修改原有AuthService或LoginFactory的核心逻辑,仅需新增LoginStrategy实现类 —— 这正是 OOP “开闭原则”(对扩展开放,对修改关闭)的完美体现,也是复杂系统能够持续演进的关键。特点:数据(用户名、密码)是 “被动的”,函数(验证格式、查询数据库)是 “主动的”,数据与操作分离。

2025-12-16 19:39:17 982

原创 JavaScript闭包终极指南:从原理到实战(2025版)

当一个内部函数被其外部函数之外的作用域引用时,就形成了闭包。此时内部函数会“捕获”外部函数的变量与执行环境,即使外部函数执行结束,其变量仍能被内部函数访问。核心逻辑:闭包通过“引用”阻止了外部函数执行上下文的垃圾回收,从而保留了对外部变量的访问权。闭包的核心是“词法环境的引用链”,其价值在于实现数据封装、状态保留与逻辑复用,同时也需注意内存管理问题。以下是核心知识点梳理:核心概念关键结论本质内部函数被外部引用,形成词法环境引用链,阻止外部变量回收核心特性。

2025-12-14 17:40:44 884

原创 js怎样控制浏览器前进、后退、页面跳转?

问题代码javascript运行// [1](意外共享)原因:原型上的引用类型属性会被所有实例共享。解决方案:将引用类型属性定义在构造函数中(实例属性):javascript运行// 每个实例独立拥有核心概念关键结论原型链实例→构造函数.prototype→父类.prototype→Object.prototype→null继承方式选型现代开发优先 ES6 class,ES5 环境用寄生组合继承查找优先级实例属性 > 原型属性 > 父类原型属性核心属性关系实例.

2025-12-11 20:56:35 736

原创 JavaScript 变量声明终极指南:var/let/const 深度解析(2025 版)

var、let、const 的差异本质是 JavaScript 从 “松散类型” 到 “严格类型” 的演进体现,掌握它们的核心是理解 “块级作用域” 和 “变量绑定规则”。作用域优先:需要块级作用域用 let/const,避免变量泄露;不可修改优先:变量无需重新赋值时,优先用 const,减少意外修改;杜绝 var:现代开发中 let/const 完全替代 var,提升代码健壮性。遵循这些规则,不仅能规避 90% 的变量相关 bug,还能让代码更具可读性和可维护性,这也是前端工程化开发的基本要求。

2025-12-10 21:01:52 704

原创 什么是iframe(内联)?请讲述一下iframe(内联)的优缺点?

var、let、const的差异本质是JavaScript从“松散类型”到“严格类型”的演进体现,掌握它们的核心是理解“块级作用域”和“变量绑定规则”。作用域优先:需要块级作用域用let/const,避免变量泄露;不可修改优先:变量无需重新赋值时,优先用const,减少意外修改;杜绝var:现代开发中let/const完全替代var,提升代码健壮性。遵循这些规则,不仅能规避90%的变量相关bug,还能让代码更具可读性和可维护性,这也是前端工程化开发的基本要求。

2025-12-09 21:44:32 746

原创 HTTP 核心:GET 与 POST 深度解析(区别、原理与实战场景)

HTTP协议中,GET和POST是最常用的两种请求方法,它们在设计目的、数据传递方式、安全性等方面有本质区别,适用于不同的场景。

2025-12-07 21:19:55 681

原创 JavaScript闭包终极指南:从原理到实战(2025版)

JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,它基于文本,易于人阅读和编写,同时也易于机器解析和生成。‌1 尽管它源自JavaScript的对象字面量语法,但现在已成为跨语言、跨平台的通用标准,主要用于在不同系统或端之间高效、无歧义地传递数据。JSON的优势在于其简洁性、跨语言兼容性(几乎所有编程语言都内置解析库)以及高效的解析性能,使其成为现代软件开发中的主流数据格式。JSON可以存储以下几种基本数据类型:‌2。JSON在以下场景中非常有用:‌2。

2025-12-06 20:36:53 328

原创 前端跨域问题:原理、8 种解决方案与实战避坑指南

setTimeout和。

2025-12-05 19:43:31 254

原创 箭头函数和普通函数有什么区别

箭头函数和普通函数是JavaScript中两种不同的函数定义方式,它们在语法、行为和使用场景上存在显著差异。`this`指向机制。

2025-12-03 19:35:18 298

原创 什么是http状态码?常见的有哪些(3个)?分别代表什么含义?

HTTP状态码是服务器响应客户端请求时返回的3位数字代码,用于表示请求处理结果。

2025-10-29 20:42:49 198

原创 箭头函数和普通函数有什么区别

‌:箭头函数没有自己的this,而是继承定义时的上下文this,不能作为构造函数使用,且需用rest参数替代arguments对象,语法更简洁;普通函数则动态绑定this,支持构造函数和arguments对象,但语法相对冗长。箭头函数和普通函数的核心区别在于‌。

2025-10-24 20:44:23 160

原创 模块化有什么好处?

通过将系统分解为独立模块,每个模块承担特定功能,可降低整体复杂度,使开发、维护和调试更高效。模块化设计支持功能调整和扩展,修改某一模块不影响其他模块,便于快速响应需求变化。模块化结构支持并行开发,不同团队可同时优化不同模块,提升开发效率。工厂化生产模块可实现精准质量控制,减少现场施工误差,延长产品寿命。模块独立性强,修改或替换特定模块更便捷,减少系统维护成本。

2025-10-23 20:56:09 142

原创 js遍历数组和对象的常用方法有哪些?

在JavaScript中,遍历数组和对象是常见且基础的操作。下面列出了一些常用的方法来遍历数组和对象:‌for‌‌for...of‌‌forEach‌‌for...in‌for...in主要用于遍历对象的属性,虽然也可以用于数组,但不推荐这样做,因为它会遍历数组的所有可枚举属性,包括原型链上的属性。‌map‌(创建一个新数组,其中包含对原数组元素调用函数后的结果)‌filter‌(创建一个新数组,包含通过所提供函数实现的测试的所有元素)

2025-10-22 20:41:38 198

原创 什么是时间戳?怎么获取?有什么用?

时间戳是指从1970年1月1日00:00:00 UTC(协调世界时)至当前时间的总秒数或毫秒数,用于表示某一时刻的数字标识。

2025-10-21 20:44:37 311

原创 如何在溢出隐藏之后,将鼠标悬停显示的数据渲染到数据的右侧,而不是其中

要将鼠标悬停显示的数据渲染到右侧,可通过调整CSS样式实现。

2025-10-16 19:45:07 219

原创 js怎样改变元素的内容、属性、样式?

在JavaScript中,你可以通过多种方式来改变HTML元素的内容、属性和样式。

2025-10-15 19:46:25 328

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除