骆驼一小只-CSDN博客

原创 JavaScript实现虚拟列表

3、监听滚动条的滚动事件，获取每次滚动的scrollTop，然后除以元素的高度，得到每次获取数组中的数据下标，然后进行截取，再替换html的内容。后端一次性返回大批量的数据(如：1000条)，前端如果全部一次性渲染可能会导致页面卡顿，用户体验差，因此需要通过虚拟列表来实现。1、包装一个容器代表可视区，根据设计图获取每条数据的高度，然后根据可视区的高度和每条数据的高度去计算一次可以渲染多少条数据。2、设置容器的高度等于数据的条数*每条数据的高度。

2024-03-08 10:37:25 419

原创 typescript常用类型标注

联合类型：联合类型的特点是可以包含多个类型，但只允许其中一个类型作为变量的实际类型。交叉类型：指的是多个类型的并集，表示一个类型同时具备这些类型的特点，用&表示。使用Pick获取指定字段类型。使用Omit排除指定字段类型。

2024-02-28 09:39:57 348

原创手写javascript原型对象的call、apply、bind方法

call、apply在改变this指向的同时，也会把目标函数给执行掉。一、call、apply、bind的作用都是改变函数的this指向。bind只负责改造this，不执行任何操作。二、模式实现一个call、apply、bind方法。

2024-02-22 09:47:21 347

原创 JavaScript属性检测

【代码】JavaScript属性检测。

2024-01-31 10:44:30 391

原创浏览器的五种观察模式

避免了通过回调函数调整大小时，通常创建的无限回调循环和循环依赖项。它只能通过在后续的帧中处理 DOM 中更深层次的元素来做到这一点。如果它的实现遵循规范，则应在绘制前和布局后调用 resize 事件。最常用的场景就是实现滚动条滚动到页面底部加载更多或者是做图片懒加载，当图片滑动到视窗内再显示图片。主要用于监听浏览器的各种报告信息，包括弃用的api，css特性使用情况等。用于监测性能度量事件,在浏览器的性能时间轴记录下一个新的。用户监听某个范围内dom树结构发生变化的场景。

2024-01-25 09:49:54 358