前端整理知识点

防抖/节流

函数防抖和函数节流都是防止某一时间频繁触发
防抖是将多次执行变为最后一次执行,当持续触发事件时,一定时间段内没有再触发事件,事件处理函数才会执行一次,如果设定的时间到来之前,又一次触发了事件,就重新开始延时
节流是将多次执行变为每隔一段时间执行,每隔一段时间,只执行一次事件

应用场景:
防抖:(setTimeout定时器)
1.用户在不断输入值时,用防抖来节约请求资源
2.不断的调整浏览器窗口大小会不断的触发这个事件,用防抖来让其只触发一次
节流:(时间戳+定时器)
1.鼠标不断点击触发
2.监听滚动事件,比如是否滑到底部自动加载更多

image

image

https://www.cnblogs.com/youma/p/10559331.html

this

https://www.jianshu.com/p/82ee5d440eab

输入URL后

1.URL解析:协议+网络地址+资源路径
2.域名解析:是否能找到对应的服务端
3.根据IP建立TPC连接:请求连接--->确认连接-->结束
4发送http请求
5.服务器处理请求
6.断开TCP连接:请求中断-->服务器告诉客户端知道了,但要看看还有没有没发完的数据-->客户端等待,服务端确定数据发完后,通知客户端可以中断-->客户端收到后,关闭
7.解析HTML
8.浏览器渲染

glup

https://www.jianshu.com/p/3f2e13442555
https://blog.csdn.net/qq_37949737/article/details/80658002

image

git

https://www.liaoxuefeng.com/wiki/896043488029600/896827951938304

事件委托

1事件捕获
当一个事件触发后,从Window对象触发,不断经过下级节点,直到目标节点。在事件到达目标节点之前的过程就是捕获阶段。所有经过的节点,都会触发对应的事件
2事件冒泡
当事件到达目标节点后,会沿着捕获阶段的路线原路返回。同样,所有经过的节点,都会触发对应的事件

1.当为事件捕获(useCapture:true)时,先执行body的事件,再执行div的事件
2.当为事件冒泡(useCapture:false)时,先执行div的事件,再执行body的事件

使用事件委托可以自动绑定动态添加的元素,即新增的节点不需要主动添加也可以一样具有和其他元素一样的事件。

for...in for...of

1.for...in 遍历的是索引
2.for...of遍历的是value

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容