- 博客(18)
- 资源 (5)
- 收藏
- 关注
RSS订阅原创 实现vue3响应式系统核心-shallowReactive
今天来实现一下这个 API。reactive函数是一个深响应，当你取出的值为对象类型，需要再次调用reactive进行响应式处理。很明显我们目前的代码是一个浅响应，即 只代理了对象的第一层，也就是。代码地址： https://github.com/SuYxh/share-vue3代码并没有按照源码的方式去进行组织，目的是学习、实现 vue3 响应式系统的核心，用最少的代码去实现最核心的能力，减少我们的学习负担，并且所有的流程都会有配套的图片，图文 + 代码，让我们学习更加轻松、快乐。
2024-01-31 10:32:13
742
原创 实现vue3响应式系统核心-合理触发响应
拦截in操作符拦截for in循环拦截对象的删除操作接下来我们在对响应式系统做一些优化，避免一些不必要的响应代码地址： https://github.com/SuYxh/share-vue3代码并没有按照源码的方式去进行组织，目的是学习、实现 vue3 响应式系统的核心，用最少的代码去实现最核心的能力，减少我们的学习负担，并且所有的流程都会有配套的图片，图文 + 代码，让我们学习更加轻松、快乐。每一个功能都会提交一个commit，大家可以切换查看，也顺变练习练习 git 的使用。
2024-01-31 10:31:12
634
原创 实现vue3响应式系统核心-增强对象拦截
在之前的文章中我们实现一个响应式系统的 MVP 模型，也实现了computedwatch等。如何拦截in操作符呢？如何拦截for in循环呢？如何拦截对象的删除操作呢？接下来我们会一步步实现这些功能，进一步增强 MVP 模型。代码地址： https://github.com/SuYxh/share-vue3。
2024-01-30 09:56:37
1084
原创 实现vue3响应式系统核心-watch
今天我们来看看watch的实现。watch本质就是观测一个响应式数据，当数据发生变化时通知并执行相应的回调函数。实际上，watch的实现本质上就是利用了effect以及选项。代码地址： https://github.com/SuYxh/share-vue3代码并没有按照源码的方式去进行组织，目的是学习、实现 vue3 响应式系统的核心，用最少的代码去实现最核心的能力，减少我们的学习负担，并且所有的流程都会有配套的图片，图文 + 代码，让我们学习更加轻松、快乐。每一个功能都会提交一个commit。
2024-01-30 09:55:38
1228
原创 实现vue3响应式系统核心-computed
在之前的文章中介绍了effect函数，它用来注册副作用函数，同时它也允许指定一些选项参数options，例如指定scheduler调度器来控制副作用函数的执行时机和方式；也介绍了用来追踪和收集依赖的track函数，以及用来触发副作用函数重新执行的trigger函数。综合这些内容，我们就可以实现 Vue.js 中一个非常重要并且非常有特色的能力——计算属性。代码地址： https://github.com/SuYxh/share-vue3。
2024-01-29 11:02:46
686
原创 实现vue3响应式系统核心-scheduler
可调度性是响应系统非常重要的特性。首先我们需要明确什么是可调度性。所谓可调度，指的是当 `trigger` 动作触发副作用函数重新执行时，有能力决定副作用函数执行的时机、次数以及方式。
2024-01-29 10:58:00
527
原创 实现vue3响应式系统核心-嵌套effect
嵌套 effecteffect 支持自增运算符代码地址： https://github.com/SuYxh/share-vue3代码并没有按照源码的方式去进行组织，目的是学习、实现 vue3 响应式系统的核心，用最少的代码去实现最核心的能力，减少我们的学习负担，并且所有的流程都会有配套的图片，图文 + 代码，让我们学习更加轻松、快乐。每一个功能都会提交一个commit，大家可以切换查看，也顺变练习练习 git 的使用。
2024-01-25 10:00:00
738
原创 实现 vue3 响应式系统核心-依赖清理
在[实现vue3响应式系统核心-MVP 模型](./实现vue3响应式系统核心-MVP 模型) 文章中我们介绍了一个最基础的响应式系统。今天的目标是实现依赖清理，依然使用 TDD 的模式进行，再利用 ChatGPT 进行高效学习。
2024-01-24 20:10:05
854
原创 实现vue3响应式系统核心-MVP 模型
- TDD 测试驱动开发- 重构- vitest的使用- 如何使用 [ChatGPT](https://ask.vuejs.news/) 编写单元测试- 响应式数据以及副作用函数- 响应式系统基本实现- Vue3 的响应式的数据结构是什么样？为什么是这样？如何形成的？- Proxy 为什么要配合 Reflect 使用？如果不配合会有什么问题？- Map 与 WeakMap的区别- 依赖收集- 派发更新- 依赖清理- 支持嵌套
2024-01-21 19:59:12
809
原创 JWT原理详解
JWT原理详解随着前后端分离的发展，以及数据中心的建立，越来越多的公司会创建一个中心服务器，服务于各种产品线。而这些产品线上的产品，它们可能有着各种终端设备，包括但不仅限于浏览器、桌面应用、移动端应用、平板应用、甚至智能家居实际上，不同的产品线通常有自己的服务器，产品内部的数据一般和自己的服务器交互。但中心服务器仍然有必要存在，因为同一家公司的产品总是会存在共享的数据，比如用户数据这些设备与中心服务器之间会进行http通信一般来说，中心服务器至少承担着认证和授权的功能，例如登录：各种设备发
2020-09-27 14:22:33
3224
2
原创 导致position:sticky失效的原因
导致position:sticky失效的原因一、简介sticky 英文字面意思是粘，粘贴，所以称之为粘性定位。sticky属性依赖于用户的滚动，在 position:relative 与 position:fixed 定位之间切换。元素定位表现为在跨越特定阈值前为相对定位，之后为固定定位。这个特定阈值指的是 top, right, bottom 或 left 之一，即指定 top, right, bottom 或 left 四个阈值其中之一，才可使粘性定位生效。二、使用条件sticky属性仅在以下
2020-09-22 13:35:29
8487
原创 选出数组中的重复元素
方法一:indexOfindexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置,如果在数组中没找到指定元素则返回 -1。(function isRepeat() { let arr = ['123', '789', '334', '123', '334'] for (let i = 0; i < arr.length; i++) { console.log(arr.indexOf(arr[i]));
2020-09-21 18:31:30
782
原创 mongodb 实现模糊查询
mongodb 实现模糊查询模糊查询：name字段包含某个关键字"测试"：db.test_info.find({"name": {$regex: '测试', $options:'i'}})
2020-09-15 09:57:59
1692
原创 axios详解
axios详解一、axios简介基于promise，用于浏览器和node.js的http客户端二、特点支持浏览器和 node.js支持 promise能拦截请求和响应能转换请求和响应数据能取消请求自动转换 JSON 数据浏览器端支持防止 CSRF (跨站请求伪造)三、安装1、 利用 npm 安装 npm install axios --save2、 利用 bower 安装 bower install axios --save3、 直接利用 cdn 引入 ``四、例子GET请求
2020-09-14 15:39:17
1474
原创 详解Nginx
一、安装Nginx1、准备工作（1）打开虚拟机，使用远程连接工具连接 linux 操作系统（2）到 nginx 官网下载软件http://nginx.org/2、开始进行 nginx 安装（1）安装 pcre 依赖第一步 联网下载 pcre 压缩文件依赖wget http://downloads.sourceforge.net/project/pcre/pcre/8.37/pcre...
2020-03-06 16:20:44
343
原创 CSS3中translate、transform和translation的区别和联系
translate:移动，transform的一个方法通过 translate() 方法，元素从其当前位置移动，根据给定的 left（x 坐标） 和 top（y 坐标） 位置参数：用法transform: translate(50px, 100px);-ms-transform: translate(50px,100px);-webkit-transform: translate(50px...
2020-02-13 15:01:47
228
原创 超级详细的IDC搭建教程
超级详细的IDC搭建教程一、准备工作1.下载SWAPIDC系统2.N台搭建idc的服务器（提示：推荐使用国外服务器，也可以在腾讯云，阿里云，景安等平台购买！）3.一台搭建销售idc平台的虚拟主机或服务器 ！（推荐剑心主机，有福利空间供学习测试使用：剑心Network）4.一丢丢的小智商和建站技术5.答题答案在最下面，如果不懂可查看答案！二、教程开始第一：搭建IDC平台源码在官网注...
2018-12-04 18:16:45
11981
2
PHP注入工具大全-2020.zip
2020-05-18
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人