很多人提起 Vue 中的 computed，第一反应就是计算属性会缓存，那么它到底是怎么缓存的呢？缓存的到底是什么，什么时候缓存会失效，相信还是有很多人对此很模糊。 本文以 Vue 2.6.11 版本为基础，就深入原理，带你来看看所谓的缓存到底是什么样的。 本文假定你对 Vue…

得为computed属性创建watcher（正是computed-watcher），并添加到相关data属性值的订阅者队列里。watcher的回调函数正是computed属性值（函数） computed属性值的变化是由data属性变化引起的。因此若想模板也跟着变化，render…

最大安全数字：Number.MAX_SAFE_INTEGER = Math.pow(2, 53) - 1，转换成整数就是 16 位，所以 0.1 === 0.1，是因为通过 toPrecision(16) 去有效位之后，两者是相等的。 在两数相加时，会先转换成二进制，0.1 和…

手写其实在前端的面试过程中必不可少，因为手写是考验你了解某一原理的最可观的体现。下面我汇总了一些，我在面试复习过程中遇到的手写题。我将实现思路写出来与大家共享，而实现只是一个参考，有兴趣的可以点击参考答案，有问题请指正。 new操作符返回的是一个对象。 1、参数不能取第一个，因…

目标：通过面试题来让自己的知识面更加广，更加深入。 key会用在虚拟DOM算法（diff算法）中，用来辨别新旧节点。 不带key的时候会最大限度减少元素的变动，尽可能用相同元素。（就地复用） 带key的时候，会基于相同的key来进行排列。（相同的复用） 上面这么4点就是官方文档…

MVVM的核心是数据驱动即ViewModel，ViewModel是View和Model的关系映射。MVVM本质就是基于操作数据来操作视图进而操作DOM，借助于MVVM无需直接操作DOM，开发者只需编写ViewModel中有业务，使得View完全实现自动化。 SPA（ singl…

目标是写一个非常详细的关于diff的干货，所以本文有点长。也会用到大量的图片以及代码举例，一起来get吧。 先来了解几个点... 1. 当数据发生变化时，vue是怎么更新节点的？ 要知道渲染真实DOM的开销是很大的，比如有时候我们修改了某个数据，如果直接渲染到真实dom上会引起…

在我们的实际项目中，与Vue的生命周期打交道可以说是家常便饭。掌握Vue的生命周期对开发者来说是特别重要的。那么如果能够从源码角度理解Vue的生命周期，对我们的开发和成长会有进一步的提升。 本文从基础知识开始讲起，分为基础知识和源码解读两部分，对基础知识已经掌握的开发者可自行跳…

Vue的数据响应主要是依赖了Object.defineProperty()，那么整个过程是怎么样的呢？以我们自己的想法来走Vue的道路，其实也就是以Vue的原理为终点，我们来逆推一下实现过程。 例如const obj = {},然后再调用defineReactive(obj,'…