From d916d11769ddae512357c35d20793f0bbc98e277 Mon Sep 17 00:00:00 2001 From: yk Date: Mon, 18 Sep 2023 10:21:00 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BF=AE=E6=94=B9=E5=9B=BE=E7=89=87cdn?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- content/about.md | 2 +- ...\344\271\21301\350\203\214\345\214\205.md" | 2 +- ...14\345\205\250\350\203\214\345\214\205.md" | 2 +- ...66\346\200\201\345\216\213\347\274\251.md" | 6 +++--- ...345\216\211\345\256\263\347\232\204KMP.md" | 2 +- .../\345\215\225\350\260\203\346\240\210.md" | 2 +- ...15\345\216\206\346\214\207\345\215\227.md" | 2 +- content/posts/base-css/SC.md | 2 +- content/posts/base-js/EventLoop.md | 2 +- ...346\267\267\346\267\206\347\232\204API.md" | 6 +++--- ...7\224\237\345\270\270\350\260\210-This.md" | 2 +- ...76\345\222\214\347\273\247\346\211\277.md" | 2 +- ...0\350\260\210-\351\227\255\345\214\205.md" | 2 +- ...--\347\273\223\346\236\204\345\236\213.md" | 2 +- content/posts/english/en.md | 2 +- ...21\347\273\234\346\250\241\345\236\213.md" | 6 +++--- ...15\344\270\226\344\273\212\347\224\237.md" | 4 ++-- .../posts/http/\350\267\250\345\237\237.md" | 2 +- ...rl\345\210\260\346\270\262\346\237\223.md" | 2 +- content/posts/java/java_2.md | 4 ++-- content/posts/java/java_3.md | 2 +- content/posts/java/java_7.md | 2 +- content/posts/java/java_8.md | 4 ++-- content/posts/java/java_9.md | 20 +++++++++++++++++++ ...13\350\221\261\346\250\241\345\236\213.md" | 2 +- ...00\347\202\271\347\273\217\351\252\214.md" | 6 +++--- ...72\347\241\200\345\216\237\347\220\206.md" | 2 +- ...2\347\241\200\345\216\237\347\220\2062.md" | 4 ++-- ...2\347\241\200\345\216\237\347\220\2065.md" | 4 ++-- ...200\345\216\237\347\220\2068-Scheduler.md" | 2 +- ...17\345\214\226\345\273\272\350\256\256.md" | 2 +- content/posts/tool/lerna.md | 2 +- .../tool/linux\345\237\272\347\241\200.md" | 2 +- .../\346\267\261\345\205\245npm_script.md" | 2 +- ...24\345\274\217\345\216\237\347\220\206.md" | 6 +++--- content/posts/webpack/webpack.md | 8 ++++---- .../webpack/webpack\344\271\213loader.md" | 2 +- .../webpack/webpack\344\271\213plugin.md" | 2 +- ...16\347\237\245\350\257\206\347\202\271.md" | 2 +- 39 files changed, 76 insertions(+), 56 deletions(-) create mode 100644 content/posts/java/java_9.md diff --git a/content/about.md b/content/about.md index 8dc369c..974fd80 100644 --- a/content/about.md +++ b/content/about.md @@ -15,7 +15,7 @@ statistics: 'false'
邮箱： yokiizx@163.com
期望工作地： 苏州、上海
- +
diff --git "a/content/posts/algorithm/dp/\345\212\250\346\200\201\350\247\204\345\210\222\344\271\21301\350\203\214\345\214\205.md" "b/content/posts/algorithm/dp/\345\212\250\346\200\201\350\247\204\345\210\222\344\271\21301\350\203\214\345\214\205.md" index f197e32..f258046 100644 --- "a/content/posts/algorithm/dp/\345\212\250\346\200\201\350\247\204\345\210\222\344\271\21301\350\203\214\345\214\205.md" +++ "b/content/posts/algorithm/dp/\345\212\250\346\200\201\350\247\204\345\210\222\344\271\21301\350\203\214\345\214\205.md" @@ -8,7 +8,7 @@ date: 2022-10-12T03:31:28+08:00 借用一下代码随想录的图： -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210161922324.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210161922324.png) --- diff --git "a/content/posts/algorithm/dp/\345\212\250\346\200\201\350\247\204\345\210\222\344\271\21302\345\256\214\345\205\250\350\203\214\345\214\205.md" "b/content/posts/algorithm/dp/\345\212\250\346\200\201\350\247\204\345\210\222\344\271\21302\345\256\214\345\205\250\350\203\214\345\214\205.md" index 390d3d1..e9e2492 100644 --- "a/content/posts/algorithm/dp/\345\212\250\346\200\201\350\247\204\345\210\222\344\271\21302\345\256\214\345\205\250\350\203\214\345\214\205.md" +++ "b/content/posts/algorithm/dp/\345\212\250\346\200\201\350\247\204\345\210\222\344\271\21302\345\256\214\345\205\250\350\203\214\345\214\205.md" @@ -5,7 +5,7 @@ date: 2022-10-12T04:31:28+08:00 首先，继续看一下 01 背包中引用的图吧。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210161922324.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210161922324.png) 与 01 背包的区别就是 物品是无限的。在做选择时，同样也是只有两种，选择和不选择。 diff --git "a/content/posts/algorithm/dp/\345\212\250\346\200\201\350\247\204\345\210\222\344\271\213\347\212\266\346\200\201\345\216\213\347\274\251.md" "b/content/posts/algorithm/dp/\345\212\250\346\200\201\350\247\204\345\210\222\344\271\213\347\212\266\346\200\201\345\216\213\347\274\251.md" index 652bb7d..473f137 100644 --- "a/content/posts/algorithm/dp/\345\212\250\346\200\201\350\247\204\345\210\222\344\271\213\347\212\266\346\200\201\345\216\213\347\274\251.md" +++ "b/content/posts/algorithm/dp/\345\212\250\346\200\201\350\247\204\345\210\222\344\271\213\347\212\266\346\200\201\345\216\213\347\274\251.md" @@ -23,11 +23,11 @@ for (int i = n - 2; i >= 0; i--) { 对于上方递推公式，`dp[i][j]` 只依赖于 `dp[i+1][j-1]`,`dp[i+1][j]`,`dp[i][j-1]`，见下图。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210180953079.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210180953079.png) 记住：**空间压缩的核心思路就是，将二维数组「投影」到一维数组**： -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210181835977.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210181835977.png) > 在代码中呢，就是无脑去掉 dp[i][j] 的 [i] 这个维度，去掉维度后，可能会产生覆盖问题。 > 然后思考每个一维 dp 的含义。 @@ -65,7 +65,7 @@ for (int i = n - 2; i >= 0; i--) { 当遍历索引 1 时, 先把索引 1 的值用 temp 存住, 然后索引 1 会被新的值 new 去覆盖掉, 遍历到索引 2 时, 需要根据 dp[j-1] 也就是刚刚被覆盖掉后新值 new (原二维 dp[i][j-1]) 和索引 1 之前的值 temp (原二维 dp[i+1][j-1]) 以及 索引 2 被赋值之前的值 dp[j] (原二维 dp[i+1][j])来推导出。如下图 😂(画的有点简约了哈) -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210182331990.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210182331990.png) 更简单的，如果 dp[i][j] 只与 dp[i-1][...] 相关，投影到一维上，那更可以压缩状态啦，而且还没有覆盖的问题。 两个注意点： diff --git "a/content/posts/algorithm/string/\345\216\211\345\256\263\347\232\204KMP.md" "b/content/posts/algorithm/string/\345\216\211\345\256\263\347\232\204KMP.md" index d5e38ff..f03065e 100644 --- "a/content/posts/algorithm/string/\345\216\211\345\256\263\347\232\204KMP.md" +++ "b/content/posts/algorithm/string/\345\216\211\345\256\263\347\232\204KMP.md" @@ -59,7 +59,7 @@ c - 如果 `s[i] === s[j]` ，那么 `π(i) = j + 1`; - 如果 `s[i] !== s[j]`，那么挪动指针 `j` 到下一个最长的可能匹配的位置，即 j 指针的前一位 π 函数的位置 `j = π(j - 1)`（重难点！！！） -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202304141407906.svg) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202304141407906.svg) ### 试一试：[28. 找出字符串中第一个匹配项的下标](https://leetcode.cn/problems/find-the-index-of-the-first-occurrence-in-a-string/) diff --git "a/content/posts/algorithm/\345\215\225\350\260\203\346\240\210.md" "b/content/posts/algorithm/\345\215\225\350\260\203\346\240\210.md" index a4bcc8c..1cc4f6a 100644 --- "a/content/posts/algorithm/\345\215\225\350\260\203\346\240\210.md" +++ "b/content/posts/algorithm/\345\215\225\350\260\203\346\240\210.md" @@ -151,7 +151,7 @@ var dailyTemperatures = function(temperatures) { 这道题很经典，经典中的经典，解法很多：双指针/动态规划/单调栈，此处使用单调栈的方式来解题。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202301311545709.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202301311545709.png) 单调栈的解法是有点绕头的，需要按照上图的方式去计算面积，这么想就容易理解点了。 diff --git "a/content/posts/algorithm/\346\225\260\347\273\204\351\201\215\345\216\206\346\214\207\345\215\227.md" "b/content/posts/algorithm/\346\225\260\347\273\204\351\201\215\345\216\206\346\214\207\345\215\227.md" index a2eeaf4..528490a 100644 --- "a/content/posts/algorithm/\346\225\260\347\273\204\351\201\215\345\216\206\346\214\207\345\215\227.md" +++ "b/content/posts/algorithm/\346\225\260\347\273\204\351\201\215\345\216\206\346\214\207\345\215\227.md" @@ -105,7 +105,7 @@ while (count <= 25) { - 主对角线：左上角到有下角，坐标 i === j - 副对角线：右上角到做下角，坐标 i + j === len - 1 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202303291708525.png) 如图，按照这样的顺序怎么遍历呢？ +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202303291708525.png) 如图，按照这样的顺序怎么遍历呢？ ```TS // 数组大小为 5 * 5, 斜线对应索引为 [1, 4]，所以外层for遍历斜线 diff --git a/content/posts/base-css/SC.md b/content/posts/base-css/SC.md index fa6c8a6..92fe627 100644 --- a/content/posts/base-css/SC.md +++ b/content/posts/base-css/SC.md @@ -8,7 +8,7 @@ tags: [CSS] DOM 发生重叠在垂直方向上的显示顺序： -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/20221006131841.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/20221006131841.png) 从最低到最高实际上是 `装饰->布局->内容` 的变化，比如内联才比浮动的高。 diff --git a/content/posts/base-js/EventLoop.md b/content/posts/base-js/EventLoop.md index 537e446..f0cb9fb 100644 --- a/content/posts/base-js/EventLoop.md +++ b/content/posts/base-js/EventLoop.md @@ -15,7 +15,7 @@ HTML5 新增了 Web Worker，但完全受控于主线程，不能操作 I/O,DOM ## 代码执行 如下图，JS 内存模型分为三种，栈空间，堆空间和代码执行空间。基本类型数据和引用类型数据的指针存储在栈中，引用类型数据存储在堆中 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/20220926221003.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/20220926221003.png) 之前作用域的文章里提到过三个上下文，全局上下文，函数上下文，eval 上下文。当代码执行的时候需要一个栈来存储各个上下文的，这样才能保证后进入的上下文先执行结束（这里的后是指内部的嵌套函数）。 diff --git "a/content/posts/base-js/\345\256\271\346\230\223\346\267\267\346\267\206\347\232\204API.md" "b/content/posts/base-js/\345\256\271\346\230\223\346\267\267\346\267\206\347\232\204API.md" index b26f21e..5026416 100644 --- "a/content/posts/base-js/\345\256\271\346\230\223\346\267\267\346\267\206\347\232\204API.md" +++ "b/content/posts/base-js/\345\256\271\346\230\223\346\267\267\346\267\206\347\232\204API.md" @@ -37,14 +37,14 @@ tags: [JavaScript, DOM] - getElementsBy\* 返回的是 HTMLCollection - querySelectorAll 返回值是 NodeList -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/20220918155922.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/20220918155922.png) > HTMLCollection 比 NodeList 多了个 `namedItem(name)` 方法，根据 name 属性获取 dom > NodeList 相比 HTMLCollection 多了更多的信息，比如注释，文本等 ## navigator | location | history -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/20220918151505.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/20220918151505.png) ### navigator @@ -58,7 +58,7 @@ location 顾名思义，主要是对地址栏 URL 的操作。 具体如下: `location.xxx` -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/20220918164450.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/20220918164450.png) 两个主要点： diff --git "a/content/posts/base-js/\350\200\201\347\224\237\345\270\270\350\260\210-This.md" "b/content/posts/base-js/\350\200\201\347\224\237\345\270\270\350\260\210-This.md" index 2338243..44be6a1 100644 --- "a/content/posts/base-js/\350\200\201\347\224\237\345\270\270\350\260\210-This.md" +++ "b/content/posts/base-js/\350\200\201\347\224\237\345\270\270\350\260\210-This.md" @@ -4,7 +4,7 @@ date: 2022-09-17T01:25:06+08:00 tags: [JavaScript] --- -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/this.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/this.png) 回想起刚刚进入这行的时候，被 this 没少折腾，回忆记录一下吧~ diff --git "a/content/posts/base-js/\350\200\201\347\224\237\345\270\270\350\260\210-\345\216\237\345\236\213\351\223\276\345\222\214\347\273\247\346\211\277.md" "b/content/posts/base-js/\350\200\201\347\224\237\345\270\270\350\260\210-\345\216\237\345\236\213\351\223\276\345\222\214\347\273\247\346\211\277.md" index f3a064f..58e6c67 100644 --- "a/content/posts/base-js/\350\200\201\347\224\237\345\270\270\350\260\210-\345\216\237\345\236\213\351\223\276\345\222\214\347\273\247\346\211\277.md" +++ "b/content/posts/base-js/\350\200\201\347\224\237\345\270\270\350\260\210-\345\216\237\345\236\213\351\223\276\345\222\214\347\273\247\346\211\277.md" @@ -4,7 +4,7 @@ date: 2022-09-17T01:20:45+08:00 tags: [JavaScript] --- -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/prototype.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/prototype.png) ## 正如上图 diff --git "a/content/posts/base-js/\350\200\201\347\224\237\345\270\270\350\260\210-\351\227\255\345\214\205.md" "b/content/posts/base-js/\350\200\201\347\224\237\345\270\270\350\260\210-\351\227\255\345\214\205.md" index b834d41..61157c0 100644 --- "a/content/posts/base-js/\350\200\201\347\224\237\345\270\270\350\260\210-\351\227\255\345\214\205.md" +++ "b/content/posts/base-js/\350\200\201\347\224\237\345\270\270\350\260\210-\351\227\255\345\214\205.md" @@ -5,7 +5,7 @@ tags: [JavaScript] description: '清楚了作用域和变量对象，才能真正理解什么是闭包' --- -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/closure.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/closure.png) ## 开门见山 diff --git "a/content/posts/base-js/\350\256\276\350\256\241\346\250\241\345\274\217--\347\273\223\346\236\204\345\236\213.md" "b/content/posts/base-js/\350\256\276\350\256\241\346\250\241\345\274\217--\347\273\223\346\236\204\345\236\213.md" index 4ab0465..ec64387 100644 --- "a/content/posts/base-js/\350\256\276\350\256\241\346\250\241\345\274\217--\347\273\223\346\236\204\345\236\213.md" +++ "b/content/posts/base-js/\350\256\276\350\256\241\346\250\241\345\274\217--\347\273\223\346\236\204\345\236\213.md" @@ -55,7 +55,7 @@ console.log(adaptee.request()); // Adapter: (TRANSLATED) new: Special behavior o 注意：这里的抽象与实现与编程语言的概念不是一回事。抽象指的是用户界面，实现指的是底层操作代码。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202303141146609.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202303141146609.png) 假设我们正在设计一个图形化编辑器，其中包括不同种类的形状，例如圆形、矩形、三角形等。同时，每个形状可以具有不同的颜色，例如红色、绿色、蓝色等。 ```TS diff --git a/content/posts/english/en.md b/content/posts/english/en.md index 44358bf..eab6561 100644 --- a/content/posts/english/en.md +++ b/content/posts/english/en.md @@ -124,7 +124,7 @@ material image dance lose female 这几个单词于我而言发音需要纠正 ### 时态总结 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202308251435558.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202308251435558.png) 其中有以下几个注意点： diff --git "a/content/posts/http/TCP-IP\347\275\221\347\273\234\346\250\241\345\236\213.md" "b/content/posts/http/TCP-IP\347\275\221\347\273\234\346\250\241\345\236\213.md" index bde1f63..cf17311 100644 --- "a/content/posts/http/TCP-IP\347\275\221\347\273\234\346\250\241\345\236\213.md" +++ "b/content/posts/http/TCP-IP\347\275\221\347\273\234\346\250\241\345\236\213.md" @@ -11,7 +11,7 @@ TCP/IP 模型是互联网的基础，它是一系列网络协议的总称。这 - 网络层，地址管理与路由选择（IP...） - 链路层，互连设备之间传送和识别数据帧。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210202335427.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210202335427.png) --- @@ -19,7 +19,7 @@ TCP/IP 模型是互联网的基础，它是一系列网络协议的总称。这 在传输层，核心的就是 TCP 了，三次握手四次挥手那更是老生常谈的问题了。简单记录下常见面试题，详细的见文末参考文章，或者自行 google~ -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210210008339.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210210008339.png) 1. 为啥握手是三次 双端确认各自及对方的接收、发送能力正常。 @@ -32,7 +32,7 @@ TCP/IP 模型是互联网的基础，它是一系列网络协议的总称。这 3. SYN 攻击是什么 服务器端的资源分配是在二次握手时分配的。就是利用大量不存在的 IP 来向服务器发送连接请求，服务端回复后等待第三次连接，因为客户端 IP 根本不存在，所以会成为半连接，服务端会不断重发直至超时，大量的半连接导致正常的 SYN 请求因为队列满而被丢弃，从而引起网络拥塞甚至系统瘫痪。SYN 攻击是一种典型的 DoS/DDoS 攻击。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210210009002.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210210009002.png) 1. 为啥挥手是四次 因为服务端接收到 FIN 的时候，很可能并不能立刻关闭连接，所以先只回复了应答 ACK 报文，告诉服务端我知道了，等服务端报文发送完毕后，再发送 FIN 报文同步关闭。 diff --git "a/content/posts/http/http\345\211\215\344\270\226\344\273\212\347\224\237.md" "b/content/posts/http/http\345\211\215\344\270\226\344\273\212\347\224\237.md" index 3b5aa23..2261e8a 100644 --- "a/content/posts/http/http\345\211\215\344\270\226\344\273\212\347\224\237.md" +++ "b/content/posts/http/http\345\211\215\344\270\226\344\273\212\347\224\237.md" @@ -71,7 +71,7 @@ http/2 是二进制协议。 > 在一条链接上可以有多个流，流与流之间是互不影响的，当一个流出现丢包影响范围非常小，从而解决队头阻塞问题 建立一个 HTTPS 的连接，先是 TCP 的三次握手，然后是 TLS 的三次握手，要整出六次网络交互，一个链接才建好，虽说 HTTP/1.1 和 HTTP/2 的连接复用解决这个问题，但是基于 UDP 后，UDP 也得要实现这个事。于是 QUIC 直接把 TCP 的和 TLS 的合并成了三次握手（对此，在 HTTP/2 的时候，是否默认开启 TLS 业内是有争议的，反对派说，TLS 在一些情况下是不需要的，比如企业内网的时候，而支持派则说，TLS 的那些开销，什么也不算了）。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210251606478.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210251606478.png) QUIC 是一个在 UDP 之上的伪 TCP +TLS +HTTP/2 的多路复用的协议。 目前看下来，HTTP/3 目前看上去没有太多的协议业务逻辑上的东西，更多是 HTTP/2 + QUIC 协议。但，HTTP/3 因为动到了底层协议，所以，在普及方面上可能会比 HTTP/2 要慢的多的多。 @@ -124,7 +124,7 @@ Https 结合两种加密方式的特长，采用公开秘钥加密进行共享 https 握手过程 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210272237638.jpeg) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210272237638.jpeg) ## 参考 diff --git "a/content/posts/http/\350\267\250\345\237\237.md" "b/content/posts/http/\350\267\250\345\237\237.md" index dd62344..5178765 100644 --- "a/content/posts/http/\350\267\250\345\237\237.md" +++ "b/content/posts/http/\350\267\250\345\237\237.md" @@ -53,7 +53,7 @@ CORS 把请求分为了两种，简单请求和非简单请求，其中非简单 ### 为什么请求要带上 origin 主要是因为 CORS 给开发带来了便利，同时也带来了安全隐患——CSRF 攻击。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210280002617.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210280002617.png) 如果严格按照同源政策，第 2 步的跨域请求不能进行的，也就不会造成危害。所以 CORS 策略的心智模型是：所有跨域请求都是不安全的，浏览器要带上来源给服务器检验。 ### html 标签的 cors 配置 diff --git "a/content/posts/http/\350\276\223\345\205\245url\345\210\260\346\270\262\346\237\223.md" "b/content/posts/http/\350\276\223\345\205\245url\345\210\260\346\270\262\346\237\223.md" index fa8a293..ec4348e 100644 --- "a/content/posts/http/\350\276\223\345\205\245url\345\210\260\346\270\262\346\237\223.md" +++ "b/content/posts/http/\350\276\223\345\205\245url\345\210\260\346\270\262\346\237\223.md" @@ -10,7 +10,7 @@ tags: [http, browser] 下面是一个常见的图：` -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210191532653.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210191532653.png) TODO diff --git a/content/posts/java/java_2.md b/content/posts/java/java_2.md index 3ce7312..d0be39b 100644 --- a/content/posts/java/java_2.md +++ b/content/posts/java/java_2.md @@ -75,7 +75,7 @@ a++ // 也会强制转换 > [Java 基础——成员变量、局部变量和静态变量的区别](https://blog.csdn.net/haovip123/article/details/43883109) > 关注一下通过类创建对象时，JVM 的内存状态： -> ![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202306262325036.png) +> ![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202306262325036.png) 可见，JVM 内存管理主要分为 3 个部分： @@ -231,6 +231,6 @@ package 包名 - `无修饰符`：对`同一个包中的类`公开，`不在同一个包内，即使继承，也不能访问` - `private`：只能类自身访问 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202307042238681.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202307042238681.png) --- diff --git a/content/posts/java/java_3.md b/content/posts/java/java_3.md index 8912ed4..df229c0 100644 --- a/content/posts/java/java_3.md +++ b/content/posts/java/java_3.md @@ -37,7 +37,7 @@ weight: 3 这里借用韩顺平老师的图： -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202307042055445.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202307042055445.png) > 小结：在 new 一个对象的时候，JVM 先在方法区加载类（在这里会加载类的所有祖先类），然后再在堆中分配内存，最后在主栈中创建变量引用。 diff --git a/content/posts/java/java_7.md b/content/posts/java/java_7.md index 7c6d1bf..877e7cc 100644 --- a/content/posts/java/java_7.md +++ b/content/posts/java/java_7.md @@ -33,7 +33,7 @@ weight: 7 - tray-catch-finally，捕获异常，自行处理 - throws，抛出异常，交给调用者（方法）来处理，最顶级的处理者就是 JVM -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202307222056115.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202307222056115.png) > 如果没有 try，那么默认就是 throws 抛出 diff --git a/content/posts/java/java_8.md b/content/posts/java/java_8.md index 928fe75..1902a17 100644 --- a/content/posts/java/java_8.md +++ b/content/posts/java/java_8.md @@ -11,7 +11,7 @@ weight: 8 包装类 -- 针对八种基本数据类型有相对应的引用类型。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202307231151103.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202307231151103.png) > Character, Boolean 的父类是 Object，其他的父类是 Number @@ -91,7 +91,7 @@ public final class String - 方式一：在常量池里寻找是否存在"xxx"，存在就直接指向，否则就在常量池中创建。变量最终指向的是常量池中的空间地址 - 方式二：先在堆中开辟空间，维护了 value 属性，如果常量池中存在 value 就指向常量池空间，否在在常量池中创建。变量最终指向的是堆中的空间地址 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202308152311173.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202308152311173.png) ```java // 经典题 diff --git a/content/posts/java/java_9.md b/content/posts/java/java_9.md new file mode 100644 index 0000000..3ac9c25 --- /dev/null +++ b/content/posts/java/java_9.md @@ -0,0 +1,20 @@ +--- +title: 'Java_9_集合' +date: 2023-09-14 09:53:06 +tags: [] +series: [java] +categories: [study notes] +weight: 9 +--- + +Java 种数组需要手动扩容，使用起来很不方便，因此，更常用的是集合。 + +## Collection + +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202309161520534.png) + +其通用接口见 API，感觉和 js 的 set 差不了多少。 + +## Map + +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202309161519964.png) diff --git "a/content/posts/node/koa\346\264\213\350\221\261\346\250\241\345\236\213.md" "b/content/posts/node/koa\346\264\213\350\221\261\346\250\241\345\236\213.md" index edeb9b6..04daaf4 100644 --- "a/content/posts/node/koa\346\264\213\350\221\261\346\250\241\345\236\213.md" +++ "b/content/posts/node/koa\346\264\213\350\221\261\346\250\241\345\236\213.md" @@ -7,7 +7,7 @@ tags: [node] > 目前 Node.js 社区较为流行的一个 Web 框架，书写比较优雅。 > [koa 常用中间件](https://www.npmjs.com/package/koa-middlewares) -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202302081832987.jpg) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202302081832987.jpg) ## 简单 demo diff --git "a/content/posts/others/\344\270\200\347\202\271\347\273\217\351\252\214.md" "b/content/posts/others/\344\270\200\347\202\271\347\273\217\351\252\214.md" index 667b9eb..546fef9 100644 --- "a/content/posts/others/\344\270\200\347\202\271\347\273\217\351\252\214.md" +++ "b/content/posts/others/\344\270\200\347\202\271\347\273\217\351\252\214.md" @@ -14,13 +14,13 @@ tags: [exp] ### 灵活运用 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/issue_import.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/issue_import.png) 测试嫌手动输入和选择的与导入的不区分，以及是否是保存状态，我就使用了 git 中 untracked, unmodified, unstaged 的概念来类比区分情况。 ### tab 接口多次调用 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/20221009143455.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/20221009143455.png) 如上图：公司的组件库，开发时发现，这个 tab 有多少个，在初始化的时候，接口就会被调用多少次。 @@ -28,4 +28,4 @@ tags: [exp] 所以给 `component` 加上了 `v-if` 的判断，试了一下，完美解决，如图。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/20221009144306.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/20221009144306.png) diff --git "a/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\206.md" "b/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\206.md" index a5c16dd..82b8895 100644 --- "a/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\206.md" +++ "b/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\206.md" @@ -414,7 +414,7 @@ JSX 转为的 ReactElement 只是一个简单的数据结构，携带着 key，r - Renderer（渲染器）—— 负责将变化的组件渲染到页面上 - 根据 Reconciler 打的标记对 DOM 进行操作 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202211111612280.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202211111612280.png) 其中红框中的步骤随时可能由于以下原因被中断： - 有其他更高优任务需要先更新 diff --git "a/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\2062.md" "b/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\2062.md" index c3076f9..2813fff 100644 --- "a/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\2062.md" +++ "b/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\2062.md" @@ -137,12 +137,12 @@ function App() { 进入 render 阶段时，根据组件返回的 JSX 在内存中依次创建 Fiber 节点并连接在一起构建 Fiber 树，这就是 workInProgressFiber 树。**每次构建 workInProgressFiber 树时，都会尝试复用 currentFiber 树已有 Fiber 节点的数据，决定是否复用的过程就是 Diff 算法**。 进入 commit 阶段，把 workInProgressFiber 树渲染到页面上，fiberRoot 的 current 指向 workInProgressFiber 树，workInProgressFiber 树变成了 currentFiber 树。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202211130020382.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202211130020382.png) ### update 更新时，与 mount 阶段几乎一样，只不过此时的 currentFiber 的 rootFiber 已经有了子节点了，workInProgressFiber 会尽量复用 currentFiber 节点的数据。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202211130020090.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202211130020090.png) ## 参考 diff --git "a/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\2065.md" "b/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\2065.md" index d8e0c7e..169cd53 100644 --- "a/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\2065.md" +++ "b/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\2065.md" @@ -262,7 +262,7 @@ export const Deletion = /* */ 0b00000000001000; > 通过二进制表示 flags(v16叫effectTag)，可以方便的使用位操作为 fiber.flags(v16叫effectTag) 赋值多个 effect。 beginWork 的流程图： -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202211152222775.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202211152222775.png) ### completeWork @@ -404,7 +404,7 @@ rootFiber.firstEffect -----------> fiber -----------> fiber 这样，在 commit 阶段只需要遍历 effectList 就能执行所有 effect 了。 `completeWork` 大致流程图： -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202211170035027.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202211170035027.png) ## 总结 diff --git "a/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\2068-Scheduler.md" "b/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\2068-Scheduler.md" index d047774..6590581 100644 --- "a/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\2068-Scheduler.md" +++ "b/content/posts/react/React\345\237\272\347\241\200\345\216\237\347\220\2068-Scheduler.md" @@ -383,4 +383,4 @@ ifIdle(yes)->ric - [window.requestAnimationFrame](https://developer.mozilla.org/zh-CN/docs/Web/API/Window/requestAnimationFrame) - [IntersectionObserver API 使用教程](https://www.ruanyifeng.com/blog/2016/11/intersectionobserver_api.html) -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202211291457300.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202211291457300.png) diff --git "a/content/posts/tool/VsCode\346\240\274\345\274\217\345\214\226\345\273\272\350\256\256.md" "b/content/posts/tool/VsCode\346\240\274\345\274\217\345\214\226\345\273\272\350\256\256.md" index 435459b..3c243fd 100644 --- "a/content/posts/tool/VsCode\346\240\274\345\274\217\345\214\226\345\273\272\350\256\256.md" +++ "b/content/posts/tool/VsCode\346\240\274\345\274\217\345\214\226\345\273\272\350\256\256.md" @@ -93,7 +93,7 @@ categories: [tool] > `arrow-body-style` 和 `prefer-arrow-callback`: 这两个规则在 eslint 和 prettier 中存在不可解决的冲突，所以关闭掉。 > 另外建议某些特殊的影响到代码格式化的 eslint 配置全部关闭，比如`vue/max-attributes-per-line`，否则就会产生下面这种尴尬 (如果你看不见图，用个梯子试试~) ： - > ![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/20220919000042.png) + > ![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/20220919000042.png) 大功告成！妈妈再也不用担心我的代码一团乱麻 🌶 diff --git a/content/posts/tool/lerna.md b/content/posts/tool/lerna.md index 229bc5a..998e14e 100644 --- a/content/posts/tool/lerna.md +++ b/content/posts/tool/lerna.md @@ -5,7 +5,7 @@ date: 2022-09-21T17:16:09+08:00 > Lerna is a fast, modern build system for managing and publishing multiple JavaScript/TypeScript packages from the same repository. -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202303171022701.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202303171022701.png) ## lerna 解决了哪些问题 diff --git "a/content/posts/tool/linux\345\237\272\347\241\200.md" "b/content/posts/tool/linux\345\237\272\347\241\200.md" index 3c88d95..b42dccf 100644 --- "a/content/posts/tool/linux\345\237\272\347\241\200.md" +++ "b/content/posts/tool/linux\345\237\272\347\241\200.md" @@ -33,7 +33,7 @@ ls -l ll ``` -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202212032127217.jpeg) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202212032127217.jpeg) ```sh total 0 diff --git "a/content/posts/tool/\346\267\261\345\205\245npm_script.md" "b/content/posts/tool/\346\267\261\345\205\245npm_script.md" index a853ddc..333b7bb 100644 --- "a/content/posts/tool/\346\267\261\345\205\245npm_script.md" +++ "b/content/posts/tool/\346\267\261\345\205\245npm_script.md" @@ -277,7 +277,7 @@ npm link 对三个包 link 后，本地全局就会多了这三个包，如图： -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202301062356149.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202301062356149.png) 然后在项目中使用这三个包： diff --git "a/content/posts/vue/Vue\345\223\215\345\272\224\345\274\217\345\216\237\347\220\206.md" "b/content/posts/vue/Vue\345\223\215\345\272\224\345\274\217\345\216\237\347\220\206.md" index 2aa0481..9ba15d8 100644 --- "a/content/posts/vue/Vue\345\223\215\345\272\224\345\274\217\345\216\237\347\220\206.md" +++ "b/content/posts/vue/Vue\345\223\215\345\272\224\345\274\217\345\216\237\347\220\206.md" @@ -4,7 +4,7 @@ date: 2022-10-26T09:58:34+08:00 tags: [Vue] --- -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210261654753.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210261654753.png) ## 核心 @@ -169,13 +169,13 @@ notify() { subs 中收集的是每个 watcher，有多少个组件使用到了目标数据，这些个组件都会被重新渲染。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202210270940977.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202210270940977.png) 现在再看开头官网的图应该就很清晰了吧~👻 ### 小结 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202302221241366.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202302221241366.png) 简单小结一下： vue 中的数据会被 Object.defineProperty() 拦截，添加 getter/setter 函数，其中 getter 中会把组件的 watcher 对象添加进依赖 Dep 对象的订阅列表里，setter 则负责当数据发生变化时触发订阅列表里的 watcher 的 update，最终会调用 vm.render 触发重新渲染，并重新收集依赖。 diff --git a/content/posts/webpack/webpack.md b/content/posts/webpack/webpack.md index aa1f713..386c9dc 100644 --- a/content/posts/webpack/webpack.md +++ b/content/posts/webpack/webpack.md @@ -519,13 +519,13 @@ class Compiler { 附上两张网上的图，便于理解： -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202301031450002.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202301031450002.png) -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202301171730205.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202301171730205.png) 用于总结 module 和 chunk -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202301021511242.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202301021511242.png) ## 补充：易混淆知识点 @@ -534,7 +534,7 @@ class Compiler { - module：构建阶段，通过 `handleModuleCreation` 创建的，对应的是每个文件 - chunk：打包阶段生成的对象，遍历 `compilation.modules` 后，每个 chunk 都被分配了相应的 module - bundle：最终输出的代码，是可以直接在浏览器中执行的 - ![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202301030941740.png) + ![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202301030941740.png) > 一般来讲，一个 chunk 产生一个 bundle，产生 chunk 的途径： > diff --git "a/content/posts/webpack/webpack\344\271\213loader.md" "b/content/posts/webpack/webpack\344\271\213loader.md" index ab50538..3182688 100644 --- "a/content/posts/webpack/webpack\344\271\213loader.md" +++ "b/content/posts/webpack/webpack\344\271\213loader.md" @@ -28,7 +28,7 @@ module.exports = { 一个小知识点，loader 总是从右往左调用的，但是，在实际执行之前，会先**从左到右**调用 loader 的 `pitch` 方法，如果某个 loader 在 pitch 方法中给出一个结果，那么这个过程会回过身来，并跳过剩下的 loader，详细见[Loader Interface](https://webpack.docschina.org/api/loaders/)。 -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202301051444588.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202301051444588.png) ## 自定义 loader diff --git "a/content/posts/webpack/webpack\344\271\213plugin.md" "b/content/posts/webpack/webpack\344\271\213plugin.md" index dfbda18..9cc4fe8 100644 --- "a/content/posts/webpack/webpack\344\271\213plugin.md" +++ "b/content/posts/webpack/webpack\344\271\213plugin.md" @@ -23,7 +23,7 @@ const { } = require('tapable') ``` -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202301301354638.webp) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202301301354638.webp) | 钩子名称 | 执行方式 | 使用要点 | | ------------------------ | -------- | -------------------------------------------------------------------------------------------------------------------------------------- | diff --git "a/content/posts/webpack/webpack\344\271\213\347\220\220\347\242\216\347\237\245\350\257\206\347\202\271.md" "b/content/posts/webpack/webpack\344\271\213\347\220\220\347\242\216\347\237\245\350\257\206\347\202\271.md" index 3a9851d..ebc7d92 100644 --- "a/content/posts/webpack/webpack\344\271\213\347\220\220\347\242\216\347\237\245\350\257\206\347\202\271.md" +++ "b/content/posts/webpack/webpack\344\271\213\347\220\220\347\242\216\347\237\245\350\257\206\347\202\271.md" @@ -7,7 +7,7 @@ series: [wp] ## HMR -![](https://cdn.staticaly.com/gh/yokiizx/picgo@master/img/202301301743084.png) +![](https://cdn.jsdelivr.net/gh/yokiizx/picgo@main/img/202301301743084.png) webpack-dev-server 启动服务后，当文件发生了变动，会触发重新构建，让我们专注于 coding，但是如果不做任何配置，它会刷新页面导致丢失掉应用状态，为此，webpack 提供了 hot module replacement 即 HMR 热更新。