合集-小知识
摘要：``` // 获取URL中的查询参数 const paramsString = window.location.search; const searchParams = new URLSearchParams(paramsString); // 将查询参数转换为对象 const paramsObje
阅读全文
摘要：点击查看代码 ``` 启用 禁用 展开/折叠 全选/全不选 父子(联动/不联动) 取消 确认 ```
阅读全文
摘要：瀑布流 前端流行网页布局方式 使用js动态的设置等宽的图片进行视觉参差不齐的效果，一般用于图片展示，商品展示 定位子绝父相，动态设置偏移量 计算一行几列考虑每列之间的距离并初始化值为0个数为列数的数组，之后就是循环找最小的值并追加到对应的列，最后把数组的最大值赋值给容器的高，考虑到页面初始化和窗口变
阅读全文
摘要：1、v-bind是单向绑定，用来绑定数据和属性以及表达式，只能将vue中的数据同步到页面。 2、v-model是双向绑定，不只能将vue中的数据同步到页面，而且可以将用户数据的数据赋值给vue中的属性。 3、v-bind可以给任何属性赋值，v-model只能给具备value属性的元素进行数据双向绑定
阅读全文
摘要：``` 虚拟DOM 虚拟DOM 本质上是一个js对象 ，通过对象来表示真实的DOM结构。 key是虚拟DOM对象的标识，当状态中的数据发生变化时，Vue会根据 新数据 生成 新的虚拟DOM key的原理及作用 Key是对节点进行的一个标识，在Vue中，Key作为Vue中对比算法的标识， 在数据修改后
阅读全文
摘要：在Vue 3中，与Vue 2相比，有一些改进和优化的diff算法。 1.静态模板提升（Static Template Hoisting）：Vue 3使用了基于模板的静态分析技术，可以在编译阶段将静态的模板部分提升为常量，从而减少运行时的diff和渲染开销。 2.静态标记（Static Marking
阅读全文
摘要：
阅读全文
摘要：渲染引擎首先通过网络获得所请求文档的内容，通常以8K分块的方式完成。 下面是渲染引擎在取得内容之后的基本流程： 1.解析html为dom树，解析css为cssom。渲染引擎开始解析html，并将标签转化为内容树中的dom节点。 2. 把dom和cssom结合起来生成渲染树(render)。接着，它解
阅读全文
摘要：Object.entries() 方法返回一个给定对象自身可枚举属性的键值对数组。 其排列与使用 for...in 循环遍历该对象时返回的顺序一致（区别在于 for-in 循环还会枚举原型链中的属性）。 语法 Object.entries(obj) 参数 obj：可以返回其可枚举属性的键值对的对象。
阅读全文
摘要：https://blog.csdn.net/chenzhizhuo/article/details/101291652 这个大佬写的很细，强烈推荐
阅读全文
摘要：``` import { Loading } from 'element-ui' let loadingCount = 0 let loading const startLoading = () => { loading = Loading.service({ lock: true, text: '
阅读全文
摘要：## 性能代价和获得的用户体验收益不成正比 ```` 先从技术方面讲的话，无非就是数组每个下标都要添加监听器， 无疑会增加内存消耗， 而数组的sort、splice、reverse、shift、unshift等都会触发大量的数组子项的下标更改和变动， 从而触发大量getter和setter， 这在数
阅读全文
摘要：这主要是由于 Vue 3 引入了响应式系统的重写和虚拟 DOM 的改进所致。 响应式系统重写：Vue 3 的响应式系统使用了 Proxy，相对于 Vue 2 的 Object.defineProperty，Proxy 会对访问的每个属性进行拦截和处理。尽管 Proxy 在功能上更加强大和灵活，但其性
阅读全文
摘要：问题：表单验证正则匹配数字，但输入汉字仍然通过 原因：.number会将input里的值用parseFloat()转化，这样用正则匹配数字后，输入的即使是：123四五六；也不会报错，因为123四五六被转换成了123 解决办法：将.number去除即可 除了.number修饰符外，还有 .lazy 、
阅读全文
摘要：电梯导航css 前端的算法https://visualgo.net/zh img和video的裁剪 数据脱敏 图片不遮挡图像 element+导航栏 绘制svg动态图标 加一个hover动画时间 backface-visibility隐藏盒子背面
阅读全文
摘要：js手写一个call /** * 手写一个call方法 * 函数名字为myCall * symbol优化 */ let obj = { name: '白衣', age: 3, } function getYaer (name, age) { // console.log('函数内的this',thi
阅读全文
摘要：js手写一个apply /** * 手写一个apply方法 * 函数名字为 myApply * symbol优化 */ Function.prototype.myApply = function (targetObj, args) { // symbol优化 let key = Symbol('ke
阅读全文
摘要：手写一个 bind 方法 /** * 手写一个 bind 方法 * 函数名字为 myBind */ Function.prototype.myBind = function (targetObj, ...args) { return (...argus) => this.call(targetObj
阅读全文
