选择器那些事

本文深入探讨CSS选择器的优先级计算、渲染顺序、匹配机制与大小写敏感性等底层细节,通过具体代码示例澄清常见误区,为前端工程师提供精准的样式控制洞见。

模拟实现new

文章通过一个具体示例,解析了JavaScript中new运算符的底层执行步骤,并提供了一个模拟实现函数,探讨了原型链设置和构造函数返回值处理等核心机制。

模拟实现bind

本文逐步剖析了 JavaScript 中 bind 方法的模拟实现,从基础参数处理到构造函数场景下的 this 绑定和原型链继承,最终提供了一个兼容性优化的完整实现方案。

jsonp实现原理

文章解析了 JSONP 跨域请求的实现原理,利用 script 标签绕过同源策略,并提供了一个包含超时处理和错误回调的 TypeScript 实现示例。

MatchMedia API

MatchMedia API 提供编程式媒体查询能力,支持通过 MediaQueryList 对象监听视口变化。文章深入解析其属性(matches、media)与方法(addListener、removeListener),并给出实用示例,帮助开发者实现更灵活的响应式逻辑。

ResizeObserver API

ResizeObserver API 提供了一种高效监听元素尺寸变化的方式,解决了以往仅能监听 window resize 的局限,通过回调传递 contentRect 属性获取详细盒模型信息,需结合 polyfill 在实验阶段使用。

长列表优化

长列表渲染的两种优化策略:无限滚动实现懒加载,虚拟列表仅渲染可见区域。文章详细介绍了固定高度和非固定高度下的计算逻辑与Vue实现,包括滚动监听、索引计算及缓存机制。

通用迭代器实现

本文探讨了在 JavaScript 中实现一个通用的 each 函数,详细解析了如何通过 Object.prototype.toString 进行类型判断,并设计 isClassArray 函数来区分数组、类数组和对象,以支持不同的迭代策略和回调处理。

代理模式

探讨代理模式在JavaScript中的两种常见形式:保护代理通过隔离接口过滤数据,缓存代理通过内存记录优化计算。并结合jQuery的链式调用和Vue的响应式系统,展示代理模式的实际应用。