mirror of
https://github.com/ZiuChen/ZiuChen.github.io.git
synced 2025-12-18 00:44:18 +08:00
Deploying to gh-pages from @ ZiuChen/ZiuChen.github.io@3cc0d777a6 🚀
This commit is contained in:
ZiuChen
@@ -8,7 +8,7 @@
|
||||
<link rel="preload stylesheet" href="/assets/style.edafdec9.css" as="style">
|
||||
<link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.107ab7ad.js">
|
||||
<link rel="modulepreload" href="/assets/app.ab8d0b9f.js">
|
||||
<link rel="modulepreload" href="/assets/article_【2023】青训营 - 前端练习题汇总解析.md.1578ca62.lean.js">
|
||||
<link rel="modulepreload" href="/assets/article_【2023】青训营 - 前端练习题汇总解析.md.9cc1c756.lean.js">
|
||||
|
||||
<link rel="icon" href="/logo.png">
|
||||
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||||
@@ -307,8 +307,8 @@
|
||||
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#FF9CAC;">true</span></span>
|
||||
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span></span>
|
||||
<span class="line"><span style="color:#89DDFF;">}</span></span>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br></div></div></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/【2023】青训营 - 前端练习题汇总解析.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-10T03:56:30.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/works/contribution.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>社区贡献</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E3%80%90%E5%AD%97%E8%8A%82%E8%B7%B3%E5%8A%A8%E3%80%91%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%A2%98%E6%80%BB%E7%BB%93.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>【字节跳动】前端面试题总结</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【用友金融】前端面试题总结.md\":\"e0d29045\",\"article_【快手】深入理解前端面试题.md\":\"8046ef7d\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"1578ca62\",\"article_【字节跳动】前端面试题总结.md\":\"43190517\",\"article_深入javascript数据类型.md\":\"38dc4212\",\"article_一文读懂事件冒泡与事件捕获.md\":\"fe1169b5\",\"article_一文读懂函数中this指向问题.md\":\"7daf1c2c\",\"article_从0实现一个年度报告.md\":\"669d6090\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"8dcbd06e\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"29921d41\",\"article_一文读懂伪类与伪元素.md\":\"21c09934\",\"article_深入理解proxy与reflect.md\":\"bf2ee51f\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"e8471f86\",\"index.md\":\"e5051aaf\",\"article_深入理解浏览器缓存机制.md\":\"3e63465b\",\"note_javascript.md\":\"4d381c29\",\"note_front-end engineering.md\":\"aeef7138\",\"article_深入理解浏览器运行原理.md\":\"1aff521c\",\"note_css.md\":\"59153b8f\",\"project_clipboardmanager_guide_index.md\":\"ab04688a\",\"project_clipboardmanager_index.md\":\"35b01af0\",\"project_clipboardmanager_log_index.md\":\"9969286e\",\"project_clipboardmanager_statement_index.md\":\"40104bd4\",\"project_clipboardmanager_vip_index.md\":\"1fa7dbf9\",\"project_markdown_index.md\":\"c4b57a91\",\"works_opensource.md\":\"490aa2ef\",\"works_contribution.md\":\"61ba57eb\",\"note_ssr.md\":\"639b8ecc\",\"project_markdown_shortcut_index.md\":\"9683b9fa\",\"project_markdown_log_index.md\":\"b2b946e7\",\"project_smartwordbreak_log_index.md\":\"22b8fbb4\",\"project_smartwordbreak_statement_index.md\":\"eb3de69f\",\"self_index.md\":\"ca70aa5a\",\"project_smartwordbreak_index.md\":\"2c4ac7f9\",\"note_javascriptenhanced.md\":\"22ea8715\"}")</script>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br></div></div></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/【2023】青训营 - 前端练习题汇总解析.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-12T04:33:56.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/works/contribution.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>社区贡献</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E3%80%90%E5%AD%97%E8%8A%82%E8%B7%B3%E5%8A%A8%E3%80%91%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%A2%98%E6%80%BB%E7%BB%93.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>【字节跳动】前端面试题总结</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【字节跳动】前端面试题总结.md\":\"2f59b10a\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"9cc1c756\",\"article_【快手】深入理解前端面试题.md\":\"5ba13f6e\",\"article_【用友金融】前端面试题总结.md\":\"6b88ba51\",\"article_一文读懂事件冒泡与事件捕获.md\":\"d079626e\",\"article_深入理解proxy与reflect.md\":\"130260d0\",\"article_一文读懂伪类与伪元素.md\":\"05f94b2f\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"1e34d909\",\"article_从0实现一个年度报告.md\":\"2916b0b7\",\"article_深入理解浏览器缓存机制.md\":\"93c602e7\",\"article_深入理解浏览器运行原理.md\":\"df749479\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"7675553c\",\"index.md\":\"e280b140\",\"note_front-end engineering.md\":\"a0520d36\",\"note_javascript.md\":\"566155dc\",\"article_一文读懂函数中this指向问题.md\":\"e7647b3c\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"6a4c39af\",\"article_深入javascript数据类型.md\":\"04cef1ae\",\"note_css.md\":\"3cb37354\",\"project_clipboardmanager_index.md\":\"b7d80b90\",\"project_clipboardmanager_log_index.md\":\"64442858\",\"project_smartwordbreak_log_index.md\":\"b62bc4d3\",\"project_clipboardmanager_statement_index.md\":\"cd56c4e7\",\"works_contribution.md\":\"ea9932f6\",\"project_markdown_index.md\":\"169e5462\",\"project_smartwordbreak_index.md\":\"e19a84fb\",\"self_index.md\":\"cb016208\",\"project_smartwordbreak_statement_index.md\":\"b15fb0e3\",\"project_markdown_shortcut_index.md\":\"c32f00fa\",\"project_markdown_log_index.md\":\"fa880a29\",\"project_clipboardmanager_guide_index.md\":\"0a98e9b1\",\"note_ssr.md\":\"ee9df2bb\",\"works_opensource.md\":\"2c78afab\",\"project_clipboardmanager_vip_index.md\":\"75960c2d\",\"note_javascriptenhanced.md\":\"c6f06cc2\"}")</script>
|
||||
<script type="module" async src="/assets/app.ab8d0b9f.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<link rel="preload stylesheet" href="/assets/style.edafdec9.css" as="style">
|
||||
<link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.107ab7ad.js">
|
||||
<link rel="modulepreload" href="/assets/app.ab8d0b9f.js">
|
||||
<link rel="modulepreload" href="/assets/article_【字节跳动】前端面试题总结.md.43190517.lean.js">
|
||||
<link rel="modulepreload" href="/assets/article_【字节跳动】前端面试题总结.md.2f59b10a.lean.js">
|
||||
|
||||
<link rel="icon" href="/logo.png">
|
||||
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||||
@@ -55,8 +55,8 @@
|
||||
<span class="line"><span style="color:#A6ACCD;">false</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;"></span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br></div></div><h2 id="问答题" tabindex="-1">问答题 <a class="header-anchor" href="#问答题" aria-hidden="true">#</a></h2><h3 id="http缓存的请求头与响应头有哪些" tabindex="-1">HTTP缓存的请求头与响应头有哪些 <a class="header-anchor" href="#http缓存的请求头与响应头有哪些" aria-hidden="true">#</a></h3><ul><li>强制缓存 <ul><li>响应头: Expires 与 Cache-Control</li><li>Expires 绝对时间</li><li>Cache-Control 相对时间</li></ul></li><li>协商缓存 <ul><li>响应头: Etag 请求头: If-Non-Match</li><li>响应头: Last-Modified 请求头: If-Modified-Since</li></ul></li></ul><h3 id="宏任务与微任务有哪些区别-简述他们的应用场景" tabindex="-1">宏任务与微任务有哪些区别？简述他们的应用场景 <a class="header-anchor" href="#宏任务与微任务有哪些区别-简述他们的应用场景" aria-hidden="true">#</a></h3><p>宏任务与微任务优先级不同</p><ul><li>先执行同步代码，后执行异步代码</li><li>主线程代码执行完毕后，检查微任务队列是否为空，非空则优先执行微任务</li><li>每次执行宏任务之前，都会检查微任务队列是否为空，非空则优先执行微任务</li></ul><p>常见的宏任务与微任务</p><ul><li>宏任务 <code>script</code> <code>setTimeout</code> <code>setInterval</code> <code>postMessage</code> <code>MessageChannel</code> <code>setImmediate (NodeJS)</code></li><li>微任务 <code>Promise.then</code> <code>Object.observe</code> <code>MutationObserver</code> <code>process.nextTick (NodeJS)</code></li></ul><h2 id="算法" tabindex="-1">算法 <a class="header-anchor" href="#算法" aria-hidden="true">#</a></h2><p>中文数字转为阿拉伯数字</p><p>给定一个字符串，返回该字符串的所有组合</p><div class="language-js line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#A6ACCD;">输入 abc </span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;">输出 [</span><span style="color:#89DDFF;">'</span><span style="color:#C3E88D;">abc</span><span style="color:#89DDFF;">'</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">'</span><span style="color:#C3E88D;">acb</span><span style="color:#89DDFF;">'</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">'</span><span style="color:#C3E88D;">bac</span><span style="color:#89DDFF;">'</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">'</span><span style="color:#C3E88D;">bca</span><span style="color:#89DDFF;">'</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">'</span><span style="color:#C3E88D;">cab</span><span style="color:#89DDFF;">'</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">'</span><span style="color:#C3E88D;">cba</span><span style="color:#89DDFF;">'</span><span style="color:#A6ACCD;">]</span></span>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br></div></div><p>回溯算法</p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/【字节跳动】前端面试题总结.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-10T03:56:30.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E3%80%902023%E3%80%91%E9%9D%92%E8%AE%AD%E8%90%A5%20-%20%E5%89%8D%E7%AB%AF%E7%BB%83%E4%B9%A0%E9%A2%98%E6%B1%87%E6%80%BB%E8%A7%A3%E6%9E%90.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>【2023】青训营 - 前端练习题汇总解析</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E3%80%90%E5%BF%AB%E6%89%8B%E3%80%91%E6%B7%B1%E5%85%A5%E7%90%86%E8%A7%A3%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%A2%98.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>【快手】深入理解前端面试题</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【用友金融】前端面试题总结.md\":\"e0d29045\",\"article_【快手】深入理解前端面试题.md\":\"8046ef7d\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"1578ca62\",\"article_【字节跳动】前端面试题总结.md\":\"43190517\",\"article_深入javascript数据类型.md\":\"38dc4212\",\"article_一文读懂事件冒泡与事件捕获.md\":\"fe1169b5\",\"article_一文读懂函数中this指向问题.md\":\"7daf1c2c\",\"article_从0实现一个年度报告.md\":\"669d6090\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"8dcbd06e\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"29921d41\",\"article_一文读懂伪类与伪元素.md\":\"21c09934\",\"article_深入理解proxy与reflect.md\":\"bf2ee51f\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"e8471f86\",\"index.md\":\"e5051aaf\",\"article_深入理解浏览器缓存机制.md\":\"3e63465b\",\"note_javascript.md\":\"4d381c29\",\"note_front-end engineering.md\":\"aeef7138\",\"article_深入理解浏览器运行原理.md\":\"1aff521c\",\"note_css.md\":\"59153b8f\",\"project_clipboardmanager_guide_index.md\":\"ab04688a\",\"project_clipboardmanager_index.md\":\"35b01af0\",\"project_clipboardmanager_log_index.md\":\"9969286e\",\"project_clipboardmanager_statement_index.md\":\"40104bd4\",\"project_clipboardmanager_vip_index.md\":\"1fa7dbf9\",\"project_markdown_index.md\":\"c4b57a91\",\"works_opensource.md\":\"490aa2ef\",\"works_contribution.md\":\"61ba57eb\",\"note_ssr.md\":\"639b8ecc\",\"project_markdown_shortcut_index.md\":\"9683b9fa\",\"project_markdown_log_index.md\":\"b2b946e7\",\"project_smartwordbreak_log_index.md\":\"22b8fbb4\",\"project_smartwordbreak_statement_index.md\":\"eb3de69f\",\"self_index.md\":\"ca70aa5a\",\"project_smartwordbreak_index.md\":\"2c4ac7f9\",\"note_javascriptenhanced.md\":\"22ea8715\"}")</script>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br></div></div><p>回溯算法</p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/【字节跳动】前端面试题总结.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-12T04:33:56.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E3%80%902023%E3%80%91%E9%9D%92%E8%AE%AD%E8%90%A5%20-%20%E5%89%8D%E7%AB%AF%E7%BB%83%E4%B9%A0%E9%A2%98%E6%B1%87%E6%80%BB%E8%A7%A3%E6%9E%90.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>【2023】青训营 - 前端练习题汇总解析</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E3%80%90%E5%BF%AB%E6%89%8B%E3%80%91%E6%B7%B1%E5%85%A5%E7%90%86%E8%A7%A3%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%A2%98.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>【快手】深入理解前端面试题</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【字节跳动】前端面试题总结.md\":\"2f59b10a\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"9cc1c756\",\"article_【快手】深入理解前端面试题.md\":\"5ba13f6e\",\"article_【用友金融】前端面试题总结.md\":\"6b88ba51\",\"article_一文读懂事件冒泡与事件捕获.md\":\"d079626e\",\"article_深入理解proxy与reflect.md\":\"130260d0\",\"article_一文读懂伪类与伪元素.md\":\"05f94b2f\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"1e34d909\",\"article_从0实现一个年度报告.md\":\"2916b0b7\",\"article_深入理解浏览器缓存机制.md\":\"93c602e7\",\"article_深入理解浏览器运行原理.md\":\"df749479\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"7675553c\",\"index.md\":\"e280b140\",\"note_front-end engineering.md\":\"a0520d36\",\"note_javascript.md\":\"566155dc\",\"article_一文读懂函数中this指向问题.md\":\"e7647b3c\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"6a4c39af\",\"article_深入javascript数据类型.md\":\"04cef1ae\",\"note_css.md\":\"3cb37354\",\"project_clipboardmanager_index.md\":\"b7d80b90\",\"project_clipboardmanager_log_index.md\":\"64442858\",\"project_smartwordbreak_log_index.md\":\"b62bc4d3\",\"project_clipboardmanager_statement_index.md\":\"cd56c4e7\",\"works_contribution.md\":\"ea9932f6\",\"project_markdown_index.md\":\"169e5462\",\"project_smartwordbreak_index.md\":\"e19a84fb\",\"self_index.md\":\"cb016208\",\"project_smartwordbreak_statement_index.md\":\"b15fb0e3\",\"project_markdown_shortcut_index.md\":\"c32f00fa\",\"project_markdown_log_index.md\":\"fa880a29\",\"project_clipboardmanager_guide_index.md\":\"0a98e9b1\",\"note_ssr.md\":\"ee9df2bb\",\"works_opensource.md\":\"2c78afab\",\"project_clipboardmanager_vip_index.md\":\"75960c2d\",\"note_javascriptenhanced.md\":\"c6f06cc2\"}")</script>
|
||||
<script type="module" async src="/assets/app.ab8d0b9f.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<link rel="preload stylesheet" href="/assets/style.edafdec9.css" as="style">
|
||||
<link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.107ab7ad.js">
|
||||
<link rel="modulepreload" href="/assets/app.ab8d0b9f.js">
|
||||
<link rel="modulepreload" href="/assets/article_【快手】深入理解前端面试题.md.8046ef7d.lean.js">
|
||||
<link rel="modulepreload" href="/assets/article_【快手】深入理解前端面试题.md.5ba13f6e.lean.js">
|
||||
|
||||
<link rel="icon" href="/logo.png">
|
||||
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||||
@@ -193,8 +193,8 @@
|
||||
<span class="line"></span>
|
||||
<span class="line"><span style="color:#A6ACCD;">console</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">log</span><span style="color:#A6ACCD;">(</span><span style="color:#82AAFF;">twoSum</span><span style="color:#A6ACCD;">([</span><span style="color:#F78C6C;">1</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">2</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">3</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">4</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">4</span><span style="color:#A6ACCD;">]</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">5</span><span style="color:#A6ACCD;">)) </span><span style="color:#676E95;font-style:italic;">// 2</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;">console</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">log</span><span style="color:#A6ACCD;">(</span><span style="color:#82AAFF;">twoSum</span><span style="color:#A6ACCD;">([</span><span style="color:#F78C6C;">1</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">1</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">2</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">3</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">4</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">4</span><span style="color:#A6ACCD;">]</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">5</span><span style="color:#A6ACCD;">)) </span><span style="color:#676E95;font-style:italic;">// 3</span></span>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br></div></div></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/【快手】深入理解前端面试题.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-10T03:56:30.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E3%80%90%E5%AD%97%E8%8A%82%E8%B7%B3%E5%8A%A8%E3%80%91%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%A2%98%E6%80%BB%E7%BB%93.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>【字节跳动】前端面试题总结</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E3%80%90%E7%94%A8%E5%8F%8B%E9%87%91%E8%9E%8D%E3%80%91%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%A2%98%E6%80%BB%E7%BB%93.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>【用友金融】前端面试题总结</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【用友金融】前端面试题总结.md\":\"e0d29045\",\"article_【快手】深入理解前端面试题.md\":\"8046ef7d\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"1578ca62\",\"article_【字节跳动】前端面试题总结.md\":\"43190517\",\"article_深入javascript数据类型.md\":\"38dc4212\",\"article_一文读懂事件冒泡与事件捕获.md\":\"fe1169b5\",\"article_一文读懂函数中this指向问题.md\":\"7daf1c2c\",\"article_从0实现一个年度报告.md\":\"669d6090\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"8dcbd06e\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"29921d41\",\"article_一文读懂伪类与伪元素.md\":\"21c09934\",\"article_深入理解proxy与reflect.md\":\"bf2ee51f\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"e8471f86\",\"index.md\":\"e5051aaf\",\"article_深入理解浏览器缓存机制.md\":\"3e63465b\",\"note_javascript.md\":\"4d381c29\",\"note_front-end engineering.md\":\"aeef7138\",\"article_深入理解浏览器运行原理.md\":\"1aff521c\",\"note_css.md\":\"59153b8f\",\"project_clipboardmanager_guide_index.md\":\"ab04688a\",\"project_clipboardmanager_index.md\":\"35b01af0\",\"project_clipboardmanager_log_index.md\":\"9969286e\",\"project_clipboardmanager_statement_index.md\":\"40104bd4\",\"project_clipboardmanager_vip_index.md\":\"1fa7dbf9\",\"project_markdown_index.md\":\"c4b57a91\",\"works_opensource.md\":\"490aa2ef\",\"works_contribution.md\":\"61ba57eb\",\"note_ssr.md\":\"639b8ecc\",\"project_markdown_shortcut_index.md\":\"9683b9fa\",\"project_markdown_log_index.md\":\"b2b946e7\",\"project_smartwordbreak_log_index.md\":\"22b8fbb4\",\"project_smartwordbreak_statement_index.md\":\"eb3de69f\",\"self_index.md\":\"ca70aa5a\",\"project_smartwordbreak_index.md\":\"2c4ac7f9\",\"note_javascriptenhanced.md\":\"22ea8715\"}")</script>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br></div></div></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/【快手】深入理解前端面试题.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-12T04:33:56.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E3%80%90%E5%AD%97%E8%8A%82%E8%B7%B3%E5%8A%A8%E3%80%91%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%A2%98%E6%80%BB%E7%BB%93.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>【字节跳动】前端面试题总结</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E3%80%90%E7%94%A8%E5%8F%8B%E9%87%91%E8%9E%8D%E3%80%91%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%A2%98%E6%80%BB%E7%BB%93.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>【用友金融】前端面试题总结</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【字节跳动】前端面试题总结.md\":\"2f59b10a\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"9cc1c756\",\"article_【快手】深入理解前端面试题.md\":\"5ba13f6e\",\"article_【用友金融】前端面试题总结.md\":\"6b88ba51\",\"article_一文读懂事件冒泡与事件捕获.md\":\"d079626e\",\"article_深入理解proxy与reflect.md\":\"130260d0\",\"article_一文读懂伪类与伪元素.md\":\"05f94b2f\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"1e34d909\",\"article_从0实现一个年度报告.md\":\"2916b0b7\",\"article_深入理解浏览器缓存机制.md\":\"93c602e7\",\"article_深入理解浏览器运行原理.md\":\"df749479\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"7675553c\",\"index.md\":\"e280b140\",\"note_front-end engineering.md\":\"a0520d36\",\"note_javascript.md\":\"566155dc\",\"article_一文读懂函数中this指向问题.md\":\"e7647b3c\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"6a4c39af\",\"article_深入javascript数据类型.md\":\"04cef1ae\",\"note_css.md\":\"3cb37354\",\"project_clipboardmanager_index.md\":\"b7d80b90\",\"project_clipboardmanager_log_index.md\":\"64442858\",\"project_smartwordbreak_log_index.md\":\"b62bc4d3\",\"project_clipboardmanager_statement_index.md\":\"cd56c4e7\",\"works_contribution.md\":\"ea9932f6\",\"project_markdown_index.md\":\"169e5462\",\"project_smartwordbreak_index.md\":\"e19a84fb\",\"self_index.md\":\"cb016208\",\"project_smartwordbreak_statement_index.md\":\"b15fb0e3\",\"project_markdown_shortcut_index.md\":\"c32f00fa\",\"project_markdown_log_index.md\":\"fa880a29\",\"project_clipboardmanager_guide_index.md\":\"0a98e9b1\",\"note_ssr.md\":\"ee9df2bb\",\"works_opensource.md\":\"2c78afab\",\"project_clipboardmanager_vip_index.md\":\"75960c2d\",\"note_javascriptenhanced.md\":\"c6f06cc2\"}")</script>
|
||||
<script type="module" async src="/assets/app.ab8d0b9f.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<link rel="preload stylesheet" href="/assets/style.edafdec9.css" as="style">
|
||||
<link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.107ab7ad.js">
|
||||
<link rel="modulepreload" href="/assets/app.ab8d0b9f.js">
|
||||
<link rel="modulepreload" href="/assets/article_【用友金融】前端面试题总结.md.e0d29045.lean.js">
|
||||
<link rel="modulepreload" href="/assets/article_【用友金融】前端面试题总结.md.6b88ba51.lean.js">
|
||||
|
||||
<link rel="icon" href="/logo.png">
|
||||
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||||
@@ -82,8 +82,8 @@
|
||||
<span class="line"><span style="color:#A6ACCD;"></span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><h2 id="css权重的优先级" tabindex="-1">CSS权重的优先级 <a class="header-anchor" href="#css权重的优先级" aria-hidden="true">#</a></h2><p>内联样式 > ID选择器 > 类选择器 > 标签选择器 > 通配符</p><h2 id="http状态码" tabindex="-1">HTTP状态码 <a class="header-anchor" href="#http状态码" aria-hidden="true">#</a></h2><p>越多越好</p><ul><li>400 临时重定向</li><li>500 服务器内部错误</li><li>404 服务器无法找到对应资源</li><li>200 请求正常处理</li></ul><h2 id="bfc-块级格式上下文" tabindex="-1">BFC(块级格式上下文) <a class="header-anchor" href="#bfc-块级格式上下文" aria-hidden="true">#</a></h2><p>下列选项对产生BFC描述错误的是：</p><ul><li>overflow为visible(x)</li><li>position为absolute</li><li>display为table-cell</li><li>float属性不为none</li></ul><h2 id="元素浮动" tabindex="-1">元素浮动 <a class="header-anchor" href="#元素浮动" aria-hidden="true">#</a></h2><p>设置元素浮动后，元素的display值哪个是正确的？</p><ul><li>inline-block</li><li>float</li><li>inline</li><li>block(√)</li></ul><h2 id="http请求方法" tabindex="-1">HTTP请求方法 <a class="header-anchor" href="#http请求方法" aria-hidden="true">#</a></h2><p>下面哪个选项不是HTTP的请求方法</p><ul><li>HEAD</li><li>PUT</li><li>OPTIONS</li><li>PUSH(x)</li></ul><p>HTTP请求方法有：</p><p><code>GET POST DELETE PUT OPTIONS</code><code>CONNECT HEAD PATCH TRACE</code></p><h2 id="跨域问题" tabindex="-1">跨域问题 <a class="header-anchor" href="#跨域问题" aria-hidden="true">#</a></h2><p>通常有哪些方法解决跨域问题？</p><ul><li>利用JSONP</li><li>反向代理</li><li>服务器配置CORS</li></ul><h2 id="了解webpack的哪些配置项" tabindex="-1">了解Webpack的哪些配置项 <a class="header-anchor" href="#了解webpack的哪些配置项" aria-hidden="true">#</a></h2><ul><li><code>resolve.alias</code> 为路径设置别名</li><li><code>resolve.extensionAlias</code> 后缀省略时 按此顺序指定的后缀名解析文件</li><li><code>module.rules</code> 包含<code>test</code> <code>loader</code> <code>option</code> 正则匹配后缀名 使用指定的loader解析文件</li></ul><h2 id="判断变量类型" tabindex="-1">判断变量类型 <a class="header-anchor" href="#判断变量类型" aria-hidden="true">#</a></h2><p>直接使用<code>typeof</code>无法判断引用类型变量的类型</p><div class="language-js line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#A6ACCD;">console</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">log</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">typeof</span><span style="color:#A6ACCD;"> []) </span><span style="color:#676E95;font-style:italic;">// object</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;">console</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">log</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">typeof</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{}</span><span style="color:#A6ACCD;">) </span><span style="color:#676E95;font-style:italic;">// object</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;">console</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">log</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">typeof</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">null</span><span style="color:#A6ACCD;">) </span><span style="color:#676E95;font-style:italic;">// object</span></span>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br></div></div><h2 id="js浮点数相加精度问题" tabindex="-1">JS浮点数相加精度问题 <a class="header-anchor" href="#js浮点数相加精度问题" aria-hidden="true">#</a></h2><h2 id="简单讲讲vue-router原理" tabindex="-1">简单讲讲Vue Router原理 <a class="header-anchor" href="#简单讲讲vue-router原理" aria-hidden="true">#</a></h2><h2 id="es6熟悉吗" tabindex="-1">ES6熟悉吗 <a class="header-anchor" href="#es6熟悉吗" aria-hidden="true">#</a></h2><p><a href="https://es6.ruanyifeng.com/" target="_blank" rel="noreferrer">ES6教程</a></p><ul><li><code>let</code> <code>const</code></li><li>解构赋值 扩展运算符 可选链</li><li><code>Promise</code> <code>Async</code></li><li><code>Class</code> <code>Set</code> <code>Map</code> <code>Symbol</code> <code>Proxy</code></li></ul><h2 id="css如何实现水平居中与垂直居中" tabindex="-1">CSS如何实现水平居中与垂直居中 <a class="header-anchor" href="#css如何实现水平居中与垂直居中" aria-hidden="true">#</a></h2><p>参见<a href="./../note/CSS.html">CSS学习笔记</a></p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/【用友金融】前端面试题总结.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-10T03:56:30.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E3%80%90%E5%BF%AB%E6%89%8B%E3%80%91%E6%B7%B1%E5%85%A5%E7%90%86%E8%A7%A3%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%A2%98.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>【快手】深入理解前端面试题</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E4%B8%80%E6%96%87%E8%AF%BB%E6%87%82%E4%BA%8B%E4%BB%B6%E5%86%92%E6%B3%A1%E4%B8%8E%E4%BA%8B%E4%BB%B6%E6%8D%95%E8%8E%B7.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>一文读懂事件冒泡与事件捕获</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【用友金融】前端面试题总结.md\":\"e0d29045\",\"article_【快手】深入理解前端面试题.md\":\"8046ef7d\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"1578ca62\",\"article_【字节跳动】前端面试题总结.md\":\"43190517\",\"article_深入javascript数据类型.md\":\"38dc4212\",\"article_一文读懂事件冒泡与事件捕获.md\":\"fe1169b5\",\"article_一文读懂函数中this指向问题.md\":\"7daf1c2c\",\"article_从0实现一个年度报告.md\":\"669d6090\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"8dcbd06e\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"29921d41\",\"article_一文读懂伪类与伪元素.md\":\"21c09934\",\"article_深入理解proxy与reflect.md\":\"bf2ee51f\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"e8471f86\",\"index.md\":\"e5051aaf\",\"article_深入理解浏览器缓存机制.md\":\"3e63465b\",\"note_javascript.md\":\"4d381c29\",\"note_front-end engineering.md\":\"aeef7138\",\"article_深入理解浏览器运行原理.md\":\"1aff521c\",\"note_css.md\":\"59153b8f\",\"project_clipboardmanager_guide_index.md\":\"ab04688a\",\"project_clipboardmanager_index.md\":\"35b01af0\",\"project_clipboardmanager_log_index.md\":\"9969286e\",\"project_clipboardmanager_statement_index.md\":\"40104bd4\",\"project_clipboardmanager_vip_index.md\":\"1fa7dbf9\",\"project_markdown_index.md\":\"c4b57a91\",\"works_opensource.md\":\"490aa2ef\",\"works_contribution.md\":\"61ba57eb\",\"note_ssr.md\":\"639b8ecc\",\"project_markdown_shortcut_index.md\":\"9683b9fa\",\"project_markdown_log_index.md\":\"b2b946e7\",\"project_smartwordbreak_log_index.md\":\"22b8fbb4\",\"project_smartwordbreak_statement_index.md\":\"eb3de69f\",\"self_index.md\":\"ca70aa5a\",\"project_smartwordbreak_index.md\":\"2c4ac7f9\",\"note_javascriptenhanced.md\":\"22ea8715\"}")</script>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br></div></div><h2 id="js浮点数相加精度问题" tabindex="-1">JS浮点数相加精度问题 <a class="header-anchor" href="#js浮点数相加精度问题" aria-hidden="true">#</a></h2><h2 id="简单讲讲vue-router原理" tabindex="-1">简单讲讲Vue Router原理 <a class="header-anchor" href="#简单讲讲vue-router原理" aria-hidden="true">#</a></h2><h2 id="es6熟悉吗" tabindex="-1">ES6熟悉吗 <a class="header-anchor" href="#es6熟悉吗" aria-hidden="true">#</a></h2><p><a href="https://es6.ruanyifeng.com/" target="_blank" rel="noreferrer">ES6教程</a></p><ul><li><code>let</code> <code>const</code></li><li>解构赋值 扩展运算符 可选链</li><li><code>Promise</code> <code>Async</code></li><li><code>Class</code> <code>Set</code> <code>Map</code> <code>Symbol</code> <code>Proxy</code></li></ul><h2 id="css如何实现水平居中与垂直居中" tabindex="-1">CSS如何实现水平居中与垂直居中 <a class="header-anchor" href="#css如何实现水平居中与垂直居中" aria-hidden="true">#</a></h2><p>参见<a href="./../note/CSS.html">CSS学习笔记</a></p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/【用友金融】前端面试题总结.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-12T04:33:56.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E3%80%90%E5%BF%AB%E6%89%8B%E3%80%91%E6%B7%B1%E5%85%A5%E7%90%86%E8%A7%A3%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%A2%98.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>【快手】深入理解前端面试题</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E4%B8%80%E6%96%87%E8%AF%BB%E6%87%82%E4%BA%8B%E4%BB%B6%E5%86%92%E6%B3%A1%E4%B8%8E%E4%BA%8B%E4%BB%B6%E6%8D%95%E8%8E%B7.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>一文读懂事件冒泡与事件捕获</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【字节跳动】前端面试题总结.md\":\"2f59b10a\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"9cc1c756\",\"article_【快手】深入理解前端面试题.md\":\"5ba13f6e\",\"article_【用友金融】前端面试题总结.md\":\"6b88ba51\",\"article_一文读懂事件冒泡与事件捕获.md\":\"d079626e\",\"article_深入理解proxy与reflect.md\":\"130260d0\",\"article_一文读懂伪类与伪元素.md\":\"05f94b2f\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"1e34d909\",\"article_从0实现一个年度报告.md\":\"2916b0b7\",\"article_深入理解浏览器缓存机制.md\":\"93c602e7\",\"article_深入理解浏览器运行原理.md\":\"df749479\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"7675553c\",\"index.md\":\"e280b140\",\"note_front-end engineering.md\":\"a0520d36\",\"note_javascript.md\":\"566155dc\",\"article_一文读懂函数中this指向问题.md\":\"e7647b3c\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"6a4c39af\",\"article_深入javascript数据类型.md\":\"04cef1ae\",\"note_css.md\":\"3cb37354\",\"project_clipboardmanager_index.md\":\"b7d80b90\",\"project_clipboardmanager_log_index.md\":\"64442858\",\"project_smartwordbreak_log_index.md\":\"b62bc4d3\",\"project_clipboardmanager_statement_index.md\":\"cd56c4e7\",\"works_contribution.md\":\"ea9932f6\",\"project_markdown_index.md\":\"169e5462\",\"project_smartwordbreak_index.md\":\"e19a84fb\",\"self_index.md\":\"cb016208\",\"project_smartwordbreak_statement_index.md\":\"b15fb0e3\",\"project_markdown_shortcut_index.md\":\"c32f00fa\",\"project_markdown_log_index.md\":\"fa880a29\",\"project_clipboardmanager_guide_index.md\":\"0a98e9b1\",\"note_ssr.md\":\"ee9df2bb\",\"works_opensource.md\":\"2c78afab\",\"project_clipboardmanager_vip_index.md\":\"75960c2d\",\"note_javascriptenhanced.md\":\"c6f06cc2\"}")</script>
|
||||
<script type="module" async src="/assets/app.ab8d0b9f.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<link rel="preload stylesheet" href="/assets/style.edafdec9.css" as="style">
|
||||
<link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.107ab7ad.js">
|
||||
<link rel="modulepreload" href="/assets/app.ab8d0b9f.js">
|
||||
<link rel="modulepreload" href="/assets/article_一文读懂事件冒泡与事件捕获.md.fe1169b5.lean.js">
|
||||
<link rel="modulepreload" href="/assets/article_一文读懂事件冒泡与事件捕获.md.d079626e.lean.js">
|
||||
|
||||
<link rel="icon" href="/logo.png">
|
||||
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||||
@@ -58,8 +58,8 @@
|
||||
<span class="line"><span style="color:#89DDFF;"> </span><span style="color:#676E95;font-style:italic;">// some code ...</span></span>
|
||||
<span class="line"><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">e</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">preventDefault</span><span style="color:#F07178;">()</span></span>
|
||||
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;">)</span><span style="color:#89DDFF;">;</span></span>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br></div></div><h2 id="相关链接" tabindex="-1">相关链接 <a class="header-anchor" href="#相关链接" aria-hidden="true">#</a></h2><p><a href="https://developer.mozilla.org/zh-CN/docs/Learn/JavaScript/Building_blocks/Events#%E4%BA%8B%E4%BB%B6%E5%86%92%E6%B3%A1%E5%8F%8A%E6%8D%95%E8%8E%B7" target="_blank" rel="noreferrer"><code>事件冒泡及捕获</code></a></p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/一文读懂事件冒泡与事件捕获.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-10T03:56:30.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E3%80%90%E7%94%A8%E5%8F%8B%E9%87%91%E8%9E%8D%E3%80%91%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%A2%98%E6%80%BB%E7%BB%93.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>【用友金融】前端面试题总结</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E4%B8%80%E6%96%87%E8%AF%BB%E6%87%82%E4%BC%AA%E7%B1%BB%E4%B8%8E%E4%BC%AA%E5%85%83%E7%B4%A0.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>一文读懂伪类与伪元素</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【用友金融】前端面试题总结.md\":\"e0d29045\",\"article_【快手】深入理解前端面试题.md\":\"8046ef7d\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"1578ca62\",\"article_【字节跳动】前端面试题总结.md\":\"43190517\",\"article_深入javascript数据类型.md\":\"38dc4212\",\"article_一文读懂事件冒泡与事件捕获.md\":\"fe1169b5\",\"article_一文读懂函数中this指向问题.md\":\"7daf1c2c\",\"article_从0实现一个年度报告.md\":\"669d6090\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"8dcbd06e\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"29921d41\",\"article_一文读懂伪类与伪元素.md\":\"21c09934\",\"article_深入理解proxy与reflect.md\":\"bf2ee51f\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"e8471f86\",\"index.md\":\"e5051aaf\",\"article_深入理解浏览器缓存机制.md\":\"3e63465b\",\"note_javascript.md\":\"4d381c29\",\"note_front-end engineering.md\":\"aeef7138\",\"article_深入理解浏览器运行原理.md\":\"1aff521c\",\"note_css.md\":\"59153b8f\",\"project_clipboardmanager_guide_index.md\":\"ab04688a\",\"project_clipboardmanager_index.md\":\"35b01af0\",\"project_clipboardmanager_log_index.md\":\"9969286e\",\"project_clipboardmanager_statement_index.md\":\"40104bd4\",\"project_clipboardmanager_vip_index.md\":\"1fa7dbf9\",\"project_markdown_index.md\":\"c4b57a91\",\"works_opensource.md\":\"490aa2ef\",\"works_contribution.md\":\"61ba57eb\",\"note_ssr.md\":\"639b8ecc\",\"project_markdown_shortcut_index.md\":\"9683b9fa\",\"project_markdown_log_index.md\":\"b2b946e7\",\"project_smartwordbreak_log_index.md\":\"22b8fbb4\",\"project_smartwordbreak_statement_index.md\":\"eb3de69f\",\"self_index.md\":\"ca70aa5a\",\"project_smartwordbreak_index.md\":\"2c4ac7f9\",\"note_javascriptenhanced.md\":\"22ea8715\"}")</script>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br></div></div><h2 id="相关链接" tabindex="-1">相关链接 <a class="header-anchor" href="#相关链接" aria-hidden="true">#</a></h2><p><a href="https://developer.mozilla.org/zh-CN/docs/Learn/JavaScript/Building_blocks/Events#%E4%BA%8B%E4%BB%B6%E5%86%92%E6%B3%A1%E5%8F%8A%E6%8D%95%E8%8E%B7" target="_blank" rel="noreferrer"><code>事件冒泡及捕获</code></a></p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/一文读懂事件冒泡与事件捕获.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-12T04:33:56.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E3%80%90%E7%94%A8%E5%8F%8B%E9%87%91%E8%9E%8D%E3%80%91%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95%E9%A2%98%E6%80%BB%E7%BB%93.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>【用友金融】前端面试题总结</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E4%B8%80%E6%96%87%E8%AF%BB%E6%87%82%E4%BC%AA%E7%B1%BB%E4%B8%8E%E4%BC%AA%E5%85%83%E7%B4%A0.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>一文读懂伪类与伪元素</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【字节跳动】前端面试题总结.md\":\"2f59b10a\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"9cc1c756\",\"article_【快手】深入理解前端面试题.md\":\"5ba13f6e\",\"article_【用友金融】前端面试题总结.md\":\"6b88ba51\",\"article_一文读懂事件冒泡与事件捕获.md\":\"d079626e\",\"article_深入理解proxy与reflect.md\":\"130260d0\",\"article_一文读懂伪类与伪元素.md\":\"05f94b2f\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"1e34d909\",\"article_从0实现一个年度报告.md\":\"2916b0b7\",\"article_深入理解浏览器缓存机制.md\":\"93c602e7\",\"article_深入理解浏览器运行原理.md\":\"df749479\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"7675553c\",\"index.md\":\"e280b140\",\"note_front-end engineering.md\":\"a0520d36\",\"note_javascript.md\":\"566155dc\",\"article_一文读懂函数中this指向问题.md\":\"e7647b3c\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"6a4c39af\",\"article_深入javascript数据类型.md\":\"04cef1ae\",\"note_css.md\":\"3cb37354\",\"project_clipboardmanager_index.md\":\"b7d80b90\",\"project_clipboardmanager_log_index.md\":\"64442858\",\"project_smartwordbreak_log_index.md\":\"b62bc4d3\",\"project_clipboardmanager_statement_index.md\":\"cd56c4e7\",\"works_contribution.md\":\"ea9932f6\",\"project_markdown_index.md\":\"169e5462\",\"project_smartwordbreak_index.md\":\"e19a84fb\",\"self_index.md\":\"cb016208\",\"project_smartwordbreak_statement_index.md\":\"b15fb0e3\",\"project_markdown_shortcut_index.md\":\"c32f00fa\",\"project_markdown_log_index.md\":\"fa880a29\",\"project_clipboardmanager_guide_index.md\":\"0a98e9b1\",\"note_ssr.md\":\"ee9df2bb\",\"works_opensource.md\":\"2c78afab\",\"project_clipboardmanager_vip_index.md\":\"75960c2d\",\"note_javascriptenhanced.md\":\"c6f06cc2\"}")</script>
|
||||
<script type="module" async src="/assets/app.ab8d0b9f.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<link rel="preload stylesheet" href="/assets/style.edafdec9.css" as="style">
|
||||
<link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.107ab7ad.js">
|
||||
<link rel="modulepreload" href="/assets/app.ab8d0b9f.js">
|
||||
<link rel="modulepreload" href="/assets/article_一文读懂伪类与伪元素.md.21c09934.lean.js">
|
||||
<link rel="modulepreload" href="/assets/article_一文读懂伪类与伪元素.md.05f94b2f.lean.js">
|
||||
|
||||
<link rel="icon" href="/logo.png">
|
||||
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||||
@@ -80,8 +80,8 @@
|
||||
<span class="line"><span style="color:#89DDFF;">.</span><span style="color:#FFCB6B;">father</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#B2CCD6;">width</span><span style="color:#89DDFF;">:</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">100px</span><span style="color:#89DDFF;">;</span></span>
|
||||
<span class="line"><span style="color:#89DDFF;">}</span></span>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br></div></div><h3 id="相关链接" tabindex="-1">相关链接 <a class="header-anchor" href="#相关链接" aria-hidden="true">#</a></h3><p><a href="https://code.juejin.cn/pen/7088328950488760334" target="_blank" rel="noreferrer">代码片段</a></p><p><a href="https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Building_blocks/Selectors" target="_blank" rel="noreferrer"><code>CSS选择器</code></a></p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/一文读懂伪类与伪元素.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-10T03:56:30.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E4%B8%80%E6%96%87%E8%AF%BB%E6%87%82%E4%BA%8B%E4%BB%B6%E5%86%92%E6%B3%A1%E4%B8%8E%E4%BA%8B%E4%BB%B6%E6%8D%95%E8%8E%B7.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>一文读懂事件冒泡与事件捕获</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E4%B8%80%E6%96%87%E8%AF%BB%E6%87%82%E5%87%BD%E6%95%B0%E4%B8%ADthis%E6%8C%87%E5%90%91%E9%97%AE%E9%A2%98.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>一文读懂函数中this指向问题</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【用友金融】前端面试题总结.md\":\"e0d29045\",\"article_【快手】深入理解前端面试题.md\":\"8046ef7d\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"1578ca62\",\"article_【字节跳动】前端面试题总结.md\":\"43190517\",\"article_深入javascript数据类型.md\":\"38dc4212\",\"article_一文读懂事件冒泡与事件捕获.md\":\"fe1169b5\",\"article_一文读懂函数中this指向问题.md\":\"7daf1c2c\",\"article_从0实现一个年度报告.md\":\"669d6090\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"8dcbd06e\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"29921d41\",\"article_一文读懂伪类与伪元素.md\":\"21c09934\",\"article_深入理解proxy与reflect.md\":\"bf2ee51f\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"e8471f86\",\"index.md\":\"e5051aaf\",\"article_深入理解浏览器缓存机制.md\":\"3e63465b\",\"note_javascript.md\":\"4d381c29\",\"note_front-end engineering.md\":\"aeef7138\",\"article_深入理解浏览器运行原理.md\":\"1aff521c\",\"note_css.md\":\"59153b8f\",\"project_clipboardmanager_guide_index.md\":\"ab04688a\",\"project_clipboardmanager_index.md\":\"35b01af0\",\"project_clipboardmanager_log_index.md\":\"9969286e\",\"project_clipboardmanager_statement_index.md\":\"40104bd4\",\"project_clipboardmanager_vip_index.md\":\"1fa7dbf9\",\"project_markdown_index.md\":\"c4b57a91\",\"works_opensource.md\":\"490aa2ef\",\"works_contribution.md\":\"61ba57eb\",\"note_ssr.md\":\"639b8ecc\",\"project_markdown_shortcut_index.md\":\"9683b9fa\",\"project_markdown_log_index.md\":\"b2b946e7\",\"project_smartwordbreak_log_index.md\":\"22b8fbb4\",\"project_smartwordbreak_statement_index.md\":\"eb3de69f\",\"self_index.md\":\"ca70aa5a\",\"project_smartwordbreak_index.md\":\"2c4ac7f9\",\"note_javascriptenhanced.md\":\"22ea8715\"}")</script>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br></div></div><h3 id="相关链接" tabindex="-1">相关链接 <a class="header-anchor" href="#相关链接" aria-hidden="true">#</a></h3><p><a href="https://code.juejin.cn/pen/7088328950488760334" target="_blank" rel="noreferrer">代码片段</a></p><p><a href="https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Building_blocks/Selectors" target="_blank" rel="noreferrer"><code>CSS选择器</code></a></p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/一文读懂伪类与伪元素.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-12T04:33:56.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E4%B8%80%E6%96%87%E8%AF%BB%E6%87%82%E4%BA%8B%E4%BB%B6%E5%86%92%E6%B3%A1%E4%B8%8E%E4%BA%8B%E4%BB%B6%E6%8D%95%E8%8E%B7.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>一文读懂事件冒泡与事件捕获</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E4%B8%80%E6%96%87%E8%AF%BB%E6%87%82%E5%87%BD%E6%95%B0%E4%B8%ADthis%E6%8C%87%E5%90%91%E9%97%AE%E9%A2%98.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>一文读懂函数中this指向问题</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【字节跳动】前端面试题总结.md\":\"2f59b10a\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"9cc1c756\",\"article_【快手】深入理解前端面试题.md\":\"5ba13f6e\",\"article_【用友金融】前端面试题总结.md\":\"6b88ba51\",\"article_一文读懂事件冒泡与事件捕获.md\":\"d079626e\",\"article_深入理解proxy与reflect.md\":\"130260d0\",\"article_一文读懂伪类与伪元素.md\":\"05f94b2f\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"1e34d909\",\"article_从0实现一个年度报告.md\":\"2916b0b7\",\"article_深入理解浏览器缓存机制.md\":\"93c602e7\",\"article_深入理解浏览器运行原理.md\":\"df749479\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"7675553c\",\"index.md\":\"e280b140\",\"note_front-end engineering.md\":\"a0520d36\",\"note_javascript.md\":\"566155dc\",\"article_一文读懂函数中this指向问题.md\":\"e7647b3c\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"6a4c39af\",\"article_深入javascript数据类型.md\":\"04cef1ae\",\"note_css.md\":\"3cb37354\",\"project_clipboardmanager_index.md\":\"b7d80b90\",\"project_clipboardmanager_log_index.md\":\"64442858\",\"project_smartwordbreak_log_index.md\":\"b62bc4d3\",\"project_clipboardmanager_statement_index.md\":\"cd56c4e7\",\"works_contribution.md\":\"ea9932f6\",\"project_markdown_index.md\":\"169e5462\",\"project_smartwordbreak_index.md\":\"e19a84fb\",\"self_index.md\":\"cb016208\",\"project_smartwordbreak_statement_index.md\":\"b15fb0e3\",\"project_markdown_shortcut_index.md\":\"c32f00fa\",\"project_markdown_log_index.md\":\"fa880a29\",\"project_clipboardmanager_guide_index.md\":\"0a98e9b1\",\"note_ssr.md\":\"ee9df2bb\",\"works_opensource.md\":\"2c78afab\",\"project_clipboardmanager_vip_index.md\":\"75960c2d\",\"note_javascriptenhanced.md\":\"c6f06cc2\"}")</script>
|
||||
<script type="module" async src="/assets/app.ab8d0b9f.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<link rel="preload stylesheet" href="/assets/style.edafdec9.css" as="style">
|
||||
<link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.107ab7ad.js">
|
||||
<link rel="modulepreload" href="/assets/app.ab8d0b9f.js">
|
||||
<link rel="modulepreload" href="/assets/article_一文读懂函数中this指向问题.md.7daf1c2c.lean.js">
|
||||
<link rel="modulepreload" href="/assets/article_一文读懂函数中this指向问题.md.e7647b3c.lean.js">
|
||||
|
||||
<link rel="icon" href="/logo.png">
|
||||
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||||
@@ -167,8 +167,8 @@
|
||||
<span class="line"><span style="color:#A6ACCD;">person1.foo4()() // 隐式绑定: person1</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;">person1.foo4.call(person2)() // 显式绑定: person2</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;">person1.foo4().call(person2) // 隐式绑定: person1</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;"></span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br></div></div></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/一文读懂函数中this指向问题.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-10T03:56:30.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E4%B8%80%E6%96%87%E8%AF%BB%E6%87%82%E4%BC%AA%E7%B1%BB%E4%B8%8E%E4%BC%AA%E5%85%83%E7%B4%A0.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>一文读懂伪类与伪元素</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E4%BB%8E0%E5%AE%9E%E7%8E%B0%E4%B8%80%E4%B8%AA%E5%B9%B4%E5%BA%A6%E6%8A%A5%E5%91%8A.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>从0实现一个年度报告</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【用友金融】前端面试题总结.md\":\"e0d29045\",\"article_【快手】深入理解前端面试题.md\":\"8046ef7d\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"1578ca62\",\"article_【字节跳动】前端面试题总结.md\":\"43190517\",\"article_深入javascript数据类型.md\":\"38dc4212\",\"article_一文读懂事件冒泡与事件捕获.md\":\"fe1169b5\",\"article_一文读懂函数中this指向问题.md\":\"7daf1c2c\",\"article_从0实现一个年度报告.md\":\"669d6090\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"8dcbd06e\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"29921d41\",\"article_一文读懂伪类与伪元素.md\":\"21c09934\",\"article_深入理解proxy与reflect.md\":\"bf2ee51f\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"e8471f86\",\"index.md\":\"e5051aaf\",\"article_深入理解浏览器缓存机制.md\":\"3e63465b\",\"note_javascript.md\":\"4d381c29\",\"note_front-end engineering.md\":\"aeef7138\",\"article_深入理解浏览器运行原理.md\":\"1aff521c\",\"note_css.md\":\"59153b8f\",\"project_clipboardmanager_guide_index.md\":\"ab04688a\",\"project_clipboardmanager_index.md\":\"35b01af0\",\"project_clipboardmanager_log_index.md\":\"9969286e\",\"project_clipboardmanager_statement_index.md\":\"40104bd4\",\"project_clipboardmanager_vip_index.md\":\"1fa7dbf9\",\"project_markdown_index.md\":\"c4b57a91\",\"works_opensource.md\":\"490aa2ef\",\"works_contribution.md\":\"61ba57eb\",\"note_ssr.md\":\"639b8ecc\",\"project_markdown_shortcut_index.md\":\"9683b9fa\",\"project_markdown_log_index.md\":\"b2b946e7\",\"project_smartwordbreak_log_index.md\":\"22b8fbb4\",\"project_smartwordbreak_statement_index.md\":\"eb3de69f\",\"self_index.md\":\"ca70aa5a\",\"project_smartwordbreak_index.md\":\"2c4ac7f9\",\"note_javascriptenhanced.md\":\"22ea8715\"}")</script>
|
||||
<span class="line"><span style="color:#A6ACCD;"></span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br><span class="line-number">21</span><br><span class="line-number">22</span><br><span class="line-number">23</span><br><span class="line-number">24</span><br><span class="line-number">25</span><br><span class="line-number">26</span><br><span class="line-number">27</span><br><span class="line-number">28</span><br><span class="line-number">29</span><br><span class="line-number">30</span><br><span class="line-number">31</span><br><span class="line-number">32</span><br><span class="line-number">33</span><br><span class="line-number">34</span><br><span class="line-number">35</span><br></div></div></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/一文读懂函数中this指向问题.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-12T04:33:56.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E4%B8%80%E6%96%87%E8%AF%BB%E6%87%82%E4%BC%AA%E7%B1%BB%E4%B8%8E%E4%BC%AA%E5%85%83%E7%B4%A0.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>一文读懂伪类与伪元素</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E4%BB%8E0%E5%AE%9E%E7%8E%B0%E4%B8%80%E4%B8%AA%E5%B9%B4%E5%BA%A6%E6%8A%A5%E5%91%8A.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>从0实现一个年度报告</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【字节跳动】前端面试题总结.md\":\"2f59b10a\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"9cc1c756\",\"article_【快手】深入理解前端面试题.md\":\"5ba13f6e\",\"article_【用友金融】前端面试题总结.md\":\"6b88ba51\",\"article_一文读懂事件冒泡与事件捕获.md\":\"d079626e\",\"article_深入理解proxy与reflect.md\":\"130260d0\",\"article_一文读懂伪类与伪元素.md\":\"05f94b2f\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"1e34d909\",\"article_从0实现一个年度报告.md\":\"2916b0b7\",\"article_深入理解浏览器缓存机制.md\":\"93c602e7\",\"article_深入理解浏览器运行原理.md\":\"df749479\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"7675553c\",\"index.md\":\"e280b140\",\"note_front-end engineering.md\":\"a0520d36\",\"note_javascript.md\":\"566155dc\",\"article_一文读懂函数中this指向问题.md\":\"e7647b3c\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"6a4c39af\",\"article_深入javascript数据类型.md\":\"04cef1ae\",\"note_css.md\":\"3cb37354\",\"project_clipboardmanager_index.md\":\"b7d80b90\",\"project_clipboardmanager_log_index.md\":\"64442858\",\"project_smartwordbreak_log_index.md\":\"b62bc4d3\",\"project_clipboardmanager_statement_index.md\":\"cd56c4e7\",\"works_contribution.md\":\"ea9932f6\",\"project_markdown_index.md\":\"169e5462\",\"project_smartwordbreak_index.md\":\"e19a84fb\",\"self_index.md\":\"cb016208\",\"project_smartwordbreak_statement_index.md\":\"b15fb0e3\",\"project_markdown_shortcut_index.md\":\"c32f00fa\",\"project_markdown_log_index.md\":\"fa880a29\",\"project_clipboardmanager_guide_index.md\":\"0a98e9b1\",\"note_ssr.md\":\"ee9df2bb\",\"works_opensource.md\":\"2c78afab\",\"project_clipboardmanager_vip_index.md\":\"75960c2d\",\"note_javascriptenhanced.md\":\"c6f06cc2\"}")</script>
|
||||
<script type="module" async src="/assets/app.ab8d0b9f.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -8,7 +8,7 @@
|
||||
<link rel="preload stylesheet" href="/assets/style.edafdec9.css" as="style">
|
||||
<link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.107ab7ad.js">
|
||||
<link rel="modulepreload" href="/assets/app.ab8d0b9f.js">
|
||||
<link rel="modulepreload" href="/assets/article_彻底搞懂对象的数据属性描述符、存储属性描述符.md.8dcbd06e.lean.js">
|
||||
<link rel="modulepreload" href="/assets/article_彻底搞懂对象的数据属性描述符、存储属性描述符.md.1e34d909.lean.js">
|
||||
|
||||
<link rel="icon" href="/logo.png">
|
||||
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||||
@@ -86,8 +86,8 @@
|
||||
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#C792EA;">function</span><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">foo</span><span style="color:#89DDFF;">()</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
|
||||
<span class="line"><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">console</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">log</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">"</span><span style="color:#C3E88D;">resetted address value once</span><span style="color:#89DDFF;">"</span><span style="color:#F07178;">)</span></span>
|
||||
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span></span>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br></div></div></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/彻底搞懂对象的数据属性描述符、存储属性描述符.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-10T03:56:30.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E4%BB%8E0%E5%AE%9E%E7%8E%B0%E4%B8%80%E4%B8%AA%E5%B9%B4%E5%BA%A6%E6%8A%A5%E5%91%8A.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>从0实现一个年度报告</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E6%B5%85%E6%9E%90defineProperty%E4%B8%8EProxy%E5%AE%9E%E7%8E%B0%E7%9A%84%E5%8F%8C%E5%90%91%E7%BB%91%E5%AE%9A.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>浅析defineProperty与Proxy实现的双向绑定</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【用友金融】前端面试题总结.md\":\"e0d29045\",\"article_【快手】深入理解前端面试题.md\":\"8046ef7d\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"1578ca62\",\"article_【字节跳动】前端面试题总结.md\":\"43190517\",\"article_深入javascript数据类型.md\":\"38dc4212\",\"article_一文读懂事件冒泡与事件捕获.md\":\"fe1169b5\",\"article_一文读懂函数中this指向问题.md\":\"7daf1c2c\",\"article_从0实现一个年度报告.md\":\"669d6090\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"8dcbd06e\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"29921d41\",\"article_一文读懂伪类与伪元素.md\":\"21c09934\",\"article_深入理解proxy与reflect.md\":\"bf2ee51f\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"e8471f86\",\"index.md\":\"e5051aaf\",\"article_深入理解浏览器缓存机制.md\":\"3e63465b\",\"note_javascript.md\":\"4d381c29\",\"note_front-end engineering.md\":\"aeef7138\",\"article_深入理解浏览器运行原理.md\":\"1aff521c\",\"note_css.md\":\"59153b8f\",\"project_clipboardmanager_guide_index.md\":\"ab04688a\",\"project_clipboardmanager_index.md\":\"35b01af0\",\"project_clipboardmanager_log_index.md\":\"9969286e\",\"project_clipboardmanager_statement_index.md\":\"40104bd4\",\"project_clipboardmanager_vip_index.md\":\"1fa7dbf9\",\"project_markdown_index.md\":\"c4b57a91\",\"works_opensource.md\":\"490aa2ef\",\"works_contribution.md\":\"61ba57eb\",\"note_ssr.md\":\"639b8ecc\",\"project_markdown_shortcut_index.md\":\"9683b9fa\",\"project_markdown_log_index.md\":\"b2b946e7\",\"project_smartwordbreak_log_index.md\":\"22b8fbb4\",\"project_smartwordbreak_statement_index.md\":\"eb3de69f\",\"self_index.md\":\"ca70aa5a\",\"project_smartwordbreak_index.md\":\"2c4ac7f9\",\"note_javascriptenhanced.md\":\"22ea8715\"}")</script>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br></div></div></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/彻底搞懂对象的数据属性描述符、存储属性描述符.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-12T04:33:56.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E4%BB%8E0%E5%AE%9E%E7%8E%B0%E4%B8%80%E4%B8%AA%E5%B9%B4%E5%BA%A6%E6%8A%A5%E5%91%8A.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>从0实现一个年度报告</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E6%B5%85%E6%9E%90defineProperty%E4%B8%8EProxy%E5%AE%9E%E7%8E%B0%E7%9A%84%E5%8F%8C%E5%90%91%E7%BB%91%E5%AE%9A.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>浅析defineProperty与Proxy实现的双向绑定</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【字节跳动】前端面试题总结.md\":\"2f59b10a\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"9cc1c756\",\"article_【快手】深入理解前端面试题.md\":\"5ba13f6e\",\"article_【用友金融】前端面试题总结.md\":\"6b88ba51\",\"article_一文读懂事件冒泡与事件捕获.md\":\"d079626e\",\"article_深入理解proxy与reflect.md\":\"130260d0\",\"article_一文读懂伪类与伪元素.md\":\"05f94b2f\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"1e34d909\",\"article_从0实现一个年度报告.md\":\"2916b0b7\",\"article_深入理解浏览器缓存机制.md\":\"93c602e7\",\"article_深入理解浏览器运行原理.md\":\"df749479\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"7675553c\",\"index.md\":\"e280b140\",\"note_front-end engineering.md\":\"a0520d36\",\"note_javascript.md\":\"566155dc\",\"article_一文读懂函数中this指向问题.md\":\"e7647b3c\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"6a4c39af\",\"article_深入javascript数据类型.md\":\"04cef1ae\",\"note_css.md\":\"3cb37354\",\"project_clipboardmanager_index.md\":\"b7d80b90\",\"project_clipboardmanager_log_index.md\":\"64442858\",\"project_smartwordbreak_log_index.md\":\"b62bc4d3\",\"project_clipboardmanager_statement_index.md\":\"cd56c4e7\",\"works_contribution.md\":\"ea9932f6\",\"project_markdown_index.md\":\"169e5462\",\"project_smartwordbreak_index.md\":\"e19a84fb\",\"self_index.md\":\"cb016208\",\"project_smartwordbreak_statement_index.md\":\"b15fb0e3\",\"project_markdown_shortcut_index.md\":\"c32f00fa\",\"project_markdown_log_index.md\":\"fa880a29\",\"project_clipboardmanager_guide_index.md\":\"0a98e9b1\",\"note_ssr.md\":\"ee9df2bb\",\"works_opensource.md\":\"2c78afab\",\"project_clipboardmanager_vip_index.md\":\"75960c2d\",\"note_javascriptenhanced.md\":\"c6f06cc2\"}")</script>
|
||||
<script type="module" async src="/assets/app.ab8d0b9f.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<link rel="preload stylesheet" href="/assets/style.edafdec9.css" as="style">
|
||||
<link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.107ab7ad.js">
|
||||
<link rel="modulepreload" href="/assets/app.ab8d0b9f.js">
|
||||
<link rel="modulepreload" href="/assets/article_浅析defineProperty与Proxy实现的双向绑定.md.29921d41.lean.js">
|
||||
<link rel="modulepreload" href="/assets/article_浅析defineProperty与Proxy实现的双向绑定.md.6a4c39af.lean.js">
|
||||
|
||||
<link rel="icon" href="/logo.png">
|
||||
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||||
@@ -34,8 +34,8 @@
|
||||
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#A6ACCD;">)</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;"></</span><span style="color:#F07178;">script</span><span style="color:#89DDFF;">></span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;"></</span><span style="color:#F07178;">body</span><span style="color:#89DDFF;">></span></span>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div><p>通过 <code>defineProperty</code> 实现的响应式，<strong>不能检测</strong>数组和对象的变化：</p><p><strong>对于对象：</strong></p><p>Vue 无法检测 property 的添加或移除。</p><p>var vm = new Vue({ data:{ a:1 } }) // <code>vm.a</code> 是响应式的 vm.b = 2 // <code>vm.b</code> 是非响应式的</p><p><strong>对于数组：</strong></p><ol><li>当你利用索引直接设置一个数组项时，例如：<code>vm.items[indexOfItem] = newValue</code></li><li>当你修改数组的长度时，例如：<code>vm.items.length = newLength</code></li></ol><h2 id="🔰-vue3的响应式原理" tabindex="-1">🔰 Vue3的响应式原理 <a class="header-anchor" href="#🔰-vue3的响应式原理" aria-hidden="true">#</a></h2></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/浅析defineProperty与Proxy实现的双向绑定.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-10T03:56:30.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E5%BD%BB%E5%BA%95%E6%90%9E%E6%87%82%E5%AF%B9%E8%B1%A1%E7%9A%84%E6%95%B0%E6%8D%AE%E5%B1%9E%E6%80%A7%E6%8F%8F%E8%BF%B0%E7%AC%A6%E3%80%81%E5%AD%98%E5%82%A8%E5%B1%9E%E6%80%A7%E6%8F%8F%E8%BF%B0%E7%AC%A6.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>彻底搞懂对象的数据属性描述符、存储属性描述符</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E6%B7%B1%E5%85%A5JavaScript%E6%95%B0%E6%8D%AE%E7%B1%BB%E5%9E%8B.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>深入JavaScript数据类型</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【用友金融】前端面试题总结.md\":\"e0d29045\",\"article_【快手】深入理解前端面试题.md\":\"8046ef7d\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"1578ca62\",\"article_【字节跳动】前端面试题总结.md\":\"43190517\",\"article_深入javascript数据类型.md\":\"38dc4212\",\"article_一文读懂事件冒泡与事件捕获.md\":\"fe1169b5\",\"article_一文读懂函数中this指向问题.md\":\"7daf1c2c\",\"article_从0实现一个年度报告.md\":\"669d6090\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"8dcbd06e\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"29921d41\",\"article_一文读懂伪类与伪元素.md\":\"21c09934\",\"article_深入理解proxy与reflect.md\":\"bf2ee51f\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"e8471f86\",\"index.md\":\"e5051aaf\",\"article_深入理解浏览器缓存机制.md\":\"3e63465b\",\"note_javascript.md\":\"4d381c29\",\"note_front-end engineering.md\":\"aeef7138\",\"article_深入理解浏览器运行原理.md\":\"1aff521c\",\"note_css.md\":\"59153b8f\",\"project_clipboardmanager_guide_index.md\":\"ab04688a\",\"project_clipboardmanager_index.md\":\"35b01af0\",\"project_clipboardmanager_log_index.md\":\"9969286e\",\"project_clipboardmanager_statement_index.md\":\"40104bd4\",\"project_clipboardmanager_vip_index.md\":\"1fa7dbf9\",\"project_markdown_index.md\":\"c4b57a91\",\"works_opensource.md\":\"490aa2ef\",\"works_contribution.md\":\"61ba57eb\",\"note_ssr.md\":\"639b8ecc\",\"project_markdown_shortcut_index.md\":\"9683b9fa\",\"project_markdown_log_index.md\":\"b2b946e7\",\"project_smartwordbreak_log_index.md\":\"22b8fbb4\",\"project_smartwordbreak_statement_index.md\":\"eb3de69f\",\"self_index.md\":\"ca70aa5a\",\"project_smartwordbreak_index.md\":\"2c4ac7f9\",\"note_javascriptenhanced.md\":\"22ea8715\"}")</script>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br><span class="line-number">12</span><br><span class="line-number">13</span><br><span class="line-number">14</span><br><span class="line-number">15</span><br><span class="line-number">16</span><br><span class="line-number">17</span><br><span class="line-number">18</span><br><span class="line-number">19</span><br><span class="line-number">20</span><br></div></div><p>通过 <code>defineProperty</code> 实现的响应式，<strong>不能检测</strong>数组和对象的变化：</p><p><strong>对于对象：</strong></p><p>Vue 无法检测 property 的添加或移除。</p><p>var vm = new Vue({ data:{ a:1 } }) // <code>vm.a</code> 是响应式的 vm.b = 2 // <code>vm.b</code> 是非响应式的</p><p><strong>对于数组：</strong></p><ol><li>当你利用索引直接设置一个数组项时，例如：<code>vm.items[indexOfItem] = newValue</code></li><li>当你修改数组的长度时，例如：<code>vm.items.length = newLength</code></li></ol><h2 id="🔰-vue3的响应式原理" tabindex="-1">🔰 Vue3的响应式原理 <a class="header-anchor" href="#🔰-vue3的响应式原理" aria-hidden="true">#</a></h2></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/浅析defineProperty与Proxy实现的双向绑定.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-12T04:33:56.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E5%BD%BB%E5%BA%95%E6%90%9E%E6%87%82%E5%AF%B9%E8%B1%A1%E7%9A%84%E6%95%B0%E6%8D%AE%E5%B1%9E%E6%80%A7%E6%8F%8F%E8%BF%B0%E7%AC%A6%E3%80%81%E5%AD%98%E5%82%A8%E5%B1%9E%E6%80%A7%E6%8F%8F%E8%BF%B0%E7%AC%A6.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>彻底搞懂对象的数据属性描述符、存储属性描述符</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E6%B7%B1%E5%85%A5JavaScript%E6%95%B0%E6%8D%AE%E7%B1%BB%E5%9E%8B.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>深入JavaScript数据类型</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【字节跳动】前端面试题总结.md\":\"2f59b10a\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"9cc1c756\",\"article_【快手】深入理解前端面试题.md\":\"5ba13f6e\",\"article_【用友金融】前端面试题总结.md\":\"6b88ba51\",\"article_一文读懂事件冒泡与事件捕获.md\":\"d079626e\",\"article_深入理解proxy与reflect.md\":\"130260d0\",\"article_一文读懂伪类与伪元素.md\":\"05f94b2f\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"1e34d909\",\"article_从0实现一个年度报告.md\":\"2916b0b7\",\"article_深入理解浏览器缓存机制.md\":\"93c602e7\",\"article_深入理解浏览器运行原理.md\":\"df749479\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"7675553c\",\"index.md\":\"e280b140\",\"note_front-end engineering.md\":\"a0520d36\",\"note_javascript.md\":\"566155dc\",\"article_一文读懂函数中this指向问题.md\":\"e7647b3c\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"6a4c39af\",\"article_深入javascript数据类型.md\":\"04cef1ae\",\"note_css.md\":\"3cb37354\",\"project_clipboardmanager_index.md\":\"b7d80b90\",\"project_clipboardmanager_log_index.md\":\"64442858\",\"project_smartwordbreak_log_index.md\":\"b62bc4d3\",\"project_clipboardmanager_statement_index.md\":\"cd56c4e7\",\"works_contribution.md\":\"ea9932f6\",\"project_markdown_index.md\":\"169e5462\",\"project_smartwordbreak_index.md\":\"e19a84fb\",\"self_index.md\":\"cb016208\",\"project_smartwordbreak_statement_index.md\":\"b15fb0e3\",\"project_markdown_shortcut_index.md\":\"c32f00fa\",\"project_markdown_log_index.md\":\"fa880a29\",\"project_clipboardmanager_guide_index.md\":\"0a98e9b1\",\"note_ssr.md\":\"ee9df2bb\",\"works_opensource.md\":\"2c78afab\",\"project_clipboardmanager_vip_index.md\":\"75960c2d\",\"note_javascriptenhanced.md\":\"c6f06cc2\"}")</script>
|
||||
<script type="module" async src="/assets/app.ab8d0b9f.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<link rel="preload stylesheet" href="/assets/style.edafdec9.css" as="style">
|
||||
<link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.107ab7ad.js">
|
||||
<link rel="modulepreload" href="/assets/app.ab8d0b9f.js">
|
||||
<link rel="modulepreload" href="/assets/article_深入JavaScript数据类型.md.38dc4212.lean.js">
|
||||
<link rel="modulepreload" href="/assets/article_深入JavaScript数据类型.md.04cef1ae.lean.js">
|
||||
|
||||
<link rel="icon" href="/logo.png">
|
||||
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||||
@@ -52,8 +52,8 @@
|
||||
<span class="line"><span style="color:#89DDFF;">}</span></span>
|
||||
<span class="line"></span>
|
||||
<span class="line"><span style="color:#A6ACCD;">console</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">log</span><span style="color:#A6ACCD;">(</span><span style="color:#82AAFF;">classof</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">{}</span><span style="color:#A6ACCD;">)) </span><span style="color:#676E95;font-style:italic;">// Object</span></span>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br></div></div><h3 id="核心原理" tabindex="-1">核心原理 <a class="header-anchor" href="#核心原理" aria-hidden="true">#</a></h3><p><a href="https://juejin.cn/post/6844903477940846600" target="_blank" rel="noreferrer">深入Object.prototype.toString</a></p><p>参考ECMA6规范文档：<a href="https://tc39.es/ecma262/multipage/fundamental-objects.html#sec-object.prototype.tostring" target="_blank" rel="noreferrer">Object.prototype.toString()</a></p><h4 id="es5标准下-object-prototype-tostring-执行原理" tabindex="-1">ES5标准下 <code>Object.prototype.toString</code> 执行原理 <a class="header-anchor" href="#es5标准下-object-prototype-tostring-执行原理" aria-hidden="true">#</a></h4><ul><li>如果 <code>this</code> 是 <code>undefined</code><ul><li>返回 <code>[object Undefined]</code></li></ul></li><li>如果 <code>this</code> 是 <code>null </code><ul><li>返回 <code>[object Null]</code></li></ul></li><li>令 <code>O</code> 为以 <code>this</code> 作为参数调用 <code>ToObject</code> 的结果</li><li>令 <code>class</code> 为 <code>O</code> 的内部属性 <code>[[Class]]</code> 的值</li><li>返回三个字符串 <code>"[object"</code> <code>class</code> 以及 <code>"]"</code> 拼接而成的字符串。</li></ul><h4 id="es6标准下-object-prototype-tostring-执行原理" tabindex="-1">ES6标准下 <code>Object.prototype.toString</code> 执行原理 <a class="header-anchor" href="#es6标准下-object-prototype-tostring-执行原理" aria-hidden="true">#</a></h4><p><code>Object.prototype.toString()</code>被调用时，会进行如下步骤：</p><p><img src="/assets/Object.prototype.toString.70e8308c.png" alt="Object.prototype.toString()"></p><p>在ES6里，之前的内部属性 <code>[[Class]]</code> 不再使用，取而代之的是一系列的 internal slot</p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/深入JavaScript数据类型.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-10T03:56:30.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E6%B5%85%E6%9E%90defineProperty%E4%B8%8EProxy%E5%AE%9E%E7%8E%B0%E7%9A%84%E5%8F%8C%E5%90%91%E7%BB%91%E5%AE%9A.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>浅析defineProperty与Proxy实现的双向绑定</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E6%B7%B1%E5%85%A5Vue3%E6%BA%90%E7%A0%81%EF%BC%8C%E7%9C%8B%E7%9C%8BVue.use%E5%90%8E%E7%A9%B6%E7%AB%9F%E5%8F%91%E7%94%9F%E4%BA%86%E4%BB%80%E4%B9%88%EF%BC%9F.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>深入Vue3源码，看看Vue.use后究竟发生了什么？</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【用友金融】前端面试题总结.md\":\"e0d29045\",\"article_【快手】深入理解前端面试题.md\":\"8046ef7d\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"1578ca62\",\"article_【字节跳动】前端面试题总结.md\":\"43190517\",\"article_深入javascript数据类型.md\":\"38dc4212\",\"article_一文读懂事件冒泡与事件捕获.md\":\"fe1169b5\",\"article_一文读懂函数中this指向问题.md\":\"7daf1c2c\",\"article_从0实现一个年度报告.md\":\"669d6090\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"8dcbd06e\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"29921d41\",\"article_一文读懂伪类与伪元素.md\":\"21c09934\",\"article_深入理解proxy与reflect.md\":\"bf2ee51f\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"e8471f86\",\"index.md\":\"e5051aaf\",\"article_深入理解浏览器缓存机制.md\":\"3e63465b\",\"note_javascript.md\":\"4d381c29\",\"note_front-end engineering.md\":\"aeef7138\",\"article_深入理解浏览器运行原理.md\":\"1aff521c\",\"note_css.md\":\"59153b8f\",\"project_clipboardmanager_guide_index.md\":\"ab04688a\",\"project_clipboardmanager_index.md\":\"35b01af0\",\"project_clipboardmanager_log_index.md\":\"9969286e\",\"project_clipboardmanager_statement_index.md\":\"40104bd4\",\"project_clipboardmanager_vip_index.md\":\"1fa7dbf9\",\"project_markdown_index.md\":\"c4b57a91\",\"works_opensource.md\":\"490aa2ef\",\"works_contribution.md\":\"61ba57eb\",\"note_ssr.md\":\"639b8ecc\",\"project_markdown_shortcut_index.md\":\"9683b9fa\",\"project_markdown_log_index.md\":\"b2b946e7\",\"project_smartwordbreak_log_index.md\":\"22b8fbb4\",\"project_smartwordbreak_statement_index.md\":\"eb3de69f\",\"self_index.md\":\"ca70aa5a\",\"project_smartwordbreak_index.md\":\"2c4ac7f9\",\"note_javascriptenhanced.md\":\"22ea8715\"}")</script>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br></div></div><h3 id="核心原理" tabindex="-1">核心原理 <a class="header-anchor" href="#核心原理" aria-hidden="true">#</a></h3><p><a href="https://juejin.cn/post/6844903477940846600" target="_blank" rel="noreferrer">深入Object.prototype.toString</a></p><p>参考ECMA6规范文档：<a href="https://tc39.es/ecma262/multipage/fundamental-objects.html#sec-object.prototype.tostring" target="_blank" rel="noreferrer">Object.prototype.toString()</a></p><h4 id="es5标准下-object-prototype-tostring-执行原理" tabindex="-1">ES5标准下 <code>Object.prototype.toString</code> 执行原理 <a class="header-anchor" href="#es5标准下-object-prototype-tostring-执行原理" aria-hidden="true">#</a></h4><ul><li>如果 <code>this</code> 是 <code>undefined</code><ul><li>返回 <code>[object Undefined]</code></li></ul></li><li>如果 <code>this</code> 是 <code>null </code><ul><li>返回 <code>[object Null]</code></li></ul></li><li>令 <code>O</code> 为以 <code>this</code> 作为参数调用 <code>ToObject</code> 的结果</li><li>令 <code>class</code> 为 <code>O</code> 的内部属性 <code>[[Class]]</code> 的值</li><li>返回三个字符串 <code>"[object"</code> <code>class</code> 以及 <code>"]"</code> 拼接而成的字符串。</li></ul><h4 id="es6标准下-object-prototype-tostring-执行原理" tabindex="-1">ES6标准下 <code>Object.prototype.toString</code> 执行原理 <a class="header-anchor" href="#es6标准下-object-prototype-tostring-执行原理" aria-hidden="true">#</a></h4><p><code>Object.prototype.toString()</code>被调用时，会进行如下步骤：</p><p><img src="/assets/Object.prototype.toString.70e8308c.png" alt="Object.prototype.toString()"></p><p>在ES6里，之前的内部属性 <code>[[Class]]</code> 不再使用，取而代之的是一系列的 internal slot</p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/深入JavaScript数据类型.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-12T04:33:56.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E6%B5%85%E6%9E%90defineProperty%E4%B8%8EProxy%E5%AE%9E%E7%8E%B0%E7%9A%84%E5%8F%8C%E5%90%91%E7%BB%91%E5%AE%9A.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>浅析defineProperty与Proxy实现的双向绑定</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E6%B7%B1%E5%85%A5Vue3%E6%BA%90%E7%A0%81%EF%BC%8C%E7%9C%8B%E7%9C%8BVue.use%E5%90%8E%E7%A9%B6%E7%AB%9F%E5%8F%91%E7%94%9F%E4%BA%86%E4%BB%80%E4%B9%88%EF%BC%9F.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>深入Vue3源码，看看Vue.use后究竟发生了什么？</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【字节跳动】前端面试题总结.md\":\"2f59b10a\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"9cc1c756\",\"article_【快手】深入理解前端面试题.md\":\"5ba13f6e\",\"article_【用友金融】前端面试题总结.md\":\"6b88ba51\",\"article_一文读懂事件冒泡与事件捕获.md\":\"d079626e\",\"article_深入理解proxy与reflect.md\":\"130260d0\",\"article_一文读懂伪类与伪元素.md\":\"05f94b2f\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"1e34d909\",\"article_从0实现一个年度报告.md\":\"2916b0b7\",\"article_深入理解浏览器缓存机制.md\":\"93c602e7\",\"article_深入理解浏览器运行原理.md\":\"df749479\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"7675553c\",\"index.md\":\"e280b140\",\"note_front-end engineering.md\":\"a0520d36\",\"note_javascript.md\":\"566155dc\",\"article_一文读懂函数中this指向问题.md\":\"e7647b3c\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"6a4c39af\",\"article_深入javascript数据类型.md\":\"04cef1ae\",\"note_css.md\":\"3cb37354\",\"project_clipboardmanager_index.md\":\"b7d80b90\",\"project_clipboardmanager_log_index.md\":\"64442858\",\"project_smartwordbreak_log_index.md\":\"b62bc4d3\",\"project_clipboardmanager_statement_index.md\":\"cd56c4e7\",\"works_contribution.md\":\"ea9932f6\",\"project_markdown_index.md\":\"169e5462\",\"project_smartwordbreak_index.md\":\"e19a84fb\",\"self_index.md\":\"cb016208\",\"project_smartwordbreak_statement_index.md\":\"b15fb0e3\",\"project_markdown_shortcut_index.md\":\"c32f00fa\",\"project_markdown_log_index.md\":\"fa880a29\",\"project_clipboardmanager_guide_index.md\":\"0a98e9b1\",\"note_ssr.md\":\"ee9df2bb\",\"works_opensource.md\":\"2c78afab\",\"project_clipboardmanager_vip_index.md\":\"75960c2d\",\"note_javascriptenhanced.md\":\"c6f06cc2\"}")</script>
|
||||
<script type="module" async src="/assets/app.ab8d0b9f.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<link rel="preload stylesheet" href="/assets/style.edafdec9.css" as="style">
|
||||
<link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.107ab7ad.js">
|
||||
<link rel="modulepreload" href="/assets/app.ab8d0b9f.js">
|
||||
<link rel="modulepreload" href="/assets/article_深入Vue3源码，看看Vue.use后究竟发生了什么？.md.e8471f86.lean.js">
|
||||
<link rel="modulepreload" href="/assets/article_深入Vue3源码，看看Vue.use后究竟发生了什么？.md.7675553c.lean.js">
|
||||
|
||||
<link rel="icon" href="/logo.png">
|
||||
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||||
@@ -120,8 +120,8 @@
|
||||
<span class="line"></span>
|
||||
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> app </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">createApp</span><span style="color:#A6ACCD;">(App)</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">use</span><span style="color:#A6ACCD;">(registerElement)</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;">app</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">mount</span><span style="color:#A6ACCD;">(</span><span style="color:#89DDFF;">'</span><span style="color:#C3E88D;">#app</span><span style="color:#89DDFF;">'</span><span style="color:#A6ACCD;">)</span></span>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br></div></div><p>当有新的需要使用的组件时，只需要到<code>register-element.ts</code>文件中引入一次即可。</p><h2 id="参考阅读" tabindex="-1">参考阅读 <a class="header-anchor" href="#参考阅读" aria-hidden="true">#</a></h2><p><a href="https://vuejs.org/api/application.html#app-use" target="_blank" rel="noreferrer">Vue文档: App.use</a></p><p><a href="https://vuejs.org/guide/reusability/plugins.html" target="_blank" rel="noreferrer">Vue文档: Plugins</a></p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/深入Vue3源码，看看Vue.use后究竟发生了什么？.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-10T03:56:30.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E6%B7%B1%E5%85%A5JavaScript%E6%95%B0%E6%8D%AE%E7%B1%BB%E5%9E%8B.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>深入JavaScript数据类型</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E6%B7%B1%E5%85%A5%E7%90%86%E8%A7%A3Proxy%E4%B8%8EReflect.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>深入理解Proxy与Reflect</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【用友金融】前端面试题总结.md\":\"e0d29045\",\"article_【快手】深入理解前端面试题.md\":\"8046ef7d\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"1578ca62\",\"article_【字节跳动】前端面试题总结.md\":\"43190517\",\"article_深入javascript数据类型.md\":\"38dc4212\",\"article_一文读懂事件冒泡与事件捕获.md\":\"fe1169b5\",\"article_一文读懂函数中this指向问题.md\":\"7daf1c2c\",\"article_从0实现一个年度报告.md\":\"669d6090\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"8dcbd06e\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"29921d41\",\"article_一文读懂伪类与伪元素.md\":\"21c09934\",\"article_深入理解proxy与reflect.md\":\"bf2ee51f\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"e8471f86\",\"index.md\":\"e5051aaf\",\"article_深入理解浏览器缓存机制.md\":\"3e63465b\",\"note_javascript.md\":\"4d381c29\",\"note_front-end engineering.md\":\"aeef7138\",\"article_深入理解浏览器运行原理.md\":\"1aff521c\",\"note_css.md\":\"59153b8f\",\"project_clipboardmanager_guide_index.md\":\"ab04688a\",\"project_clipboardmanager_index.md\":\"35b01af0\",\"project_clipboardmanager_log_index.md\":\"9969286e\",\"project_clipboardmanager_statement_index.md\":\"40104bd4\",\"project_clipboardmanager_vip_index.md\":\"1fa7dbf9\",\"project_markdown_index.md\":\"c4b57a91\",\"works_opensource.md\":\"490aa2ef\",\"works_contribution.md\":\"61ba57eb\",\"note_ssr.md\":\"639b8ecc\",\"project_markdown_shortcut_index.md\":\"9683b9fa\",\"project_markdown_log_index.md\":\"b2b946e7\",\"project_smartwordbreak_log_index.md\":\"22b8fbb4\",\"project_smartwordbreak_statement_index.md\":\"eb3de69f\",\"self_index.md\":\"ca70aa5a\",\"project_smartwordbreak_index.md\":\"2c4ac7f9\",\"note_javascriptenhanced.md\":\"22ea8715\"}")</script>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br></div></div><p>当有新的需要使用的组件时，只需要到<code>register-element.ts</code>文件中引入一次即可。</p><h2 id="参考阅读" tabindex="-1">参考阅读 <a class="header-anchor" href="#参考阅读" aria-hidden="true">#</a></h2><p><a href="https://vuejs.org/api/application.html#app-use" target="_blank" rel="noreferrer">Vue文档: App.use</a></p><p><a href="https://vuejs.org/guide/reusability/plugins.html" target="_blank" rel="noreferrer">Vue文档: Plugins</a></p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/深入Vue3源码，看看Vue.use后究竟发生了什么？.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-12T04:33:56.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E6%B7%B1%E5%85%A5JavaScript%E6%95%B0%E6%8D%AE%E7%B1%BB%E5%9E%8B.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>深入JavaScript数据类型</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E6%B7%B1%E5%85%A5%E7%90%86%E8%A7%A3Proxy%E4%B8%8EReflect.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>深入理解Proxy与Reflect</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【字节跳动】前端面试题总结.md\":\"2f59b10a\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"9cc1c756\",\"article_【快手】深入理解前端面试题.md\":\"5ba13f6e\",\"article_【用友金融】前端面试题总结.md\":\"6b88ba51\",\"article_一文读懂事件冒泡与事件捕获.md\":\"d079626e\",\"article_深入理解proxy与reflect.md\":\"130260d0\",\"article_一文读懂伪类与伪元素.md\":\"05f94b2f\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"1e34d909\",\"article_从0实现一个年度报告.md\":\"2916b0b7\",\"article_深入理解浏览器缓存机制.md\":\"93c602e7\",\"article_深入理解浏览器运行原理.md\":\"df749479\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"7675553c\",\"index.md\":\"e280b140\",\"note_front-end engineering.md\":\"a0520d36\",\"note_javascript.md\":\"566155dc\",\"article_一文读懂函数中this指向问题.md\":\"e7647b3c\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"6a4c39af\",\"article_深入javascript数据类型.md\":\"04cef1ae\",\"note_css.md\":\"3cb37354\",\"project_clipboardmanager_index.md\":\"b7d80b90\",\"project_clipboardmanager_log_index.md\":\"64442858\",\"project_smartwordbreak_log_index.md\":\"b62bc4d3\",\"project_clipboardmanager_statement_index.md\":\"cd56c4e7\",\"works_contribution.md\":\"ea9932f6\",\"project_markdown_index.md\":\"169e5462\",\"project_smartwordbreak_index.md\":\"e19a84fb\",\"self_index.md\":\"cb016208\",\"project_smartwordbreak_statement_index.md\":\"b15fb0e3\",\"project_markdown_shortcut_index.md\":\"c32f00fa\",\"project_markdown_log_index.md\":\"fa880a29\",\"project_clipboardmanager_guide_index.md\":\"0a98e9b1\",\"note_ssr.md\":\"ee9df2bb\",\"works_opensource.md\":\"2c78afab\",\"project_clipboardmanager_vip_index.md\":\"75960c2d\",\"note_javascriptenhanced.md\":\"c6f06cc2\"}")</script>
|
||||
<script type="module" async src="/assets/app.ab8d0b9f.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<link rel="preload stylesheet" href="/assets/style.edafdec9.css" as="style">
|
||||
<link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.107ab7ad.js">
|
||||
<link rel="modulepreload" href="/assets/app.ab8d0b9f.js">
|
||||
<link rel="modulepreload" href="/assets/article_深入理解Proxy与Reflect.md.bf2ee51f.lean.js">
|
||||
<link rel="modulepreload" href="/assets/article_深入理解Proxy与Reflect.md.130260d0.lean.js">
|
||||
|
||||
<link rel="icon" href="/logo.png">
|
||||
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||||
@@ -172,8 +172,8 @@
|
||||
<span class="line"></span>
|
||||
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> stu </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">new</span><span style="color:#A6ACCD;"> Reflect</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">construct</span><span style="color:#A6ACCD;">(Person</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> [</span><span style="color:#89DDFF;">'</span><span style="color:#C3E88D;">ziu</span><span style="color:#89DDFF;">'</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> </span><span style="color:#F78C6C;">18</span><span style="color:#A6ACCD;">]</span><span style="color:#89DDFF;">,</span><span style="color:#A6ACCD;"> Student)</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;">console</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">log</span><span style="color:#A6ACCD;">(stu)</span></span>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br></div></div></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/深入理解Proxy与Reflect.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-10T03:56:30.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E6%B7%B1%E5%85%A5Vue3%E6%BA%90%E7%A0%81%EF%BC%8C%E7%9C%8B%E7%9C%8BVue.use%E5%90%8E%E7%A9%B6%E7%AB%9F%E5%8F%91%E7%94%9F%E4%BA%86%E4%BB%80%E4%B9%88%EF%BC%9F.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>深入Vue3源码，看看Vue.use后究竟发生了什么？</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E6%B7%B1%E5%85%A5%E7%90%86%E8%A7%A3%E6%B5%8F%E8%A7%88%E5%99%A8%E7%BC%93%E5%AD%98%E6%9C%BA%E5%88%B6.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>深入理解浏览器缓存机制</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【用友金融】前端面试题总结.md\":\"e0d29045\",\"article_【快手】深入理解前端面试题.md\":\"8046ef7d\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"1578ca62\",\"article_【字节跳动】前端面试题总结.md\":\"43190517\",\"article_深入javascript数据类型.md\":\"38dc4212\",\"article_一文读懂事件冒泡与事件捕获.md\":\"fe1169b5\",\"article_一文读懂函数中this指向问题.md\":\"7daf1c2c\",\"article_从0实现一个年度报告.md\":\"669d6090\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"8dcbd06e\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"29921d41\",\"article_一文读懂伪类与伪元素.md\":\"21c09934\",\"article_深入理解proxy与reflect.md\":\"bf2ee51f\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"e8471f86\",\"index.md\":\"e5051aaf\",\"article_深入理解浏览器缓存机制.md\":\"3e63465b\",\"note_javascript.md\":\"4d381c29\",\"note_front-end engineering.md\":\"aeef7138\",\"article_深入理解浏览器运行原理.md\":\"1aff521c\",\"note_css.md\":\"59153b8f\",\"project_clipboardmanager_guide_index.md\":\"ab04688a\",\"project_clipboardmanager_index.md\":\"35b01af0\",\"project_clipboardmanager_log_index.md\":\"9969286e\",\"project_clipboardmanager_statement_index.md\":\"40104bd4\",\"project_clipboardmanager_vip_index.md\":\"1fa7dbf9\",\"project_markdown_index.md\":\"c4b57a91\",\"works_opensource.md\":\"490aa2ef\",\"works_contribution.md\":\"61ba57eb\",\"note_ssr.md\":\"639b8ecc\",\"project_markdown_shortcut_index.md\":\"9683b9fa\",\"project_markdown_log_index.md\":\"b2b946e7\",\"project_smartwordbreak_log_index.md\":\"22b8fbb4\",\"project_smartwordbreak_statement_index.md\":\"eb3de69f\",\"self_index.md\":\"ca70aa5a\",\"project_smartwordbreak_index.md\":\"2c4ac7f9\",\"note_javascriptenhanced.md\":\"22ea8715\"}")</script>
|
||||
<span class="line"></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br></div></div></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/深入理解Proxy与Reflect.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-12T04:33:56.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E6%B7%B1%E5%85%A5Vue3%E6%BA%90%E7%A0%81%EF%BC%8C%E7%9C%8B%E7%9C%8BVue.use%E5%90%8E%E7%A9%B6%E7%AB%9F%E5%8F%91%E7%94%9F%E4%BA%86%E4%BB%80%E4%B9%88%EF%BC%9F.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>深入Vue3源码，看看Vue.use后究竟发生了什么？</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/article/%E6%B7%B1%E5%85%A5%E7%90%86%E8%A7%A3%E6%B5%8F%E8%A7%88%E5%99%A8%E7%BC%93%E5%AD%98%E6%9C%BA%E5%88%B6.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>深入理解浏览器缓存机制</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【字节跳动】前端面试题总结.md\":\"2f59b10a\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"9cc1c756\",\"article_【快手】深入理解前端面试题.md\":\"5ba13f6e\",\"article_【用友金融】前端面试题总结.md\":\"6b88ba51\",\"article_一文读懂事件冒泡与事件捕获.md\":\"d079626e\",\"article_深入理解proxy与reflect.md\":\"130260d0\",\"article_一文读懂伪类与伪元素.md\":\"05f94b2f\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"1e34d909\",\"article_从0实现一个年度报告.md\":\"2916b0b7\",\"article_深入理解浏览器缓存机制.md\":\"93c602e7\",\"article_深入理解浏览器运行原理.md\":\"df749479\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"7675553c\",\"index.md\":\"e280b140\",\"note_front-end engineering.md\":\"a0520d36\",\"note_javascript.md\":\"566155dc\",\"article_一文读懂函数中this指向问题.md\":\"e7647b3c\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"6a4c39af\",\"article_深入javascript数据类型.md\":\"04cef1ae\",\"note_css.md\":\"3cb37354\",\"project_clipboardmanager_index.md\":\"b7d80b90\",\"project_clipboardmanager_log_index.md\":\"64442858\",\"project_smartwordbreak_log_index.md\":\"b62bc4d3\",\"project_clipboardmanager_statement_index.md\":\"cd56c4e7\",\"works_contribution.md\":\"ea9932f6\",\"project_markdown_index.md\":\"169e5462\",\"project_smartwordbreak_index.md\":\"e19a84fb\",\"self_index.md\":\"cb016208\",\"project_smartwordbreak_statement_index.md\":\"b15fb0e3\",\"project_markdown_shortcut_index.md\":\"c32f00fa\",\"project_markdown_log_index.md\":\"fa880a29\",\"project_clipboardmanager_guide_index.md\":\"0a98e9b1\",\"note_ssr.md\":\"ee9df2bb\",\"works_opensource.md\":\"2c78afab\",\"project_clipboardmanager_vip_index.md\":\"75960c2d\",\"note_javascriptenhanced.md\":\"c6f06cc2\"}")</script>
|
||||
<script type="module" async src="/assets/app.ab8d0b9f.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -8,7 +8,7 @@
|
||||
<link rel="preload stylesheet" href="/assets/style.edafdec9.css" as="style">
|
||||
<link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.107ab7ad.js">
|
||||
<link rel="modulepreload" href="/assets/app.ab8d0b9f.js">
|
||||
<link rel="modulepreload" href="/assets/article_深入理解浏览器运行原理.md.1aff521c.lean.js">
|
||||
<link rel="modulepreload" href="/assets/article_深入理解浏览器运行原理.md.df749479.lean.js">
|
||||
|
||||
<link rel="icon" href="/logo.png">
|
||||
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
|
||||
@@ -74,8 +74,8 @@
|
||||
<span class="line"><span style="color:#A6ACCD;"></span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br></div></div><p>上述代码在控制台的输出为：</p><div class="language- line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#A6ACCD;">script enter</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;">defer script enter</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;">DOMContentLoaded enter</span></span>
|
||||
<span class="line"><span style="color:#A6ACCD;"></span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br></div></div><ul><li>多个带<code>defer</code>的脚本也是按照自上至下的顺序执行的</li><li>从某种角度来说，<code>defer</code>可以提高页面的性能，并且推荐放到<code>head</code>元素中</li><li>注意：<code>defer</code>仅适用于外部脚本，对于<code>script</code>标签内编写的默认<code>JS</code>代码会被忽略掉</li></ul><h2 id="async属性" tabindex="-1">async属性 <a class="header-anchor" href="#async属性" aria-hidden="true">#</a></h2><p><code>async</code>属性也可以做到：让脚本异步加载而不阻塞DOM树的构建，它与<code>defer</code>的区别：</p><ul><li>用<code>async</code>标记的脚本是<strong>完全独立</strong>的</li><li><code>async</code>脚本不能保证执行顺序，因为它是独立下载、独立运行，不会等待其他脚本</li><li>使用<code>async</code>标记的脚本不会保证它将在<code>DOMContentLoaded</code>之前或之后被执行</li></ul><p>要使用<code>async</code>属性标记的<code>script</code>操作DOM，必须在其中使用<code>DOMContentLoaded</code>监听器的回调函数，在该事件触发（DOM树构建完毕）后，执行相应的回调函数</p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/深入理解浏览器运行原理.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-10T03:56:30.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E6%B7%B1%E5%85%A5%E7%90%86%E8%A7%A3%E6%B5%8F%E8%A7%88%E5%99%A8%E7%BC%93%E5%AD%98%E6%9C%BA%E5%88%B6.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>深入理解浏览器缓存机制</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/note/JavaScript.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>JavaScript基础</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【用友金融】前端面试题总结.md\":\"e0d29045\",\"article_【快手】深入理解前端面试题.md\":\"8046ef7d\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"1578ca62\",\"article_【字节跳动】前端面试题总结.md\":\"43190517\",\"article_深入javascript数据类型.md\":\"38dc4212\",\"article_一文读懂事件冒泡与事件捕获.md\":\"fe1169b5\",\"article_一文读懂函数中this指向问题.md\":\"7daf1c2c\",\"article_从0实现一个年度报告.md\":\"669d6090\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"8dcbd06e\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"29921d41\",\"article_一文读懂伪类与伪元素.md\":\"21c09934\",\"article_深入理解proxy与reflect.md\":\"bf2ee51f\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"e8471f86\",\"index.md\":\"e5051aaf\",\"article_深入理解浏览器缓存机制.md\":\"3e63465b\",\"note_javascript.md\":\"4d381c29\",\"note_front-end engineering.md\":\"aeef7138\",\"article_深入理解浏览器运行原理.md\":\"1aff521c\",\"note_css.md\":\"59153b8f\",\"project_clipboardmanager_guide_index.md\":\"ab04688a\",\"project_clipboardmanager_index.md\":\"35b01af0\",\"project_clipboardmanager_log_index.md\":\"9969286e\",\"project_clipboardmanager_statement_index.md\":\"40104bd4\",\"project_clipboardmanager_vip_index.md\":\"1fa7dbf9\",\"project_markdown_index.md\":\"c4b57a91\",\"works_opensource.md\":\"490aa2ef\",\"works_contribution.md\":\"61ba57eb\",\"note_ssr.md\":\"639b8ecc\",\"project_markdown_shortcut_index.md\":\"9683b9fa\",\"project_markdown_log_index.md\":\"b2b946e7\",\"project_smartwordbreak_log_index.md\":\"22b8fbb4\",\"project_smartwordbreak_statement_index.md\":\"eb3de69f\",\"self_index.md\":\"ca70aa5a\",\"project_smartwordbreak_index.md\":\"2c4ac7f9\",\"note_javascriptenhanced.md\":\"22ea8715\"}")</script>
|
||||
<span class="line"><span style="color:#A6ACCD;"></span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br></div></div><ul><li>多个带<code>defer</code>的脚本也是按照自上至下的顺序执行的</li><li>从某种角度来说，<code>defer</code>可以提高页面的性能，并且推荐放到<code>head</code>元素中</li><li>注意：<code>defer</code>仅适用于外部脚本，对于<code>script</code>标签内编写的默认<code>JS</code>代码会被忽略掉</li></ul><h2 id="async属性" tabindex="-1">async属性 <a class="header-anchor" href="#async属性" aria-hidden="true">#</a></h2><p><code>async</code>属性也可以做到：让脚本异步加载而不阻塞DOM树的构建，它与<code>defer</code>的区别：</p><ul><li>用<code>async</code>标记的脚本是<strong>完全独立</strong>的</li><li><code>async</code>脚本不能保证执行顺序，因为它是独立下载、独立运行，不会等待其他脚本</li><li>使用<code>async</code>标记的脚本不会保证它将在<code>DOMContentLoaded</code>之前或之后被执行</li></ul><p>要使用<code>async</code>属性标记的<code>script</code>操作DOM，必须在其中使用<code>DOMContentLoaded</code>监听器的回调函数，在该事件触发（DOM树构建完毕）后，执行相应的回调函数</p></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-30dabfe4 data-v-cc0f9778><div class="edit-info" data-v-cc0f9778><div class="edit-link" data-v-cc0f9778><a class="VPLink link edit-link-button" href="https://github.com/ZiuChen/ZiuChen.github.io/edit/main/docs/article/深入理解浏览器运行原理.md" target="_blank" rel="noreferrer" data-v-cc0f9778 data-v-8dd200cc><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-cc0f9778><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page on GitHub<!--]--><!----></a></div><div class="last-updated" data-v-cc0f9778><p class="VPLastUpdated" data-v-cc0f9778 data-v-de6a4e1f>Updated Date: <time datetime="2023-04-12T04:33:56.000Z" data-v-de6a4e1f></time></p></div></div><div class="prev-next" data-v-cc0f9778><div class="pager" data-v-cc0f9778><a class="pager-link prev" href="/article/%E6%B7%B1%E5%85%A5%E7%90%86%E8%A7%A3%E6%B5%8F%E8%A7%88%E5%99%A8%E7%BC%93%E5%AD%98%E6%9C%BA%E5%88%B6.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Previous page</span><span class="title" data-v-cc0f9778>深入理解浏览器缓存机制</span></a></div><div class="has-prev pager" data-v-cc0f9778><a class="pager-link next" href="/note/JavaScript.html" data-v-cc0f9778><span class="desc" data-v-cc0f9778>Next page</span><span class="title" data-v-cc0f9778>JavaScript基础</span></a></div></div></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter has-sidebar" data-v-3af881ed data-v-8b655284><div class="container" data-v-8b655284><p class="message" data-v-8b655284>Released under the MIT License.</p><p class="copyright" data-v-8b655284>Copyright © 2019-present Ziu Chen</p></div></footer><!--[--><!--]--></div></div>
|
||||
<script>__VP_HASH_MAP__ = JSON.parse("{\"article_【字节跳动】前端面试题总结.md\":\"2f59b10a\",\"article_【2023】青训营 - 前端练习题汇总解析.md\":\"9cc1c756\",\"article_【快手】深入理解前端面试题.md\":\"5ba13f6e\",\"article_【用友金融】前端面试题总结.md\":\"6b88ba51\",\"article_一文读懂事件冒泡与事件捕获.md\":\"d079626e\",\"article_深入理解proxy与reflect.md\":\"130260d0\",\"article_一文读懂伪类与伪元素.md\":\"05f94b2f\",\"article_彻底搞懂对象的数据属性描述符、存储属性描述符.md\":\"1e34d909\",\"article_从0实现一个年度报告.md\":\"2916b0b7\",\"article_深入理解浏览器缓存机制.md\":\"93c602e7\",\"article_深入理解浏览器运行原理.md\":\"df749479\",\"article_深入vue3源码，看看vue.use后究竟发生了什么？.md\":\"7675553c\",\"index.md\":\"e280b140\",\"note_front-end engineering.md\":\"a0520d36\",\"note_javascript.md\":\"566155dc\",\"article_一文读懂函数中this指向问题.md\":\"e7647b3c\",\"article_浅析defineproperty与proxy实现的双向绑定.md\":\"6a4c39af\",\"article_深入javascript数据类型.md\":\"04cef1ae\",\"note_css.md\":\"3cb37354\",\"project_clipboardmanager_index.md\":\"b7d80b90\",\"project_clipboardmanager_log_index.md\":\"64442858\",\"project_smartwordbreak_log_index.md\":\"b62bc4d3\",\"project_clipboardmanager_statement_index.md\":\"cd56c4e7\",\"works_contribution.md\":\"ea9932f6\",\"project_markdown_index.md\":\"169e5462\",\"project_smartwordbreak_index.md\":\"e19a84fb\",\"self_index.md\":\"cb016208\",\"project_smartwordbreak_statement_index.md\":\"b15fb0e3\",\"project_markdown_shortcut_index.md\":\"c32f00fa\",\"project_markdown_log_index.md\":\"fa880a29\",\"project_clipboardmanager_guide_index.md\":\"0a98e9b1\",\"note_ssr.md\":\"ee9df2bb\",\"works_opensource.md\":\"2c78afab\",\"project_clipboardmanager_vip_index.md\":\"75960c2d\",\"note_javascriptenhanced.md\":\"c6f06cc2\"}")</script>
|
||||
<script type="module" async src="/assets/app.ab8d0b9f.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user