-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
yk
committed
Apr 30, 2024
1 parent
c72d4a0
commit 37a6141
Showing
26 changed files
with
678 additions
and
48 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,7 +1,6 @@ | ||
--- | ||
title: 'React -- Hooks' | ||
date: 2022-11-27T11:28:43 | ||
+08:00 | ||
tags: [React] | ||
draft: true | ||
--- | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
--- | ||
title: 'Vue 源码中的设计美学' | ||
date: 2024-04-30 | ||
series: [] | ||
categories: [Vue] | ||
weight: | ||
--- | ||
|
||
## 为什么能通过 this.xxx 就能访问到对应的 methods 和 data | ||
|
||
```js {oppen=false} | ||
// test | ||
function sayHello() {} | ||
``` |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -4,7 +4,14 @@ | |
<link>http://localhost:1313/categories/</link> | ||
<description>Categories - 分类 - Hello World</description> | ||
<generator>Hugo -- gohugo.io</generator><language>zh-CN</language><managingEditor>[email protected] (EricYuan)</managingEditor> | ||
<webMaster>[email protected] (EricYuan)</webMaster><lastBuildDate>Wed, 21 Feb 2024 00:00:00 +0000</lastBuildDate><atom:link href="http://localhost:1313/categories/" rel="self" type="application/rss+xml" /><item> | ||
<webMaster>[email protected] (EricYuan)</webMaster><lastBuildDate>Tue, 30 Apr 2024 00:00:00 +0000</lastBuildDate><atom:link href="http://localhost:1313/categories/" rel="self" type="application/rss+xml" /><item> | ||
<title>Vue</title> | ||
<link>http://localhost:1313/categories/vue/</link> | ||
<pubDate>Tue, 30 Apr 2024 00:00:00 +0000</pubDate><author> | ||
<name>EricYuan</name> | ||
</author><guid>http://localhost:1313/categories/vue/</guid> | ||
<description><![CDATA[]]></description> | ||
</item><item> | ||
<title>Algorithm</title> | ||
<link>http://localhost:1313/categories/algorithm/</link> | ||
<pubDate>Wed, 21 Feb 2024 00:00:00 +0000</pubDate><author> | ||
|
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,30 @@ | ||
<rss xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"> | ||
<channel> | ||
<title>Vue - 分类 - Hello World</title> | ||
<link>http://localhost:1313/categories/vue/</link> | ||
<description>Vue - 分类 - Hello World</description> | ||
<generator>Hugo -- gohugo.io</generator><language>zh-CN</language><managingEditor>[email protected] (EricYuan)</managingEditor> | ||
<webMaster>[email protected] (EricYuan)</webMaster><lastBuildDate>Tue, 30 Apr 2024 00:00:00 +0000</lastBuildDate><atom:link href="http://localhost:1313/categories/vue/" rel="self" type="application/rss+xml" /><item> | ||
<title>Vue 源码中的设计美学</title> | ||
<link>http://localhost:1313/vue%E6%BA%90%E7%A0%81%E4%B8%AD%E7%9A%84%E8%AE%BE%E8%AE%A1%E7%BE%8E%E5%AD%A6/</link> | ||
<pubDate>Tue, 30 Apr 2024 00:00:00 +0000</pubDate><author> | ||
<name>EricYuan</name> | ||
</author><guid>http://localhost:1313/vue%E6%BA%90%E7%A0%81%E4%B8%AD%E7%9A%84%E8%AE%BE%E8%AE%A1%E7%BE%8E%E5%AD%A6/</guid> | ||
<description><![CDATA[ 为什么能通过 this.xxx 就能访问到对应的 methods 和 datafunction test { this.name = 'hello world' } ]]></description> | ||
</item><item> | ||
<title>Vue2响应式原理</title> | ||
<link>http://localhost:1313/vue%E5%93%8D%E5%BA%94%E5%BC%8F%E5%8E%9F%E7%90%86/</link> | ||
<pubDate>Wed, 26 Oct 2022 09:58:34 +0800</pubDate><author> | ||
<name>EricYuan</name> | ||
</author><guid>http://localhost:1313/vue%E5%93%8D%E5%BA%94%E5%BC%8F%E5%8E%9F%E7%90%86/</guid> | ||
<description><![CDATA[核心VUE2 的响应式原理实现主要基于: | ||
Object.defineProperty(obj, prop, descriptor) 观察者模式 init - reactive 化Vue 初始化实例时,通过 Object.defineProperty 为 data 中的所有数据添加 setter/getter。这个过程称为 reactive 化。 | ||
所以: | ||
vue 监听不到 data 中的对象属性的增加和删除,必须在初始化的时候就声明好对象的属性。 | ||
解决方案:或者使用 Vue 提供的 $set 方法;也可以用 Object.assign({}, source, addObj) 去创建一个新对象来触发更新。 | ||
Vue 也监听不到数组索引和长度的变化,因为当数据是数组时,Vue 会直接停止对数据属性的监测。至于为什么这么做,尤大的解释是:解决性能问题。 | ||
解决方案:新增用 $set,删除用 splice,Vue 对数组的一些方法进行了重写来实现响应式。 | ||
看下 defineReactive 源码: | ||
// 以下所有代码为简化后的核心代码,详细的见vue2的gihub仓库哈 export function defineReactive(obj: object, key: string, val?: any, ...otehrs) { const dep = new Dep() Object.defineProperty(obj, key, { enumerable: true, configurable: true, get: function reactiveGetter() { if (Dep.]]></description> | ||
</item></channel> | ||
</rss> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
<!DOCTYPE html> | ||
<html lang="zh-CN"> | ||
<head> | ||
<title>http://localhost:1313/categories/vue/</title> | ||
<link rel="canonical" href="http://localhost:1313/categories/vue/"> | ||
<meta name="robots" content="noindex"> | ||
<meta charset="utf-8"> | ||
<meta http-equiv="refresh" content="0; url=http://localhost:1313/categories/vue/"> | ||
</head> | ||
</html> |
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -4,7 +4,7 @@ | |
<link>http://localhost:1313/</link> | ||
<description>A website documenting front-end technology and everyday life</description> | ||
<generator>Hugo -- gohugo.io</generator><language>zh-CN</language><managingEditor>[email protected] (EricYuan)</managingEditor> | ||
<webMaster>[email protected] (EricYuan)</webMaster><lastBuildDate>Wed, 21 Feb 2024 00:00:00 +0000</lastBuildDate> | ||
<webMaster>[email protected] (EricYuan)</webMaster><lastBuildDate>Tue, 30 Apr 2024 00:00:00 +0000</lastBuildDate> | ||
<atom:link href="http://localhost:1313/index.xml" rel="self" type="application/rss+xml" /> | ||
<item> | ||
<title>Mysql_1_基础</title> | ||
|
@@ -120,13 +120,11 @@ useMemo 是加在数据上的缓存,而 memo api 是加在组件上的,只 | |
useCallbackconst cachedFn = useCallback(fn, dependencies) | ||
reference useMemo useCallback ]]></description> | ||
</item><item> | ||
<title>滑动窗口</title> | ||
<link>http://localhost:1313/%E6%BB%91%E5%8A%A8%E7%AA%97%E5%8F%A3/</link> | ||
<pubDate>Wed, 21 Feb 2024 00:00:00 +0000</pubDate><author> | ||
<title>Vue 源码中的设计美学</title> | ||
<link>http://localhost:1313/vue%E6%BA%90%E7%A0%81%E4%B8%AD%E7%9A%84%E8%AE%BE%E8%AE%A1%E7%BE%8E%E5%AD%A6/</link> | ||
<pubDate>Tue, 30 Apr 2024 00:00:00 +0000</pubDate><author> | ||
<name>EricYuan</name> | ||
</author><guid>http://localhost:1313/%E6%BB%91%E5%8A%A8%E7%AA%97%E5%8F%A3/</guid> | ||
<description><![CDATA[核心滑动窗口的核心就是维持一个 [i..j) 的区间窗口,在数据上游走,来获取到需要的信息,在数组,字符串等中的表现,往往如下: | ||
function slideWindow() { // 前后快慢双指针 let left = 0 let right = 0 /** 具体的条件逻辑根据实际问题实际处理,多做练习 */ while(slide condition) { window.push(s[left]) // s 为总数据(字符串、数组) right++ while(shrink condition) { window.shift(s[left]) left++ } } } 滑动窗口的算法时间复杂度为 O(n),适用于处理大型数据集 | ||
练一练 lc.3 无重复字符的最长子串/** * @param {string} s * @return {number} */ var lengthOfLongestSubstring = function (s) { let max = 0 let l = 0, r = 0 let window = {} while (r < s.]]></description> | ||
</author><guid>http://localhost:1313/vue%E6%BA%90%E7%A0%81%E4%B8%AD%E7%9A%84%E8%AE%BE%E8%AE%A1%E7%BE%8E%E5%AD%A6/</guid> | ||
<description><![CDATA[ 为什么能通过 this.xxx 就能访问到对应的 methods 和 datafunction test { this.name = 'hello world' } ]]></description> | ||
</item></channel> | ||
</rss> |
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -4,7 +4,7 @@ | |
<link>http://localhost:1313/posts/</link> | ||
<description>所有文章 | Hello World</description> | ||
<generator>Hugo -- gohugo.io</generator><language>zh-CN</language><managingEditor>[email protected] (EricYuan)</managingEditor> | ||
<webMaster>[email protected] (EricYuan)</webMaster><lastBuildDate>Wed, 21 Feb 2024 00:00:00 +0000</lastBuildDate><atom:link href="http://localhost:1313/posts/" rel="self" type="application/rss+xml" /><item> | ||
<webMaster>[email protected] (EricYuan)</webMaster><lastBuildDate>Tue, 30 Apr 2024 00:00:00 +0000</lastBuildDate><atom:link href="http://localhost:1313/posts/" rel="self" type="application/rss+xml" /><item> | ||
<title>Mysql_1_基础</title> | ||
<link>http://localhost:1313/mysql_1/</link> | ||
<pubDate>Thu, 30 Nov 2023 15:42:23 +0800</pubDate><author> | ||
|
@@ -118,13 +118,11 @@ useMemo 是加在数据上的缓存,而 memo api 是加在组件上的,只 | |
useCallbackconst cachedFn = useCallback(fn, dependencies) | ||
reference useMemo useCallback ]]></description> | ||
</item><item> | ||
<title>滑动窗口</title> | ||
<link>http://localhost:1313/%E6%BB%91%E5%8A%A8%E7%AA%97%E5%8F%A3/</link> | ||
<pubDate>Wed, 21 Feb 2024 00:00:00 +0000</pubDate><author> | ||
<title>Vue 源码中的设计美学</title> | ||
<link>http://localhost:1313/vue%E6%BA%90%E7%A0%81%E4%B8%AD%E7%9A%84%E8%AE%BE%E8%AE%A1%E7%BE%8E%E5%AD%A6/</link> | ||
<pubDate>Tue, 30 Apr 2024 00:00:00 +0000</pubDate><author> | ||
<name>EricYuan</name> | ||
</author><guid>http://localhost:1313/%E6%BB%91%E5%8A%A8%E7%AA%97%E5%8F%A3/</guid> | ||
<description><![CDATA[核心滑动窗口的核心就是维持一个 [i..j) 的区间窗口,在数据上游走,来获取到需要的信息,在数组,字符串等中的表现,往往如下: | ||
function slideWindow() { // 前后快慢双指针 let left = 0 let right = 0 /** 具体的条件逻辑根据实际问题实际处理,多做练习 */ while(slide condition) { window.push(s[left]) // s 为总数据(字符串、数组) right++ while(shrink condition) { window.shift(s[left]) left++ } } } 滑动窗口的算法时间复杂度为 O(n),适用于处理大型数据集 | ||
练一练 lc.3 无重复字符的最长子串/** * @param {string} s * @return {number} */ var lengthOfLongestSubstring = function (s) { let max = 0 let l = 0, r = 0 let window = {} while (r < s.]]></description> | ||
</author><guid>http://localhost:1313/vue%E6%BA%90%E7%A0%81%E4%B8%AD%E7%9A%84%E8%AE%BE%E8%AE%A1%E7%BE%8E%E5%AD%A6/</guid> | ||
<description><![CDATA[ 为什么能通过 this.xxx 就能访问到对应的 methods 和 datafunction test { this.name = 'hello world' } ]]></description> | ||
</item></channel> | ||
</rss> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.