孟余的博客 | My Blog

Reflect ？

How to use Reflect ?

在 JavaScript 中，Reflect 对象提供了与 Proxy 对象相同的 API，但其目的在于提供对对象操作的「静态方法」。什么是对象操作？比如说读取对象的某个属性， 1 2 const obj = { name: "Alice" }; const name = obj.name; // 读取属性上面的读取方式，是一种语法糖，实际上是通过 get 方法来实现的。 ...

Posted by My on June 18, 2022

vue3 性能提升

vue3 在性能上做了哪些优化？

对于 Vue3 的性能提升，涉及到比较多的方面，包括渲染、更新、编译、内存管理等。那就结合官方的介绍与实践，来看看 Vue3 在性能方面的优化。总体优化响应式系统 Vue 3 使用 Proxy 替代 Vue 2 中的 Object.defineProperty，这使得响应式系统更高效，能更好地追踪依赖。进行惰性的计算，只有在需要时才会访问响应式属性，减少不...

Posted by My on June 7, 2022

Event loop

怎么去理解 js 的事件循环机制？

这个问题想回答得很好，很难。我就简单记录一下我自己的理解。「事件循环」是浏览器渲染主线程的工作方式。同时，事件循环机制是 js 异步编程的核心，目的是协调 JavaScript 的执行和异步操作的回调，确保它们在适当的顺序中被处理。JavaScript 是单线程的，这意味着它在任何时刻只能执行一个任务。事件循环通过管理「执行栈」和「任务队列」来处理这一限制。在 W3C 中，给出了 J...

Posted by My on June 5, 2022

Why do we need virtual dom?

What is the role of virtual dom?

为什么我们需要虚拟 DOM？也许之前我们会回答，虚拟 DOM 是为了提高性能，减少 DOM 操作，提升用户体验。但是，svelte 并没有使用虚拟 DOM，而是直接操作真实的 DOM，并且效率还更高了。确实我们减少了真实 DOM 的操作，但如「vue」和「react」，最后还是得去操作真实的 DOM。所以看来，使用虚拟 Dom 好像并不是为了提高性能。那我们从其他层面来分析下这个问题。...

Posted by My on May 30, 2022

Prototype and prototype chain ?

原型与原型链之间错杂的关系

原型和原型链看起来错综复杂，但是如果把其中的关系分开理清楚，还是很好理解的，但也不是一句话就能够说清楚，还是需要从几个点依次去分析的。对象所有对象都是 new 一个函数出来的。{}只是语法糖。通过老师的讲解，可以先理解他们之间的关系下面我们开始对他们的关系进行梳理，看这张图，理解 new。比如说我们有一个普通函数 obj，我们将通过 new 这个函数，创造一...

Posted by My on May 22, 2022

What is a Promise ?

What is the concept of promise and how to use promise ?

引言什么是「Promise」? 对于后面入门的同学来说，能回答的应该就是「异步」、「回调」等相关了，当然这也与我们的学习路程有关。有的同学是本专业，但是涉及不深，也不知道。有的同学是一般培训机构的，了解完「html」和框架，就开始写业务。有的同学是自学的，阅读层次没有达到那么深。回归正传，「Promise」意为承诺，那到底如何去理解呢？ Promise 在谈论到「Promise」的时...

Posted by My on May 14, 2022

Proxy 与 DefineProperty 的区别是什么？

如何从语义层或者操作层里理解 Proxy 与 DefineProperty

一个是 vue3 的响应式原理，一个是 vue2 的，那两者的实质性区别到底是什么？我们分别来分析一下各自的特点。 Proxy 它在 MDN 上的解读是这样的： The Proxy object enables you to create a proxy for another object,which can intercept and redefine fundamental...

Posted by My on May 10, 2022

高阶函数（HOF）

What are higher-order functions and how to use them

引言函数就是自变量与因变量之间的映射关系，在编程里，函数增强代码的可维护性、可读性，进行逻辑抽象和解耦等，其作用不可谓不大。那「高阶函数」又是什么，维基百科是这么介绍的，核心就两点： takes one or more functions as arguments. returns a function or value as its result. 「只要满足了其中一点...

Posted by My on May 5, 2022

闭包与内存泄漏的纠葛

闭包与内存泄漏有什么关系，如何理解垃圾回收

经常会被问到什么是闭包，说说你对闭包的理解，闭包会引起内存泄漏吗等等问题。要清楚闭包与内存泄漏的关系，则得先了解什么是「垃圾回收」。那什么是「垃圾」呢？一直以来也没有明确的定义，但都形成了一个共识，那就是「不再需要的内存」，这些内存里的数据就是「垃圾」。那什么又是「不再需要」呢？这个是由开发者决定的，需不需要取决于你。比如说： 1 2 3 4 5 6 7 8 9 10 11 12 1...

Posted by My on April 27, 2022

Vue Slot

如何重新解读 vue slot?

官网文档，对插槽做出相关的定义，例如「默认插槽」、「具名插槽」和「作用域插槽」。那现在我们用另一种方式来解析插槽(slot) 的本质。我们姑且将定义声明插槽的组件叫做「子组件（comp）」。现在子组件有这样的格式： 1 2 3 4 5 6 7 8 9 //comp.vue <template> <div> <slot><...

Posted by My on April 24, 2022

My Blog