03 2023 档案
摘要：在Vue中手动销毁keep-alive组件可能失效的原因有以下几点： keep-alive组件内部被缓存，即使手动销毁组件，其实并没有真正销毁，而是被缓存起来了。因此，即使手动销毁了组件，下次再进入缓存周期时，组件还是会被复用，而不是重新创建。 keep-alive组件内部可能存在异步操作或定时器，
阅读全文
摘要：何时进行响应式处理 1. 在new Vue的时候，会调用observe函数，observe函数会调用Observer类，Observer类会调用walk函数，walk函数会调用defineReactive函数，defineReactive函数会调用Object.defineProperty函数，从而
阅读全文
摘要：// 使用map生成考虑了所有情况的深拷贝函数 function deepClone(obj, map = new WeakMap()) { // 基本类型直接返回 if (typeof obj !== "object" || obj null) { return obj; } // 如果map中有
阅读全文
摘要：前提：永远不要过早地优化，仅在影响运行、卡的不行的时候才优化 [参考] 代价：代码会变得难以阅读，开发难度增大 使用key 对于通过循环生成的列表，应给每个列表项一个稳定且唯一的key，这有利于在列表变动时，尽量少的删除、新增、改造元素。 一般使用ID作为Key 使用冻结的对象 冻结的对象（里面的属
阅读全文
摘要：var vm = new Vue({ el: ".container", // 挂载点 data: {}, // 数据决定了页面的样子 | 数据的响应式 => 数据变了界面跟着变 computed: {}, // 计算属性，惰性求值的依赖者，存在缓存 }) 在Vue单例中，一般会把整个页面交给Vue
阅读全文
摘要：var obj = { a: 1 } // 获取属性描述符 var desc = Object.getOwnPropertyDescriptor('obj','a'); console.log(desc); desc = { value: 1, writable: true, enumerable:
阅读全文
摘要：事情的起源是我给大屏系统添加了顶部栏，UI给了一个图片作为背景图 但是这个背景图我觉得不好看，因为里面的六边形动不了，效果不是很好 想要一个六边形随机闪烁的效果 所以我自己写了一个组件遍历生成了好多好多个六边形元素（5行 * 每行120个 共600个） 然后requestAnimationFrame
阅读全文
摘要：JS编写优先级： 数据逻辑编写 界面逻辑编写 事件监听函数绑定 数据逻辑和界面逻辑相分离，属于数据逻辑内部的事情不要交给页面逻辑处理。 尽可能降低数据冗余度，属于不同层的数据分别写到对应的层中。 做好基建工作，即把不同层的内部方法尽可能地定义好，后面遇到相似功能的时候组合基础方法就行了。 功能解耦，
阅读全文
摘要：面试题 浏览器是如何渲染页面的？ 当浏览器的网络线程收到 HTML 文档后，会产生一个渲染任务，并将其传递给渲染主线程的消息队列。 在事件循环机制的作用下，渲染主线程取出消息队列中的渲染任务，开启渲染流程。 整个渲染流程分为多个阶段，分别是： HTML 解析、样式计算、布局、分层、绘制、分块、光栅化
阅读全文
摘要：参考答案： 不⾏，因为： 计算机硬件没有原⼦钟，⽆法做到精确计时 操作系统的计时函数本身就有少量偏差，由于 JS 的计时器最终调⽤的是操作系统的函数，也就携带了这些偏差 按照 W3C 的标准，浏览器实现计时器时，如果嵌套层级超过 5 层，则会带有 4 毫秒的最少时间，这样在计时时间少于 4 毫秒时⼜
阅读全文
摘要：事件循环⼜叫做消息循环，是浏览器渲染主线程的⼯作⽅式。 在 Chrome 的源码中，它开启⼀个不会结束的 for 循环，每次循环从消息队列中取出第⼀个任务执⾏，⽽其他线程只需要在合适的时候将任务加⼊到队列末尾即可。 过去把消息队列简单分为宏队列和微队列，这种说法⽬前已⽆法满⾜复杂的浏览器环境，取⽽代
阅读全文
摘要：JS是⼀⻔单线程的语⾔，这是因为它运⾏在浏览器的渲染主线程中，⽽渲染主线程只有⼀个。 ⽽渲染主线程承担着诸多的⼯作，渲染⻚⾯、执⾏ JS 都在其中运⾏。如果使⽤同步的⽅式，就极有可能导致主线程产⽣阻塞，从⽽导致消息队列中的很多其他任务⽆法得到执⾏。 这样⼀来，⼀⽅⾯会导致繁忙的主线程⽩⽩的消耗时间，
阅读全文
摘要：这里有段代码 function a() { console.log(1); Promise.resolve().then(function aFn() { console.log(2); }); } setTimeout(function fn2() { console.log(3); Promis
阅读全文
摘要：主要有以下变化 1. Proxy取代Object.defineProperty 2. Suspense组件 - Loading动画 3. Teleport组件 - 传送组件dom至指定位置 4. Treeshaking - Vue中api移除即用即引 5. V-model升级 - sync合并/多级
阅读全文
摘要：Vue 实现 目前主要的设计思路都是基于Vue-Router配合后端返回角色权限定义进行设计。后端返回角色对应路由权限数据，返回形如 { role: ‘admin’, permissions: [‘Order’, …] }，其中permissions对应前端路由页面name，通过这样的形式后端动态返
阅读全文
摘要：ECMAScript 6.0（也可以称为 ECMAScript2015），ECMAScript 6.0 简称 ES6，是语言的标准。 出来的时间已经很久了，但是我们在工作中，有时候也不会使用。今天我们就来介绍一下。 1、块级作用域（let、const） 块级作用域，就是有{}括号中可用范围，不像之前
阅读全文
摘要：路由和组件的常用两种懒加载方式： 1、vue异步组件实现路由懒加载 component：resolve=>(['需要加载的路由的地址'，resolve]) 2、es提出的import(推荐使用这种方式) const HelloWorld = （）=>import('需要加载的模块地址') 一、为什么
阅读全文
摘要：1. 尤大在github中的回答是，由于diff算法的原因，只能有一个根节点。（他说可以改成多个根节点，但是需要对当前的算法进行大量修改，也是在Vue3中实现了） 2. 源码的patchVnode()方法就是比较新旧节点，利用数据结构，将整个文档利用“树”结构进行比对，从而对文档进行更新操作。dif
阅读全文
